繁体   English   中英

Google Maps API-在街景视图中单击标记时显示Infowindow

[英]Google Maps API - Show Infowindow while clicking on marker in Street View

当我单击常规地图中的地图标记时,将弹出信息窗口。
但是,它在街景视图中不起作用。 JsFiddle在这里

我想知道是否有人找到了其他选择,因此这里似乎存在一个问题

我的JavaScript代码

// This example displays a marker at the center of Australia.
// When the user clicks the marker, an info window opens.
function initMap() {
    var address = '204 Deer Valley Rd, Lumsden No. 189, SK S0G';
    var map = new google.maps.Map(document.getElementById('map'), {

        mapTypeId: google.maps.MapTypeId.ROADMAP,
        zoom: 16
    });

    var defaultStreetViewPanorama = map.getStreetView();

    var contentString = '<div id="content">' +
        '<div id="siteNotice">' +
        '</div>' +
        '<div id="bodyContent">' +
        '<p><b>Uluru</b></p>' +
        '</div>' +
        '</div>';

    var infowindow = new google.maps.InfoWindow({
        content: contentString
    });
    var infowindowSV = new google.maps.InfoWindow({
        content: contentString
    });
    var geocoder = new google.maps.Geocoder();
    geocoder.geocode({
            'address': address
        },
        function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var marker = new google.maps.Marker({
                    position: results[0].geometry.location,
                    map: map
                });
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.open(map, marker);
                });
                google.maps.event.addListener(marker, 'click', function() {
                    infowindow.open(defaultStreetViewPanorama, marker);
                });

                map.setCenter(results[0].geometry.location);
            }
        });
}

我不知道这个问题。 在那里发布的代码根本不起作用,我也不想调试它。

不过,在带有InfoWindow的街景视图全景图中放置标记是没有问题的。

 var map; function initialize() { var panoPos = new google.maps.LatLng(31.2400896,121.4908558); var markerPos = new google.maps.LatLng(31.2400896,121.4909558); var panoOptions = { position: panoPos }; var panorama = new google.maps.StreetViewPanorama( document.getElementById('map-canvas'), panoOptions); var marker = new google.maps.Marker({ position: markerPos, map: panorama }); var infowindow = new google.maps.InfoWindow({ content: 'hello world' }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(panorama, marker); }); panorama.setPov({ heading: 90, pitch: 0, zoom: 0 }); } google.maps.event.addDomListener(window, 'load', initialize); 
 #map-canvas { height: 200px; } 
 <div id="map-canvas"></div> <script src="https://maps.googleapis.com/maps/api/js"></script> 

我想通了,我确实要感谢MrUpsidown。 我确实知道我可以在Streetview Panarama选项中使信息窗口正常工作,但是它并没有按照旧的方式工作。 事实证明,我们可以半强制在街景视图中创建信息窗口,它仍然可以打开和关闭其中的信息窗口模式。

  google.maps.event.addListener(marker, 'click', function()       {
    new google.maps.InfoWindow({
    position: results[0].geometry.location,
    content: contentString
    }).open(map);
    new google.maps.InfoWindow({
    position: results[0].geometry.location,
    content: contentString
    }).open(map.getStreetView());
  });

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM