网络组件：多个标记未添加到 google 地图网络组件

Question

我正在尝试使用 google 地图 webcomponents 并且我正在尝试向纬度、经度位置添加多个标记我遵循了问题 creating a google map with marker using web-component 我尝试添加多个标记但标记没有正在添加

 <link rel="import" href="../../bower_components/polymer/polymer.html">
 <link rel="import" href="../../bower_components/google-apis/google-
   apis.html">
  <link rel="import" href="../../bower_components/google-map/google-
  map.html">
    <dom-module id="map-view">
   <template>
    <google-map map="{{map}}" disableDefaultUI fitToMarkers>
         <template is="dom-repeat" items="{{marker}}">
             <google-map-marker map={{map}} latitude="{{item.latitudine}}" 
          longitude="{{item.longitudine}}">
             </google-map-marker>
       </template>
     </google-map>
    </template>
    <script>
   Polymer({
   is:'map-view',
  properties:{
   marker:{
    type:Array
   }
  },
  ready: function() {
      this.marker = [
          {latitudine: '41.223596', longitudine: '16.296087'},
          {latitudine: '41.222450', longitudine: '16.291259'}
       ];
    }
   });
 </script>

 </dom-module>

并且我在另一个 div 中使用地图视图，但我无法获得多个标记

谁能告诉 jsfiddle 如何向 googlemap webcomponents 添加多个标记？

Answer 1

以上代码完美运行。您正在查看 U.S.A 的地图。你的标记指向意大利。缩小并查看欧洲。

如果您想更改标记附近的默认视图，您还可以在 google-map 元素中设置纬度和经度。喜欢<google-map map="{{map}}" latitude="41.223596" longitude="16.296087" disableDefaultUI fitToMarkers>。我正在使用您提供的职位之一。您可以使用最近的纬度和经度。

网络组件：多个标记未添加到 google 地图网络组件

webcomponents: multiple markers not getting added to google map web components

google-maps

polymer

polymer-1.0

google-web-component