如何使用API​​ v3对谷歌地图地图进行居中和缩放 [英] How do I center and zoom a google maps map using API v3

问题描述

大家好，

我使用谷歌地图几何图书库在地图上存储路线。现在我想加载该路由，因此我使用以下代码：

  var  encoded = $（ ＃ContestRouteInfo）。val（）; 
 map.config.routingPoly =  new  google.maps.Polyline（{
 map：map.config.map，
 strokeColor： ' ＃fc4c02'，
 strokeOpacity： 0 。 75 ，
}）; 
 
 map.config.path = google.maps.geometry.encoding.decodePath（encoded）; 
 map.config.routingPoly.setPath（map.config.path）; 

运行正常，路线完美在地图上绘制，但是在加载后我想缩放地图并（重新）设置地图的中心，以便路线可见。如何确定完美的缩放级别和地图中心？

解决方案

（ ＃ContestRouteInfo）VAL（）;
map.config.routingPoly = new google.maps.Polyline（{
map：map.config.map，
strokeColor： ' ＃fc4c02'，
strokeOpacity： 0 。 75 ，
}）;

map.config.path = google.maps.geometry.encoding.decodePath（encoded）;
map.config.routingPoly.setPath（map.config.path）;

运行正常，路线完美在地图上绘制，但是在加载后我想缩放地图并（重新）设置地图的中心，以便路线可见。如何确定完美的缩放级别和地图中心？

我认为您必须在google.maps.event.addListener功能中使用此代码

  if （place.geometry.viewport）{
 map.fitBounds（ place.geometry.viewport）; 
}  else  {
 map.setCenter（place.geometry.location）; 
 map.setZoom（ 14 ）;  //  您可以在此处设置完美缩放级别。 
} 

Hello all,
I've used the Google maps geometry library to store a route on a map. Now I want to load that route, therefore I use the following code :

var encoded = $("#ContestRouteInfo").val();
map.config.routingPoly = new google.maps.Polyline({
    map: map.config.map,
    strokeColor: '#fc4c02',
    strokeOpacity: 0.75,
});

map.config.path = google.maps.geometry.encoding.decodePath(encoded);
map.config.routingPoly.setPath(map.config.path);

This runs fine, the route is perfectly drawn on the map, however after loading I want to zoom the map and (re)set the center of the map so the route is visible. How can I determine the perfect zoom level and center of the map?

解决方案

("#ContestRouteInfo").val(); map.config.routingPoly = new google.maps.Polyline({ map: map.config.map, strokeColor: '#fc4c02', strokeOpacity: 0.75, }); map.config.path = google.maps.geometry.encoding.decodePath(encoded); map.config.routingPoly.setPath(map.config.path);

This runs fine, the route is perfectly drawn on the map, however after loading I want to zoom the map and (re)set the center of the map so the route is visible. How can I determine the perfect zoom level and center of the map?

i think you have to use this code inside your "google.maps.event.addListener" function

if (place.geometry.viewport) {
           map.fitBounds(place.geometry.viewport);
       } else {
           map.setCenter(place.geometry.location);
           map.setZoom(14); // you can set perfect zoom level here.
       }

这篇关于如何使用API​​ v3对谷歌地图地图进行居中和缩放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！