基本形はかなり簡単だよ、という記事
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Street View</title>
<style>
html, body {
height: 100%;
margin: 0; padding: 0;
}
#streetview {
height: 100%;
}
</style>
<script async src="https://maps.googleapis.com/maps/api/js?callback=initialize&v=3.exp"></script>
<script>
var panorama;
function initialize() {
panorama = new google.maps.StreetViewPanorama(
document.getElementById('streetview'),
{
position: {
lat: 34.6899593, //緯度
lng: 135.8538238 //経度
},
pov: {
heading: -90, //見る方角 +が時計回り、-が反時計回り
pitch: 0 //数字を大きくすると上を向く
},
zoom: 1 //ズームのレベル 1以上推奨
});
}
</script>
</head>
<body>
<div id="streetview"></div>
</body>
</html>
上のソースコードをコピペして、streetview.htmlとでも名前を付けて、ブラウザで開けば動く。
細かな解説はコード内に記述しているけれども、
position: {
lat: 34.6899593, //緯度
lng: 135.8538238 //経度
},
この部分を好きな場所の緯度経度に変えてやると、好きな場所でのストリートビューが作れます 簡単でしょ?