0

我正在尝试在信息窗口中显示街景。我在 v2 API 中有此功能,但该方法 (setTimeout) 在 v3 中对我不起作用,因此我尝试使用 addListener 方法来显示全景图。当我尝试传递我希望在其中显示街景的 div 时,我得到的错误是一个空引用。我在这里发现了几个问题,这些问题似乎很重要,但我看不出他们在做什么不同 - 这两个例子使用了我也在使用的 infowindow domready 事件。这是我的代码。

var map;

function initialize() 
{
    var lat = document.getElementById("Lat").value;
    var lon = document.getElementById("Lon").value;
    var latlon = new google.maps.LatLng(parseFloat(lat), parseFloat(lon));

    var mapOptions = {
        center: latlon,
        zoom: 15,
        streetViewControl: false,
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };

    map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

    var sv = new google.maps.StreetViewService();
    sv.getPanoramaByLocation(latlon, 50, showShopInfo);
}

function showShopInfo(panoData, status)
{
    var streetview;
    var dirName = document.getElementById("Directory").value;
    var zipSearch = document.getElementById("ZipCodeSearch").value;
    var valID = document.getElementById("ShopValID").value;

    var shopInfo;

    if(status == google.maps.StreetViewStatus.OK)
    {
        // Got street view!
        streetview = true;

        shopInfo = "<div id='shopInfo'><table border='0'><tr><td height='200'>";
        shopInfo = shopInfo + "<div id='svMini' style='height: 200px; width: 200px;'></div></td></tr>";
        shopInfo = shopInfo + "<tr><td><br /><b><a href='ShopProfileBU.asp?ValidationID=" + valID + "&DirectoryName=" + dirName + "&ZipCodeSearch=" + zipSearch + "' title='Shop Profile'>";
        shopInfo = shopInfo + document.getElementById("ShopName").value + "</b><br /></a>";
        shopInfo = shopInfo + document.getElementById("Address").value + "<br />";
        shopInfo = shopInfo + document.getElementById("City").value + ", ";
        shopInfo = shopInfo + document.getElementById("State").value + " ";
        shopInfo = shopInfo + document.getElementById("ZipCode").value + "<br /><br />";
        shopInfo = shopInfo + "<b>" + document.getElementById("Phone").value + "</b></td></tr></table></div>";
    }
    else
    {
        // No street view available
        streetview = false;

        shopInfo = "<br /><b><a href='ShopProfileBU.asp?ValidationID=" + valID + "&DirectoryName=" + dirName + "&ZipCodeSearch=" + zipSearch + "' title='Shop Profile'>";
        shopInfo = shopInfo + document.getElementById("ShopName").value + "</b><br /></a>";
        shopInfo = shopInfo + document.getElementById("Address").value + "<br />";
        shopInfo = shopInfo + document.getElementById("City").value + ", ";
        shopInfo = shopInfo + document.getElementById("State").value + " ";
        shopInfo = shopInfo + document.getElementById("ZipCode").value + "<br /><br />";
        shopInfo = shopInfo + "<b>" + document.getElementById("Phone").value + "</b>";
    }

    var infowindow = new google.maps.InfoWindow({    
            content: shopInfo,
            position: map.getCenter()
        });

    infowindow.open(map);

    if(streetview)
        google.maps.event.addListener(infowindow, 'domready', showPanoMini(panoData.location.latLng.lat(), panoData.location.latLng.lng()));
}

function showPanoMini(pLat, pLon)
{
    var panoLat = parseFloat(document.getElementById("PanoLat").value);
    var panoLon = parseFloat(document.getElementById("PanoLon").value);
    var panoYaw = parseFloat(document.getElementById("PanoYaw").value);
    var panoPitch = parseFloat(document.getElementById("PanoPitch").value);
    var panoZoom = parseFloat(document.getElementById("PanoZoom").value);

    var panoLatLon;

    if(panoLat==0 && panoLon==0)
        panoLatLon = new google.maps.LatLng(pLat, pLon);
    else
        panoLatLon = new google.maps.LatLng(parseFloat(panoLat), parseFloat(panoLon));

    var panoPOV = {
        heading: parseFloat(panoYaw), 
        pitch: parseFloat(panoPitch)
    };

    var panoOptions = {
        position: panoLatLon,
        pov: panoPOV,
        addressControl: false,
        linksControl: false,  
        zoomControlOptions: {
            style: google.maps.ZoomControlStyle.SMALL  
            },  
        visible: true
    };

    var panorama = new google.maps.StreetViewPanorama(document.getElementById("svMini"), panoOptions);
}

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

这是我在 v2 中用来显示街景的功能。

setTimeout(showPanoMini(pLat, pLon), 1000);

ETA:感谢所有花时间看的人,但我自己解决了这个问题。出于某种原因,将信息窗口的侦听器的回调参数设置为匿名函数是可行的,而将其设置为常规函数则不行。这是现在可以使用的固定部分:

    google.maps.event.addListener(infowindow, 'domready', function() {
        var panoLat = parseFloat(document.getElementById("PanoLat").value);
        var panoLon = parseFloat(document.getElementById("PanoLon").value);
        var panoYaw = parseFloat(document.getElementById("PanoYaw").value);
        var panoPitch = parseFloat(document.getElementById("PanoPitch").value);
        var panoZoom = parseFloat(document.getElementById("PanoZoom").value);

        var panoLatLon;

        if(panoLat==0 && panoLon==0)
            panoLatLon = panoData.location.latLng;
        else
            panoLatLon = new google.maps.LatLng(parseFloat(panoLat), parseFloat(panoLon));

        var panoPOV = {
            heading: parseFloat(panoYaw), 
            pitch: parseFloat(panoPitch)
        };

        var panoOptions = {
            position: panoLatLon,
            pov: panoPOV,
            addressControl: false,
            linksControl: false,  
            zoomControlOptions: {
                style: google.maps.ZoomControlStyle.SMALL  
                },  
            visible: true
        };

        var panorama = new google.maps.StreetViewPanorama(document.getElementById("svMini"), panoOptions);
    });
4

0 回答 0