配列化したオープンデータをGoogle Map にマッピング

shuichiro0926 40views 更新:2017年10月17日
//変数定義
var map_canvas;

//マーカーの情報を配列で用意
var data = new Array();
 data.push({lat:'35.6843081', lng:'139.7804455', name:'人形町駅'});
 data.push({lat:'35.6766621', lng:'139.7434998', name:'国会議事堂'});
 data.push({lat:'35.6790081,139.7438526', lng:'139.7438526', name:'皇居'});

//function(関数定義)
function initialize_map() {
  var map_center = new google.maps.LatLng(35.6745973, 139.7778069);
  var map_options = {
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: map_center,
      zoom: 14,
    };
//変数map_canvas
 map_canvas = new google.maps.Map(document.getElementById("map_canvas"), map_options);

//マーカーの作成
 for (var i = 0; i < data.length; i++) {
  create_marker(data[i].lat, data[i].lng);
  }
}

//関数定義
  function create_marker(lat, lng){
    var marker_options = {
      map: map_canvas,
      position: new google.maps.LatLng(lat, lng),
      zIndex: 0
    };
//変数 marker
    var marker = new google.maps.Marker(marker_options);
  }
//イベントハンドラ
  google.maps.event.addDomListener(window, "load", initialize_map);

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません