Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/google-maps/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Google Maps Javascript Api V3 data.remove-isn';t删除特征_Javascript_Google Maps_Google Maps Api 3 - Fatal编程技术网

Google Maps Javascript Api V3 data.remove-isn';t删除特征

Google Maps Javascript Api V3 data.remove-isn';t删除特征,javascript,google-maps,google-maps-api-3,Javascript,Google Maps,Google Maps Api 3,我正在做一个小宠物项目,通过绘制多边形来编辑个人地图,我发现当我调用map.data.remove(功能)时,该功能会从map.data中删除,但不会从可视地图中删除。省略了一些与数据层无关的javascript。我还需要哪些额外的步骤、删除或函数调用才能从映射中实际删除该功能 ... function CustomMapType() { } CustomMapType.prototype.tileSize = new google.maps.Size(256,256); CustomMapTy

我正在做一个小宠物项目,通过绘制多边形来编辑个人地图,我发现当我调用map.data.remove(功能)时,该功能会从map.data中删除,但不会从可视地图中删除。省略了一些与数据层无关的javascript。我还需要哪些额外的步骤、删除或函数调用才能从映射中实际删除该功能

...
function CustomMapType() {
}
CustomMapType.prototype.tileSize = new google.maps.Size(256,256);
CustomMapType.prototype.maxZoom = 7;
CustomMapType.prototype.getTile = function(coord, zoom, ownerDocument) {
    var div = ownerDocument.createElement('DIV');
    var baseURL = 'static/tiles/images/';
    var x = ((coord.x % Math.pow(2, zoom))
        + Math.pow(2, zoom)) % Math.pow(2, zoom);
    baseURL += zoom + '_' + x + '_' + coord.y + '.png';
    div.style.width = this.tileSize.width + 'px';
    div.style.height = this.tileSize.height + 'px';
    div.style.backgroundColor = '#1B2D33';
    div.style.backgroundImage = 'url(' + baseURL + ')';
    return div;
};

CustomMapType.prototype.name = "Custom";
CustomMapType.prototype.alt = "Tile Coordinate Map Type";

var map;
var CustomMapType = new CustomMapType();


//////////     Initializer Functions     //////////

function initialize() {
  var styledMapOptions = { name: "Custom Style" };
  var mapOptions = getMapOptions();
  var data = getDataObject();

  data.addListener("click", function(event) {
    fillFormFromFeature(event.feature);
  });

  data.setStyle(function(feature) {
    var style = featureStyles[feature.getProperty('style')];
    return style
  });


  map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
  data.setMap(map);

  map.mapTypes.set('custom',CustomMapType);
  map.setMapTypeId('custom');
  map.mapTypes.set(MY_MAPTYPE_ID);
}

function getMapOptions() {
  return {
    minZoom: 0,
    maxZoom: 7,
    isPng: true,
    mapTypeControl: false,
    mapMaker: true,
    streetViewControl: false,
    center: new google.maps.LatLng(65.07,-56.08),
    zoom: 3,
    mapTypeControlOptions: {
      mapTypeIds: ['custom', google.maps.MapTypeId.ROADMAP],
      style: google.maps.MapTypeControlStyle.DROPDOWN_MENU
    },
  };
}

function getDataObject() {
  return new google.maps.Data({
    controlPosition: google.maps.ControlPosition.TOP_CENTER,
    controls: ["Point", "Polygon"],
    featureFactory: function(featureGeometry) {
      var date = new Date();
      // TODO add code here for forming polygons.
      var feature = new google.maps.Data.Feature({
        geometry: featureGeometry,
        id: date.getTime(),
        properties: {
          'name': 'none',
          'style': 'new',
          'feature_type': 'new',
          'zIndex': '5000',
        }
      });

      document.forms["feature_form"]["feature_id"].value = feature.getId();

      map.data.add(feature);
      map.data.revertStyle();
      return feature;
    }
  });
}


...

要从地图中删除多边形,必须设置:

 yourPolygon.setMap(null);

ps:代码中的一个次要部分是两次显示
getDataObject
函数您的代码使用了两个不同的
google.maps.Data
-实例

  • getDataObject()返回的实例
  • 映射
    -实例的内置
    数据
    -属性
  • 创建多边形(或其他要素)时

  • 该功能将由
    featureFactory
    自动添加到
    getDataObject()返回的实例中
  • 调用
    map.data.add(feature)还将该功能添加到地图数据中
  • 结果:当调用
    map.data.remove
    时,您有两个重复的功能,您只删除
    map.data
    的功能

    解决方案:您无需自行添加该功能,它将自动添加。但它不是
    map.data
    的功能,而是
    getDataObject
    返回的数据实例的功能,因此您必须调用此
    数据的
    remove
    方法-实例:

    函数初始化(){
    var mapOptions=getMapOptions();
    var data=getDataObject();
    map=new google.maps.map(document.getElementById(“map_canvas”),mapOptions);
    data.setMap(map);
    控件[google.maps.ControlPosition.TOP_LEFT].push(document.getElementsByTagName('UL')[0]);
    }
    函数getMapOptions(){
    返回{
    最小缩放:0,
    最大缩放:7,
    是的,
    mapTypeControl:false,
    地图绘制者:没错,
    disableDefaultUI:true,
    中心:新google.maps.LatLng(65.07,-56.08),
    缩放:3
    };
    }
    函数getDataObject(){
    //创建一个变量,以便能够从内部访问它
    //特色工厂
    var Data=新的google.maps.Data({
    controlPosition:google.maps.controlPosition.TOP_CENTER,
    控件:[“点”、“多边形”],
    featureFactory:功能(featureGeometry){
    变量日期=新日期();
    //TODO在此处添加用于形成多边形的代码。
    var feature=new google.maps.Data.feature({
    几何:特征几何,
    id:date.getTime(),
    特性:{
    “名称”:“无”,
    '样式':'新',
    “功能类型”:“新建”,
    “zIndex”:“5000”,
    }
    });
    var listItem=document.createElement('li');
    listItem.textContent=[featureGeometry.getType(),feature.getId()]。连接(“”);
    document.getElementsByTagName('UL')[0].appendChild(listItem);
    google.maps.event.addDomListener(listItem,'click',function(){
    //删除该功能
    数据删除(特征);
    //删除列表项
    this.parentNode.removeChild(this)
    });
    map.data.revertStyle();
    返回特性;
    }
    });
    返回数据;
    }
    google.maps.event.addDomListener(窗口“加载”,初始化)
    
    html,
    身体,
    #地图画布{
    身高:100%;
    保证金:0;
    填充:0
    }
    保险商实验室{
    背景:#fff;
    }
    李{
    右边填充:12px;列表样式图像:url(http://upload.wikimedia.org/wikipedia/commons/5/54/Delete-silk.png);
    光标:指针
    }
    
    
      很抱歉,为了清晰起见,我编辑了这篇文章。我使用的是要素而不是多边形,要素没有“setMap”方法。您在代码中的何处调用
      数据。删除
      ?您能帮我解决这个问题吗