AngularUI - 谷歌地图 - 删除标记 [英] AngularUI - Google Maps - Remove marker

问题描述

我使用AngularUI谷歌地图的指令是这样的：

I am using AngularUI Google Maps directive in this way:

UpdateData.html

<div ng-repeat="marker in myMarkers" ui-map-marker="myMarkers[$index]"></div>

<div class="control-group">
    <label class="control-label">Situación</label>
    <div class="controls">
        <div id="map_canvas" ui-map="model.myMap" class="map" ui-event="{'map-click': 'addMarker($event)'}" ui-options="mapOptions"></div>
    </div>
</div>

UpdateController

if (!$scope.myMarkers) {
    $scope.myMarkers = [];
}

if (!$scope.myMap) {
    $scope.model = {
        myMap: undefined
    };
}

$scope.mapOptions = {
    center : new google.maps.LatLng(35.784, -78.670),
    zoom : 15,
    mapTypeId : google.maps.MapTypeId.ROADMAP
};

$scope.addMarker = function($event) {
    $scope.myMarkers.push(new google.maps.Marker({
        map : $scope.model.myMap,
        position : $event.latLng
    }));

    $scope.event.lat = $event.latLng.lat();
    $scope.event.lng = $event.latLng.lng();
};

我可以添加新的标志物和我不能删除他们在地图更新成功。我做的是以下内容：

I can add new markers and the map is updated successfully by I can't remove them. What I do is the following:

$scope.myMarkers.splice(0, $scope.myMarkers.length);

myMarkers Array获取空，但地图上仍含有去除标记。看来， myMarkers 阵列和地图正在推动新的标记 myMarkers 阵列时同步，但不是在 myMarkers 阵列被清零。

myMarkers array gets empty but the map still contains removed markers. It seems that myMarkers array and map are synchronized when pushing new markers to myMarkers array but not when myMarkers array is cleared.

推荐答案

尝试 myMarker.setMap（空）。

您还必须使用谷歌地图API做的一切，有没有涉及大的魔力。唯一的原因 UI的地图标记是一个指令是让您可以轻松挂钩DOM事件添加到您的标记

You still have to use the Google Maps API to do everything, there's not much magic involved. The only reason ui-map-marker is a directive is so you can easily hook up DOM events to your markers

这篇关于AngularUI - 谷歌地图 - 删除标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！