javascript - Bing Maps Api 清除图层

Question

我有一个运行良好的页面，它加载 Bing map 并创建一个图层，然后用多边形填充该图层。然后，我需要重新加载生成多边形的 JSON 数据，这再次起作用，但是数据随后被添加到另一层，因此显示在顶部。我尝试过删除图层、清除图层等，但似乎没有任何效果。

请有任何想法。

这个函数可以完成这一切...

        function AddData() {

        dataLayer = new Microsoft.Maps.Layer();

        Microsoft.Maps.loadModule('Microsoft.Maps.GeoJson', function () {
            var featureCollection = Microsoft.Maps.GeoJson.read(json, {
                polygonOptions: {
                    strokeColor: 'LightSkyBlue',
                    strokeThickness: 2
                }
            });

            for (var i = 0; i < featureCollection.length; i++) {
                var fillColour = featureCollection[i].metadata.FillColor;
                featureCollection[i].setOptions({ fillColor: fillColour });

                Microsoft.Maps.Events.addHandler(featureCollection[i], 'click', displayClickBox);
                Microsoft.Maps.Events.addHandler(featureCollection[i], 'mouseover', displayMouseOverBox);
                Microsoft.Maps.Events.addHandler(featureCollection[i],'mouseout', displayMouseOut);
                dataLayer.add(featureCollection[i], 0);
            }
            map.layers.insert(dataLayer);
        });
    }

        var getJson = function () {
        var onContentComplete = function (response) {
            //Load the JSON data into the local variable for use latter in the project...
            json = response.data;
            //load the map now that we have the polygon data...
            AddData();
        };

        var onError = function (reason) {
            //An error has occured so display a message to the user...
            $scope.error = "Server communication error please try again...";
            //Log the error to the console for admin debug...
            console.log(reason.data);
        };

        //Load the JSON for the map polygons into memory ready for display...
        $http.get("../JSON/MapData.json")
            .then(onContentComplete, onError);
    }

正如我所说，我尝试先使用清除图层

dataLayer.clear();

但这似乎没有任何作用。

请帮忙，因为我已经为此工作了几个小时。

谢谢

悬崖。

Answer 1

根据声音，您希望所有数据都在单个层中渲染，但它却渲染两个或多个层。发生这种情况是因为每次调用 AddData 函数时都会创建一个新的 dataLayer 实例。此外，这会覆盖 dataLayer 的局部变量，因此您会丢失对尝试清除/删除的原始图层的引用。如果要清除或删除图层，请在初始化新图层之前执行此操作。尝试将以下内容添加到 AddData 函数的顶部:

if(dataLayer){
   map.layers.remove(dataLayer);
}

或者，通过清除该图层(如果存在)或创建它(如果不存在)来重用该图层:

if(dataLayer){
    dataLayer.clear();
}else{
    dataLayer = new Microsoft.Maps.Layer();
}