extjs 从Gmap中移除标记

i2byvkas  于 2022-11-05  发布在  其他
关注(0)|答案(1)|浏览(148)

我尝试在我的应用程序中集成Gmaps,使用ExtJs6.0绘制前端,并且我希望在Map中显示和隐藏一些用户位置。
添加一个带有用户位置的marker非常容易(虽然我得到了一些奇怪的Cannot read property 'getBounds' of undefined,但我认为这不是什么大事)。
另一方面,删除marker会比我想象的要复杂一些。
我已经阅读了Stack和Google文档中关于添加/删除标记的一些问题,我知道“正确”的方法是调用

marker.setMap(null);

但我得到了一个奇怪的行为:标记不会消失并保留在Map上。

以下是在Map上添加标记的方法:

addMarker : function(record) {
        var me = this;
        var map = me.lookupController().lookupReference('map');
        var latitude = record.get('latitude');
        var longitude = record.get('longitude');
        var description = record.get('fullName');

        var marker = new google.maps.Marker({
            lat: latitude, 
            lng: longitude,
            title : description
        });

        me.lookupViewModel().get('techniciansMaker').push(marker);
        map.addMarker(marker);
    }

这就是我如何从Map中删除标记的方法

removeMarker : function(record){
        var me = this;
        var markers = me.lookupViewModel().get('techniciansMaker');

        for(var i = 0; i < markers.length; i++){
            var m = markers[i];
            if (markers[i].getTitle() == record.get('fullName')){
                markers[i].setMap(null);
                Ext.Array.remove(markers, markers[i]);
            }
        }
    }

此外,我还在一个列表中保存标记,以识别我必须删除的标记。
我想不出我做错了什么......

编辑-已解决

我自己发现我指向的是map container,而不是map本身。调用map.gmap就成功了。

xmakbtuz

xmakbtuz1#

当使用Ext.ux.GMapPanel时,你不应该用new google.maps.Marker()自己创建标记。相反,addMarker会做这件事,让listeners:{click:...}在标记上工作。你把配置传递给addMarker,它会返回一个标记对象:

markerConfig = {
        lat: latitude, 
        lng: longitude,
        title : description
}
marker = mapPanel.addMarker(markerConfig)

// hide the marker
marker.setMap(null)

// show it again
marker.setMap(mapPanel.gmap)

这允许您删除标记并删除该TypeError: Cannot read property 'getBounds' of undefined

相关问题