Openlayers-3：如何將縮放事件綁定到控件或文檔

Question

如何將縮放事件綁定到ol.Control或document ？

Openlayers（3.7.0）在.ol-viewport上綁定服務器縮放事件（交互，pinchzoom），但它們僅在<canvas> -Element上觸發。

以我為例，我在自定義控件（帶有一些文本的div ）上進行了pinchzoom，瀏覽器正在縮放而不是在地圖/視圖上縮放。

我如何改變這種行為？

一個document上的解決方案將是一個很好的解決方案，因為如果某個圖層仍在加載並且我執行了pinchzoom它也會觸發瀏覽器。

Answer 1

默認情況下，控件被添加到ol-overlaycontainer-stopevent div中，以防止事件傳播到地圖。 請參閱： http : //openlayers.org/en/v3.7.0/apidoc/ol.control.Control.html ，更具體地說：

控件是一個可見的窗口小部件，在屏幕上的固定位置具有DOM元素。 它們可以涉及用戶輸入（按鈕），或者僅用於提供信息； 使用CSS確定位置。 默認情況下，它們以CSS類名ol-overlaycontainer-stopevent放置在容器中，但可以使用任何外部DOM元素。

還有一個沒有的div： ol-overlaycontainer ，可以使用map.getOverlayContainer()獲得。 不幸的是，此方法沒有@api標志，即未導出。 您仍然可以使用map.getViewport()獲取它，並使用jQuery在地圖視口中查找它。

將div作為控件的目標，事件應向下傳播到地圖。 從map.js, getOverlayContainer ：

/**
 * Get the element that serves as the container for overlays.  Elements added to
 * this container will let mousedown and touchstart events through to the map,
 * so clicks and gestures on an overlay will trigger {@link ol.MapBrowserEvent}
 * events.
 * @return {Element} The map's overlay container.
 */