Javascript 谷歌地图PantoOnClick

我试着点击地图上的一个区域。脚本不工作，正在重新加载页面。也许有人能看到这个问题

我的职能

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（纬度、经度）

，但google maps API使用的是：

panTo（latLng myLatLng）

其中

latLng

是google地图类

试试这样（未经测试）

寻找更多信息

编辑 正如其他人所说，你不想重新制作一张新地图。也许更容易使其全球化？

该行

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

。。实际上正在尝试在#Map_canvas Div中创建一个新映射。由于该映射应该已经存在，因此不需要该赋值语句。只是打电话

map.panTo(lati,long)

应该有用吗

编辑：对不起，SSRID360是正确的，应该是

---

panTo接受LatLng对象作为参数，而不仅仅是坐标。在将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);

var-LatLng=新的google.maps.LatLng（lat，lng）；
var marker=new google.maps.marker({
内容：“我的天哪！”，
地图：地图，位置：结果[0]。几何体。位置
});
panTo地图（拉丁美洲）；

您可以执行以下操作：

var latLng = new google.maps.LatLng(lat_val, lng_value);
map.panTo(latLng);`

---

工作起来很有魅力！这个有定制吗？像流体运动？现在它会捕捉到该位置，然后地图会慢慢渲染。。。

   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);

var latLng = new google.maps.LatLng(lat_val, lng_value);
map.panTo(latLng);`