谷歌街景与自定义全景和标记

时间:2014-05-06 15:30:31

标签: google-maps-api-3 google-maps-markers google-street-view

我的代码使用自定义Google街景全景图并创建一些自定义标记。

function initialize() {

    var panoOptions = {
        pano: 'a9V_yZU01A7nTQW7S4Hxjw',
        pov: {
            heading: 0,
            pitch:0
        },
        zoom: 0
    };
    var pano = new google.maps.StreetViewPanorama(document.getElementById('virtualTour'), panoOptions);

    var infowindow = new google.maps.InfoWindow();
    var marker, i;
    var markers = [];
    var locations = [
        ['<div style="width: 170px;">MARKERS 1</div>', 37.869197, -122.254583]
    ];

    for (i = 0; i < locations.length; i++) {  
        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
            map: pano,
            visible: false,
            zIndex: 999
        }); 

        google.maps.event.addListener(marker, 'mouseover', (function(marker, i) {
            return function() {
                infowindow.setContent(locations[i][0]);
                infowindow.open(pano, marker);
            }
        })(marker, i));
        markers.push(marker); // save all markers
    }



    for (i = 0; i < locations.length; i++) {
        markers[i].setVisible(true);
        markers[i].setMap(pano);
    }

    pano.setVisible(true);

}


google.maps.event.addDomListener(window, 'load', initialize);

我的问题是:为什么只有在我通过地板上的谷歌街景箭头后显示标记?

我想在初始化函数上显示标记。谁能帮我?我为我的项目创建了一个jsfiddle: http://jsfiddle.net/7HpmE/

提前致谢!

1 个答案:

答案 0 :(得分:0)

迟到总比没有好。

我能够通过在添加标记后重新加载全景来解决您的问题。 我所做的只是取代以下一行:

pano.setVisible(true);

(默认情况下全景图可见):

pano.setPano('a9V_yZU01A7nTQW7S4Hxjw');

以下是jsfidle的更新版本: http://jsfiddle.net/7mfswdbg/