ストリートビューに物を置く

前回の続きalfe.hateblo.jp

出来上がるものはこちら
http://alfe.xyz/funyou/streetview_simple

前回作った、簡単なストリートビューに数行追加すると
ストリートビュー上にアイコンだとかお知らせだとかがおけます。

コードはこんな感じ。

var panorama;
function initialize() {
  panorama = new google.maps.StreetViewPanorama(
      document.getElementById('streetview'),
      {
        position: {
          lat:  34.6899593, //緯度
          lng: 135.8538238 //経度
        },
        pov: {
          heading: -120, //見る方角 +が時計回り、-が反時計回り
          pitch: 0 //数字を大きくすると上を向く
        },
        zoom: 1 //ズームのレベル 1以上推奨
      });

　// 追加した部分
  var marker = new google.maps.Marker({
    position: {
          lat:  34.68989, //緯度
          lng: 135.85378 //経度
        },
    map: panorama, //どの地図にマーカーを置くか
    icon: "now.png" //マーカー画像の変更
  });
  // 追加ここまで
}

追加したのは8行。
もちろん、 new google.maps.Marker が入った変数を増やしていけば
複数のところにアイコンを表示することが可能です。