Javascript 谷歌地图-画布自定义覆盖缩放

如您所见：

我正在做以下工作：

创建地图

map = new google.maps.Map(mapContainer, options);

添加覆盖层

overlay = new google.maps.OverlayView();
overlay.draw = function() {};
overlay.setMap(map);

将画布添加到覆盖

overlay.getPanes().overlayLayer.appendChild(canvas);

一切都很好，但当我缩放时，画布的大小保持不变。放大/缩小时是否可以缩放画布？是否有指向示例的指针？

您需要侦听zoom_changed事件，从地图中获取新的缩放级别（使用map.getZoom（）），然后适当调整或修改画布元素的大小

---

如果你只想画一条线，看看覆盖图，它内置了缩放功能。

你几乎必须为你想要支持的谷歌缩放级别渲染一个新的画布。我解决这个问题的方法是在映射的“空闲”事件上设置一个侦听器。这将在地图在缩放或平移后变为空闲状态时触发。然后，您可以确定缩放级别是否有更改，并相应地进行操作

var map = new google.maps.Map(mapContainer, options);
var zoomLevel = 6; //some defaut

var handleBoundsChanged = function(){
   var oldZoom = zoomLevel;
   var zoomLevel = map.getZoom();
   if( zoomLevel != oldZoom){
       rebuildOverlayForZoom(zoomLevel)
     }
}


google.maps.event.addListener (map, 'idle', handleBoundsChanged);

---

谢谢@robodge，这很有道理。我希望图层更聪明一点。我将聆听事件并手动进行更改。我用一条线来说明这一点。我实际上在做一个自定义动画。我将使用idle和zoom事件进行测试。谢谢