Google Maps PanTo OnClick

如何解决Google Maps PanTo OnClick

| 我试图在单击时平移到地图上的某个区域。脚本不起作用，页面重新加载。也许有人可以看到问题。 我的功能

function clickroute(lati,long) {

       map = google.maps.Map(document.getElementById(\"map_canvas\"));
      map.panTo(lati,long)
  }

其余的

var directiondisplay;
  var directionsService = new google.maps.DirectionsService();
  var map;

  function initialize() {
      geocoder = new google.maps.Geocoder();
    directionsdisplay = new google.maps.DirectionsRenderer();
    var chicago = new google.maps.LatLng(41.850033,-87.6500523);
    var myOptions = {
      zoom:10,mapTypeId: google.maps.MapTypeId.ROADMAP,center: chicago
    }
    map = new google.maps.Map(document.getElementById(\"map_canvas\"),myOptions);

    var address = \'virginia water\';
    geocoder.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
        });
      } 
    });
    directionsdisplay.setMap(map);
  }

  function calcRoute() {
    var start = document.getElementById(\"start\").value;
    var end = document.getElementById(\"end\").value;
    var request = {
        origin:start,destination:end,travelMode: google.maps.DirectionsTravelMode.DRIVING
    };
    directionsService.route(request,function(response,status) {
      if (status == google.maps.Directionsstatus.OK) {
        directionsdisplay.setDirections(response);
      }
    });
  }

而我的活动

<a href=\"\" onclick=\"clickroute(51.433373,-0.712251)\">test</a>

    

解决方法

        问题是您使用的是

map.panTo(latitude,longitude)

，但是google maps API使用的是：

panTo(latLng myLatLng)

，其中

latLng

是google map类。 尝试这样的事情（未经测试）

function clickroute(lati,long) {
      var latLng = new google.maps.LatLng(lati,long); //Makes a latlng
      map.panTo(latLng); //Make map global
  }

在这里查看更多信息。 编辑 正如其他人所说，您不想重新制作新地图。使其更全球化可能更容易？     ,        panTo接受LatLng对象作为参数，而不仅仅是坐标。在将其传递给panTo方法之前，请创建一个LatLng对象。

function clickroute(lati,long) {
    map.panTo(new google.maps.LatLng(lati,long));
    return false; //this will cancel your navigation
}

重新加载页面的原因是您没有取消锚标记中放置的onClick中的导航事件。参见上面代码中的注释。 就像其他人说的那样，从此函数中取出map变量并使map变为全局。     ,        您还可以即时设置新标记：

   var LatLng = new google.maps.LatLng(lat,lng);
    var marker = new google.maps.Marker({
              content: \"<h2>Hier wohne ich!</h2>\",map: map,position: results[0].geometry.location 
              });
    map.panTo(LatLng);

    ,        线...

map = google.maps.Map(document.getElementById(\"map_canvas\"));

..实际上正在尝试在#map_canvas Div中创建新地图。由于该映射应该已经存在，因此您不需要该赋值语句。刚打电话

map.panTo(lati,long)

应该管用？ 编辑：对不起，SSRide360是正确的，应该是...

map.panTo(new google.maps.LatLng(lati,long));