Polymer，如何open/close google-map-marker InfoWindow？

Question

我在我创建的 Polymer 元素中使用网络组件 google-map-marker。我想抓住点击它在我的组件中做一些事后的事情，所以我在我的模板上试了一下：

<div horizontal layout flex style="height: 400px;">
  <div class="panel-contents" vertical layout flex>
    <google-map flex  map="{{map1}}" latitude="45.5601451" longitude="-73.7120832">
       <google-map-marker latitude="45.5601451" longitude="-73.7120832"  map="{{map1}}" clickEvents="true" google-map-marker-click="{{markerClicked}}" ></google-map-marker>
    </google-map>
  </div>
</div>

和脚本部分

Polymer({
  markerClicked: function () {
    //this is never triggered!
  },

});

有办法吗？提前致谢。

PS：顺便说一句，我最初想做的是关闭所有其他标记 InfoWindow（如果它们可见），然后再显示刚刚单击的标记之一。如果有人有更好的解决方法，那就太好了。

Answer 1

你在调用函数时缺少一个 "on-"，正确的方法是：

on-google-map-marker-click="{{markerClicked}}"

这称为声明式事件映射：[1], [2]

..

以下是使用地图打开或关闭标记信息窗口的方式API：

markerClicked: function(e, detail, sender) {

          console.log('google_map_marker_click');

          /////////////////////////////////////
          //Seting marker infowindow to be open by default using it's API
          //
          //Select the map and the marker:
          // var map_marker_1 =  this.$.map_marker_1;
          // var google_map = this.$.map_1;
          //Open the info:
          // google_map_marker.info.open(google_map.map, google_map_marker.marker);
          /////////////////////////////////////

          /////////////////////////////////////
          //Closing marker infowindow
          //
          //console.log(sender.tagName);
          //console.log(sender.info);//marker's info object
          //console.log(sender.info.content);

          //or select the marker by id:
          //var map_marker_1 =  this.$.map_marker_1;

          //this is closing marker infowindow
          sender.info.close();
          //or 
          // map_marker_1.info.close();
          /////////////////////////////////////

        },

这里是例子Plunk

Answer 2

Goce Ribeski 在 1.0 中的回答更新：

clickEvents 现在应该是 click-events。 camelCase translates to attributes with dashes
花括号是removed from event listeners.

即click-events="true" on-google-map-marker-click="markerClicked"

Polymer，如何open/close google-map-marker InfoWindow？

Polymer, how to open/close google-map-marker InfoWindow?

google-maps

google-maps-markers

polymer