通过API自定义Google地图图层?

时间:2012-12-04 08:21:15

标签: google-maps google-maps-api-3

这是关于Google Maps API v3:

当您在自定义Google地图中绘制各种PolylinesPolygonsMapLabels或任何其他叠加元素时,它会在mapPane上绘制它们。是否有可能以某种方式创建多个自定义图层,您可以在其上绘制叠加对象,然后轻松启用/禁用(显示/隐藏)这些图层?

我在这里看到有关图层的文档:https://developers.google.com/maps/documentation/javascript/layers

但没有关于自定义图层的信息。

1 个答案:

答案 0 :(得分:7)

您可以创建自定义OverlayView来执行此操作:

var LayerOverlay = function () {
  this.overlays = [];
}
LayerOverlay.prototype = new google.maps.OverlayView();
LayerOverlay.prototype.addOverlay = function (overlay) {
  this.overlays.push(overlay);
};
LayerOverlay.prototype.updateOverlays = function () {
  for (var i = 0; i < this.overlays.length; i++) {
    this.overlays[i].setMap(this.getMap());
  }
};
LayerOverlay.prototype.draw = function () {};
LayerOverlay.prototype.onAdd = LayerOverlay.prototype.updateOverlays;
LayerOverlay.prototype.onRemove = LayerOverlay.prototype.updateOverlays;

然后,将您的叠加层添加到LayerOverlay后,您只能使用一个setMap来展示或隐藏它们:

var layer1 = new LayerOverlay();
layer1.addOverlay(createMarker());
layer1.addOverlay(createMarker());
layer1.addOverlay(createMarker());

// hide all markers
layer1.setMap(null);

// show all markers
layer1.setMap(map);