• 小
  • 中
  • 大

視点の設定

ストリートビューでは視点を任意に動かすことができますが、スクリプト側でも指定することができます。
参照先は:Google Maps JavaScript API V3>Google StreetViewPov

視点の設定はStreetViewPov オブジェクトを使用します。ストリートビュー パノラマの位置での視点の向きを指定する、視点オブジェクト。視点は、角度、ピッチ、ズームで定義されます。設定可能なプロパティは3つです。

プロパティタイプ説明
headingnumber真北に相対的な角度。真北は 0 度、東は 90 度、南は 180 度、西は 270 度です。
pitchnumberストリートビュー車両に相対的な視点のピッチ(度)。90 度(真上)から -90 度(真下)の範囲です。
zoomnumberズーム レベル。レベル 0 は完全なズームアウトで、ズームインするとズーム レベルが増加します。

var opts = {
position:center,
pov:
{
heading: 278.3,
pitch:30,
zoom:0
}

};


サンプルコード


サンプル.js


function initialize() {
var center = new google.maps.LatLng(35.308191,139.487196);
var opts = {
position:center,
pov:
{
heading: 278.3,
pitch:30,
zoom:0
}
};
var myPano = new google.maps.StreetViewPanorama
(document.getElementById("pano"),opts);
myPano.setVisible(true);
}

サンプル.html
<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps v3 JavaScript API サンプル</title>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script src="サンプル.js" type="text/javascript"></script>
</head>
<body onload="initialize()">
<p>Google Maps v3 APIを使ったサンプル。</p>
<div id="pano" style="width:500px; height:300px"></div>
</body>
</html>


表示例 ストリートビューを表示 視点の設定


Google Maps サンプル > ストリートビュー 視点の設定