【问题标题】:How to change the street view in google maps 3如何更改谷歌地图3中的街景
【发布时间】:2012-02-08 20:14:15
【问题描述】:

目标:获取TEXT地址,然后同时显示街景和地图视图

参考网站:

http://code.google.com/apis/maps/documentation/javascript/examples/streetview-simple.html

我的网站: http://www.iamvishal.com/dev/property/P2154(请点击地图查看地图)

问题:我能够正确显示地图和地址,但街景没有改变。知道为什么吗?

我的 js 变量地址在这种情况下保存文本地址“323235 Balmoral Terrace Heaton Newcastle Upon Tyne”

function initialize() 
{
var fenway = new google.maps.LatLng(42.345573,-71.098326);
var mapOptions = {
    center: fenway,
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};

var map = new google.maps.Map(
document.getElementById("map_canvas"), mapOptions);

var panoramaOptions = {
    position: fenway,
    pov: {
         heading: 34,
         pitch: 10,
         zoom: 1
         }
   };

var panorama = new  google.maps.StreetViewPanorama(document.getElementById("pano"), 
panoramaOptions);

map.setStreetView(panorama);

var geocoderTwo = new google.maps.Geocoder();

geocoderTwo.geocode({"address":address},function(results, status)
{
   if (status == google.maps.GeocoderStatus.OK) 
   {
      map.setCenter(results[0].geometry.location);
      var marker = new google.maps.Marker
      ({
        map: map,
        position: results[0].geometry.location
      });
   }
else
{
  alert("Geocode was not successful for the following reason: " + status);
}
}


);


}

【问题讨论】:

    标签: google-maps google-maps-api-3


    【解决方案1】:

    这是我之前创建街景的方式:

    function createStreetMap(strMapCanvasID, yourLatLng)
    {
        var panorama;
    
        //once the document is loaded, see if google has a streetview image within 50 meters of the given location, and load that panorama
        var sv = new google.maps.StreetViewService();
    
        sv.getPanoramaByLocation(yourLatLng, 50, function(data, status) {
            if (status == 'OK') {
                //google has a streetview image for this location, so attach it to the streetview div
                var panoramaOptions = {
                    pano: data.location.pano,
                    addressControl: false,
                    navigationControl: true,
                    navigationControlOptions: {
                        style: google.maps.NavigationControlStyle.SMALL
                    }
                }; 
                var panorama = new google.maps.StreetViewPanorama(document.getElementById(strMapCanvasID), panoramaOptions);
    
    
                // lets try and hide the pegman control from the normal map, if we're displaying a seperate streetview map
                objCreatedMap.setOptions({
                    streetViewControl: false
                });
            }
            else{
                //no google streetview image for this location, so hide the streetview div
                $('#' + strMapCanvasID).parent().hide();
            }
        });
    }
    

    更新:,您可以直接在现有代码中调用此函数(我已修改该函数以使用 LatLng 而不是单独的纬度和经度值:

    if (status == google.maps.GeocoderStatus.OK) 
       {
          map.setCenter(results[0].geometry.location);
          var marker = new google.maps.Marker
          ({
            map: map,
            position: results[0].geometry.location
          });
    
          createStreetMap('yourStreetViewDiv', results[0].geometry.location);
       }
    

    【讨论】:

    • 你是如何得到 intLat, intLong 的?你有那个代码吗
    • 你能用你的 'fenway' LatLng 吗?
    • 很遗憾没有,因为我需要获取一个文本字符串,然后获取地理编码 geocoderTwo.geocode({"address":address},function(results, status)
    • 更新了我的答案,展示了当地理编码器请求成功时如何从代码中直接调用函数
    • 感谢它对我有用。很抱歉这么久才更新您。
    【解决方案2】:

    您的代码存在几个问题。先修复它们:

    64 Uncaught ReferenceError: berkeley is not defined
    

    此外,您需要在您的Map 上设置zoommapTypeId 选项,然后才会显示任何内容。

    【讨论】:

    • 在我看来他的 mapOptions 上已经有了 zoom 和 mapTypeId。
    • 问题是页面加载时街景没有更新。我按照你的删除了代码上的问题
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-10-09
    • 1970-01-01
    • 1970-01-01
    • 2013-04-04
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多