1
Ext.Loader.setPath('Ext.ux', '../ux');
Ext.require([
    'Ext.tree.*',
    'Ext.data.*',
    'Ext.window.MessageBox',
    'Ext.window.*',
    'Ext.ux.GMapPanel'
]);

var map = new Ext.ux.GMapPanel({
            xtype: 'gmappanel',
            region: 'center',
            id:  'mygooglemap',
            zoomLevel: 3,
            gmapType: 'map',
            setCenter: {
                'lat': 37.4419,
                'lng': -122.1419
            }
        });

    var layout = Ext.create('Ext.panel.Panel', {
            //renderTo: 'layout',
            width: window.innerWidth,
            height: window.innerHeight,
            //title: 'Border Layout', //no title will be blank
            layout: 'border',
            items: [{
                title: 'Message List',
                region: 'south',     // position for region
                xtype: 'panel',
                height: 100,
                split: true,         // enable resizing
                collapsible: true,
                margins: '0 5 5 5',
                collapsed: true
            },tree,map],
            renderTo: Ext.getBody() //get the body and display Layout at there
        });

質問

すべてのロードが成功しました。tree という名前のツリーパネルも正常にロードされました。地図だけ GMapPanel で Google マップを表示できません。なぜですか?助けてください。ありがとうございます。何も思いつきません

これを私が撮ったスクリーンショットを更新してください。ページはGoogleマップをロードするはずですが、空白です ここに画像の説明を入力

4

2 に答える 2

1

マップの作成中に、サイド setCenter にマーカー オブジェクトを追加することができます。

マップ コードを次のように変更します。

var map = new Ext.ux.GMapPanel({
        xtype: 'gmappanel',
        region: 'center',
        id:  'mygooglemap',
        zoomLevel: 3,
        gmapType: 'map',
        mapConfOpts:['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
        mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],   
        setCenter: {
            'lat': 37.4419,
            'lng': -122.1419,
            marker:{ title: 'Palo Alto'}
        }
    });
于 2013-02-19T17:54:06.567 に答える
1

追加したことを確認してください

<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3&sensor=false"></script>

index.html で、まだ行っている場合は、デバッグ ブラウザー ツールを使用して、投稿していないエラーがあるかどうかを確認すると役立ちます。

于 2014-03-13T15:08:20.113 に答える