在聚合物谷歌地图中缩放事件

Zooms events in Polymer Google Map

本文关键字:缩放 事件 谷歌地图 聚合物      更新时间:2023-09-26

我正在开发一个应用程序,它将根据用户位置动态加载标记。如果用户缩小,地图应该向地图添加事件。对于地图,我们使用的是Polymer的谷歌地图。我很难找出如何应对变焦事件。我们给页面添加了一个映射:

<google-map latitude="45" longitude="-73" zoom="15" mouseEvents="true" clickEvents="true"></google-map>

我尝试了几个不同的js事件处理程序,如:

<script>
var map = document.querySelector("google-map");
console.log(map);
map.addEventListener("bounds_changed", function() {
alert(map.zoom);
});
</script>

我甚至不能让像"google-map-click"这样的事件触发。唯一可行的是"谷歌地图准备好了"。

请帮。

尝试将事件监听器添加到map属性中,而不是google-map元素。

像这样的东西会给你所有的缩放变化

  <script type="text/javascript">
    var mapElement = document.querySelector("google-map");
    mapElement.addEventListener('api-load', function(e) {
      google.maps.event.addListener(this.map, 'zoom_changed', function() {
        // handle zoom event...
      });
    });
  </script>