在 Polymer Google Map 中缩放事件答案

【问题标题】：Zooms events in Polymer Google Map在 Polymer Google Map 中缩放事件
【发布时间】：2015-10-08 05:06:26
【问题描述】：

我正在开发一个应用程序，该应用程序将根据用户位置动态加载标记。如果用户缩小，地图应该向地图添加事件。对于地图，我们使用 Polymer 的 Google Map。我很难找出如何对缩放事件做出反应。我们在页面中添加了一张地图：

<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”之类的事件。唯一似乎有效的是“google-map-ready”。

请帮忙。

【问题讨论】：

标签： javascript google-maps polymer

【解决方案1】：

尝试将事件侦听器添加到 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>

【讨论】：

如何访问组件内的google 命名空间？