2015年6月9日火曜日

AngularJSで、Google Mapの「Angular Google Maps」

これでも表示されますが、正しくはこちらです。すみません。


AngularJSで、Google Mapの「Angular Google Maps」を組み込んでみました。とりあえず、地図は表示できました。ちょっと嬉しい(笑)。

コントローラー
var mylat = document.getElementById("mylat").textContent;
var mylng = document.getElementById("mylng").textContent;

var mapOptions = {
  zoom: 10,
  center: new google.maps.LatLng(mylat, mylng),
  mapTypeId: google.maps.MapTypeId.ROADMAP
}

$scope.map = new google.maps.Map(document.getElementById('map'), mapOptions);
HTML
<span id="mylat">{{lat}}</span> : <span id="mylng">{{lng}}</span>
<div id="map"></div>

実際に設定してみたサイトがこちら



参考サイト
Google Maps with AngularJS(JSFiddle)

0 件のコメント:

コメントを投稿