地図の中心の設定

koumikuni 40views 更新:2017年1月6日

カリキュラム「04. スマホアプリに地図を表示しよう」を行う際に 第2項目の「オープンデータを配列で保持しよう」をやる前の練習として 第3項目「オープンデータをGoogle Mapsにマッピングしよう」にある参考リンク「複数のマーカーをGoogleMapに表示する方法」 http://www.google-mapi.com/googlemaps/marker-add.html の内容をindex.htmlのなかで実際にやってみました。

その際、

 //中心の計算
          var lat_center = 0;
          for (i = 0; i < data.length; i++){
            lat_center += data[i].lat / data.length;
          }
          var lng_center = 0;
          for (i = 0; i < data.length; i++){
            lng_center += data[i].lng / data.length;
          }
          var map_center = new google.maps.LatLng(lat_center, lng_center);

という文章を入れて、表示されるマーカーの真ん中を表示するようにしてみました。 後から「APIに同様の機能があるのかな」とそもそもなことに気づいたので後で調べてみます。

表示されたマーカーを全て表示するようにzoomを自動調整するようにしてみたいので調べてみます。

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

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

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