GMapPanel沒有顯示標記

Question

我正在學習如何使用Ext.js，所以我真的很新鮮。

我使用Google地圖API構建了一個地圖，並且我正在嘗試將標記添加到特定位置，但標記未顯示，並且我的控制檯上也沒有收到任何錯誤，我唯一能做的就是看到的是地圖本身，我想知道我在這裏做錯了什麼。

我的代碼：

Ext.onReady(function() { 
    var w = Ext.create('Ext.window.Window', { 
     height: 400, 
     width: 600, 
     layout: 'fit', 
     header: false, 
     border: false, 
     style: 'padding: 0; border-width: 0;', 
     closable: false, 
     draggable: false, 
     height: Ext.getBody().getViewSize().height, 
     width: Ext.getBody().getViewSize().width, 
     items: [{ 
      xtype: 'gmappanel', 
      region: 'center', 
      cls: 'reset-box-sizing', 
      center: new google.maps.LatLng(53.419824, -3.0509294), 
      mapOptions: { 
       zoom: 16, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
     }] 
    }); 

    var options = { 
     lat: 53.419824, 
     lng: -3.0509294, 
     marker: { 
      title: "Hello World!" 
     }, 
     listeners: { 
      click: function (e) { 

      } 
     } 
    }; 

    addLocation(options); 

    function addLocation(options) { 

     var gm = w.down('gmappanel'); 
     var mpoint = new google.maps.LatLng(options.lat, options.lng); 

     var marker = gm.addMarker(mpoint, options.marker, false, false, options.listeners); 


     var infowindow = new google.maps.InfoWindow({ 
      content: "Some label" 
     }); 
     google.maps.event.addListener(marker, 'click', function (gm, marker) { 
      infowindow.open(gm, marker); // if still you can not open than use infowindow.open(gm, this) 
     }); 
    } 

    w.show(); 
}); 

謝謝。

Answer 1

嘗試創建標記用下面的代碼：

var markers = []; 

var mpoint = new google.maps.LatLng(options.lat, options.lng); 

var marker = new google.maps.Marker({ 
    position: mpoint, 
    title: options['marker']['title'] 
}); 

var infowindow = new google.maps.InfoWindow({ 
    content: "Some label" 
}); 

google.maps.event.addListener(marker, 'click', function (gm, marker) { 
    infowindow.open(gm, marker); // if still you can not open than use infowindow.open(gm, this) 
}); 

markers.push(marker); 

gm.markers = markers; 

，甚至更簡單

var gm = w.down('gmappanel'); 
var markers = []; 

markers.push(marker); 

gm.markers = markers; 

您可以在這裏找到工作實例https://fiddle.sencha.com/#fiddle/1rt5