Question

function addDoctorLocation(lat,longt) 
    {
      var myLatlng = new google.maps.LatLng(parseFloat(lat), parseFloat(longt));
      var myOptions = {
        zoom: 10,
        center: myLatlng,
        mapTypeId: google.maps.MapTypeId.ROADMAP
      }
     //var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

     var marker = new google.maps.Marker({
          position: myLatlng,
          title:"Hello World!"
      });

      // To add the marker to the map, call setMap();
      var map = Ext.getCmp('mygooglemap');
      marker.setMap(map); 
    }

var btn= Ext.getCmp('button');
btn.on('onclick', function(){
            addDoctorLocation(3.951941,102.052002);
    })

mygooglemap是GMappanel
如何点击按钮，然后gmappanel将添加一个坐标为3.951941,102.052002的标记？我试过这段代码，但还是行不通？

更新

复选框怎么样？

tree.on('checkchange', function(node){
  var data = node.data;
  if (data.checked = true){
     var options = {
       lat:3.951941,
       lng:-102.052002,
       marker: {title:"Hello World!"},
       listeners: {
         click: function(e){
         }
       }     
     }
     addDoctorLocation(options);
  }     
})

MAP CREATION

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,{
                    xtype: 'gmappanel',
                    id : 'mygooglemap',
                    gmapType: 'map',
                    zoomLevel: 7,
                    mapConfOpts: ['enableScrollWheelZoom','enableDoubleClickZoom','enableDragging'],
                    mapControls: ['GSmallMapControl','GMapTypeControl','NonExistantControl'],  
                    setCenter: {
                        lat: 3.951941,
                        lng: 102.052002,
                    }
                }],
            renderTo: Ext.getBody() //get the body and display Layout at there
        });
    });

我检查fireBug后错误是：

ReferenceError: GLatLng is not defined
[Break On This Error]   
var mpoint = new GLatLng(options.lat,options.lng);

我编辑了如下代码，工作正常

function addDoctorLocation(options) 
{
 var gm = Ext.getCmp('mygooglemap');
 var mpoint = new google.maps.LatLng(options.lat,options.lng);
 gm.addMarker(mpoint,options.marker,false,false, options.listeners);
}

Answer 1

var btn= Ext.getCmp('button');
btn.on('onclick', function(){
  var options = {
    lat:3.951941,
    lng:-102.052002,
    marker: {title:"Hello World!"},
    listeners: {
     click: function(e){

     }
    }                
   }     
   addDoctorLocation(options);
})

function addDoctorLocation(options) 
{

 var gm = Ext.getCmp('mygooglemap');
 var mpoint = new GLatLng(options.lat,options.lng);
 gm.addMarker(mpoint,options.marker,false,false, options.listeners);
}

注意： - 此代码只是添加中心点以外的标记。此时，您应该使用＆id; id：mygooglemap＆＃39;创建地图。查看代码，看起来您正在尝试创建新地图，而不是在现有地图上添加标记。

您可以随时将GMapPanel.js文件引用到extjs包附带的addMarker函数中。我有旧版本所以addMarker调用是相应的。

GmapPanel在点击时添加标记 - EXTJS

更新

MAP CREATION

1 个答案: