2016-04-22 18 views
1

私はコレクションから長い緯線を引っ張っているので、ページ内の地図に動的Googleマップマーカーを生成したいと思います。流星のテンプレートからJavascriptを注入

データはソースに正しく入力されていますが、マーカーはページに表示されません。

<script></script>タグにjavascriptオブジェクトを挿入することはできますか?

Javascriptを

Template.maps.onRendered(function() { 
    var map = new google.maps.Map(this.find('.map'), {zoom: 8, center: new google.maps.LatLng(33.658206, -111.962827)}); 
    map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 
    }); 

HTML

<template name="maps"> 
    <div id="map-canvas"></div> 
</template> 

答えて

1

htmlとjsファイルを混在させないでください。関連テンプレートのメソッド内にすべてのjavascriptを配置します。

Template.mapWrapper.onRendered(function() { 
    var map = new google.maps.Map(this.find('.map'), {...}); 
    _.each(locations, function(location) { 
    marker = new google.maps.Marker({...}); 
    }); 
}); 

また、クラスまたは代わりに要素のidのデータ・パラメータを使用する必要がありますが、最も重要なのは、はhtmlとjsファイルを混在させないでください。

+0

ありがとうございました。私は元の質問を更新しました。今回の実装では、カレンダーを表示できません。上記の更新されたコードに間違いがありますか? – CuriousFellow

+0

map *(カレンダーではありません) – SMKS

+0

私の変数名をあなたのものに置き換えましたか? –