1 つは従来の Google マップを表示し、もう 1 つはその場所のストリートビューをその隣に表示する 2 つの個別の div を設定しようとしています。次に、ショーケースにいくつかの場所を追加できるように、ボタンをクリックしてこれらの場所を変更しようとしています。しかし、困難を抱えています。緯度と経度を別のドキュメントに入れることができると思いますが、それらを別のボタンに読み込むにはどうすればよいですか? ひとつもうまくいかないようです。正しい方向への助けやナッジに感謝します。ありがとう!
<script>
function initialize() {
var coords = new google.maps.LatLng(59.92883,10.75943);
document.getElementById('changeValues').onclick = function(coords) {
coords = this.coords;
var mapOptions = {
center: coords,
zoom: 16,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(
document.getElementById('map-canvas'), mapOptions);
var panoramaOptions = {
position: coords,
pov: {
heading: 80,
pitch: 10
}
};
var panorama = new google.maps.StreetViewPanorama(document.getElementById('pano'),panoramaOptions);
map.setStreetView(panorama);
}
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas" style="width: 500px; height: 400px"></div>
<div id="pano" style="position:absolute; left:510px; top: 8px; width: 500px; height: 400px;"></div>
<div id="meny"><input type="button" value="changeValues" id="changeValues" /></div>
</body>
</html>