Google Fusion Tables を使用してマップを作成し、マップを HTML ドキュメントにアップロードしました。これを微調整して、マップの外観を微妙に変更しています。クリックすると現在の場所のストリートビューを表示するドラッグ可能なピン/マーカーを挿入する方法を見つけましたが、マーカーの外観を変更する方法がわかりません。インタラクティブなストリートビュー マーカーのコードを次に示します。
//street view pin
var contentString = '<div id="content" style="width:500px;height:400px;"></div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: latlng,
map: map,
title: 'Click Here for Street View',
draggable: true
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, marker);
});
var pano = null;
google.maps.event.addListener(infowindow, 'domready', function() {
if (pano != null) {
pano.unbind("position");
pano.setVisible(false); }
pano = new google.maps.StreetViewPanorama(document.getElementById("content"), {
navigationControl: true,
navigationControlOptions: {style: google.maps.NavigationControlStyle.ANDROID},
nableCloseButton: false,
addressControl: false,
linksControl: false
});
pano.bindTo("position", marker);
pano.setVisible(true);
});
google.maps.event.addListener(infowindow, 'closeclick', function() {
pano.unbind("position");
pano.setVisible(false);
pano = null;
});
7 行目から 14 行目を微調整して、
icon: 'cross_hairs_highlight'
これは私が望むスタイルですが、ブラウザで HTML ドキュメントを開こうとするとアイコンが消えます。ドラッグしてクリックしてストリートビューを表示できるものがまだありますが、それは見えません。
助言がありますか?
あなたの助けに感謝します!!!
JH