0

这是使用 idmygooglemap代码创建 googlemap 面板

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
        });
    });

这是当检查树单击复选框并且复选框的状态为真时,然后在 googlemap 上添加标记

 Ext.define('GoogleMarkerModel', {
            extend: 'Ext.data.Model',
            fields: ['Locating','MainPower','Acc','PowerOff','Alarm','Speed','Direction','Latitude','Longitude','DateTime','MainID', 'DeviceID','IOState','OilState']
        });

        var MarkerStore = Ext.create('Ext.data.JsonStore', {
            model: 'GoogleMarkerModel',
            autoLoad: true,
            proxy: {
                type: 'ajax',
                url: 'get-googlemarker.php',
                baseParams: {  //here you can define params you want to be sent on each request from this store
                            mainid: 'value1'
                            },
                reader: {
                    type: 'json',
                    root: 'images'
                }
            }
        });

        tree.on('checkchange', function(node){
            var data = node.data;
            Ext.MessageBox.show({
            title: 'Changed checkbox status',
            msg: 'MainID: ' + data.MainID + ' <br /> Checkbox status: ' + data.checked,
            icon: Ext.MessageBox.INFO
            });
            if (data.checked = true){

                MarkerStore.load({
                            params: {
                                    mainid: data.MainID
                                    }
                            })  
                         //after markerstore get the longtitude and latitude,add google map a marker at here
            }
        })

当复选框被选中时,然后将传递一个 idget-googlemarker.php并在 MarkerStore 的数据库存储中获取最新的经度和纬度,并在 googlemap 上显示标记。
所有编码都完成了,只是在googlemap上留下了添加标记,如何在googlemap上动态添加标记?
标记将在函数内部创建tree.on('checkchange', function(node)

4

1 回答 1

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

tree.on('checkchange', function(node){
        var data = node.data;

        if (data.checked == true){

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

                                         }
                    }     
        }     
        addDoctorLocation(options);           
        }       
    })

用这段代码解决了

于 2013-02-23T01:18:01.277 回答