谷歌地图方向聚合物元素不工作

我创建了我自己的元素，使用谷歌地图和谷歌地图方向如示例here中所示。谷歌地图方向聚合物元素不工作

这里是我的元素：

<link rel="import" href="../bower_components/polymer/polymer.html"> 
<link rel="import" href="../bower_components/google-map/google-map.html"> 
<dom-module id="my-map"> 
<template> 
    <style> 
     #map-container { 
      height: 500px; 
      width: 500px; 
     } 
    </style> 
    <div id="map-container"> 
     <google-map-directions map="{{map}}" 
      start-address="San Francisco" 
      end-address="Mountain View" 
      travel-mode="BICYCLING" 
      api-key="<my-key>"></google-map-directions> 
     <google-map map="{{map}}" latitude="37.779" 
      longitude="-122.3892" api-key="AIzaSyDoVR8wgBH0vUoMfhdHQ38e-hBIWk3wRbs"></google-map> 
    </div> 
</template> 
<script> 
    Polymer({ 
     is: "my-map", 

     properties: { 
      fromCity: { 
       type: String, 
       value: "Green Bay, WI" 
      }, 
      toCity: { 
       type: String, 
       value: "Chicago, IL" 
      } 
     }, 

     listeners: { 
      "dom-change": function(e) { 
       console.log("Dom has changed."); 
      } 
     } 
    }); 
</script> 
</dom-module>

我打电话从我的测试页面这个元素，就像这样：

<!doctype html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1, user-scalable=yes"> 

    <title>my-card</title> 

    <script src="../bower_components/webcomponentsjs/webcomponents-lite.js"> </script> 
    <link rel="import" href="../bower_components/polymer/polymer.html"> 
    <link rel="import" href="../bower_components/iron-component-page/iron-component-page.html"> 
    <link rel="import" href="../bower_components/google-map/google-map.html"> 
    <link rel="import" href="../../sni-card.html"> 
    <link rel="import" href="../../sni-map.html"> 
    </head> 
    <body> 
    <style> 
     #map-container { 
      height: 500px; 
      width: 500px; 
     } 
</style> 
<!--iron-component-page src="sni-card.html"></iron-component-page--> 
<script> 
    function onFromCityChanged(changedObject) { 
    var myMap = document.querySelector('#my-sni-map'); 
    myMap.fromCity = changedObject.detail.value; 
    } 

    function onToCityChanged(changedObject) { 
    var myMap = document.querySelector('#my-sni-map'); 
    myMap.toCity = changedObject.detail.value; 
    } 
</script> 
<my-map id="my-sni-map" from-city="[[from_city]]" to-city="[[to_city]]"></my-map>

问题

方向没有得到显示d。我只收到旧金山的地图。

问题

我怎样才能使方向显示？

来源

2016-11-21 user1700184

为了使用google-map-directions元素，你需要导入google-map-directions.html：

<link rel="import" href="../bower_components/google-map/google-map-directions.html">

一旦google-map-directions.html导入的路由将在下面的demo

证明显示

来源

2016-11-22 00:35:27

谷歌地图方向聚合物元素不工作

回答

相关问题