拆除工程图管理覆盖的数组元素 [英] Remove elements from Drawing manager overlay array

问题描述

我目前工作的一个基于地图的服务。还有，用户可以通过绘制矩形和使用的DrawingManager多边形选择地图上的项目。我把这些形状到一个全局数组创建它们随时掌控他们这样后：

I am currently working on a map-based service. There the user can select items on the map by drawing rectangles and polygons using the drawingManager. I push these shapes to an global array after they are created to keep control on them like this:

      google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
      if (e.type != google.maps.drawing.OverlayType.MARKER) {
      // Switch back to non-drawing mode after drawing a shape.
      drawingManager.setDrawingMode(null);
      var newShape = e.overlay;
      all_overlays.push(newShape);
      newShape.type = e.type;
      newShape.id = all_overlays.length-1;
      all_overlays[newShape.id].id = all_overlays.length-1;
}

用户必须删除单个形状的选项。我实现了删除操作是这样的：

The user has the option to delete a single shape. I implemented the deletion like this:

function deleteSelectedShape() {
if (selectedShape) {
    all_overlays.splice(selectedShape.id,1);
    while(jQuery.inArray(selectedShape.id, selected_shapes) != -1)
        {
        var shape_index = jQuery.inArray(selectedShape.id, selected_shapes);
        selected_shapes.splice(shape_index,1);
        selected_buoys.splice(shape_index,1);
        }
    selectedShape.setMap(null);
    selectedShape = '';
    buildList();
    highlightSelectedBuoys();   
}

不幸的是这是行不通的。如果我如得到的阵列与4-形状（IDS：0,1,2,3）和删除与ID = 0的阵列，所述all_overlays阵列不改变它的大小，其中，最多弄乱在下一步整个事情。哪里是我的错？

Unfortunatly this is not working. If I e.g. got an array with 4 shapes (ids:0,1,2,3) and delete the array with id=0, the all_overlays array does not change it's size, which messes the whole thing up in the next step. Where is my mistake?

推荐答案

忘记 newShape.id ，形状的指数将拼接后更改。

 all_overlays.splice(all_overlays.indexOf(selectedShape),1);

的的indexOf（）方法返回在该给定元素可以在阵列中可以找到，或-1，如果它不是present第一索引。
比较的indexOf到searchElement使用全等（由===用同样的方法，或三等号，运营商）的数组的元素。需要注意的是剪接什么也不做，如果你传递-1作为参数。<​​/ P>

完整的例子：

google.maps.event.addListener(drawingManager, 'overlaycomplete', function(e) {
      if (e.type != google.maps.drawing.OverlayType.MARKER) {
         // Switch back to non-drawing mode after drawing a shape.
         drawingManager.setDrawingMode(null);
         var newShape = e.overlay;
         all_overlays.push(newShape);
         newShape.type = e.type;
      }
}

function deleteSelectedShape() {
    if (selectedShape) {
        // here is the difference
        all_overlays.splice(all_overlays.indexOf(selectedShape),1);
        // here maybe you need the same fix.
        selected_shapes.splice(selected_shapes.indexOf(selectedShape),1);
        selected_buoys.splice(selected_buoys.indexOf(selectedShape),1);
        // remove from map.
        selectedShape.setMap(null);
        selectedShape = ''; // maybe should be undefined.
        // do stuffs
        buildList();
        highlightSelectedBuoys();   
    }
}

注意：这并不完全因为的indexOf 跨浏览器并不被所有的浏览器的原生支持。
但是你可以自己实现它。读<一个href=\"http://stackoverflow.com/questions/1744310/how-to-fix-array-indexof-in-javascript-for-internet-explorer-browsers\">This发布支持旧的浏览器。

NOTE: This is not fully cross-browser due indexOf is not supported natively by all browsers. But you can implement it by yourself. Read This post to support old browsers.

这篇关于拆除工程图管理覆盖的数组元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！