当 img 设置为 max-width 时,Google 地图无法将位置居中。有一个解决办法,就是放
#map_canvas img {
max-width: none;
}
不过,这似乎对我不起作用,因为我没有使用 Javascript API,所以似乎没有 map_canvas。我只是使用 iFrame 嵌入。
当我尝试在 iframe 周围添加一个 div 并设置参数时,我仍然得到相同的结果。
我不确定要编写/附加什么来使谷歌地图 iframe 播放得很好。
当 img 设置为 max-width 时,Google 地图无法将位置居中。有一个解决办法,就是放
#map_canvas img {
max-width: none;
}
不过,这似乎对我不起作用,因为我没有使用 Javascript API,所以似乎没有 map_canvas。我只是使用 iFrame 嵌入。
当我尝试在 iframe 周围添加一个 div 并设置参数时,我仍然得到相同的结果。
我不确定要编写/附加什么来使谷歌地图 iframe 播放得很好。
您使用的是 iframe 的交互式地图还是 iframe 的静态谷歌地图图像?
如果您使用 iframe 使用交互式谷歌地图,则需要确保在地图变量中声明“中心”属性。不幸的是,地图只会在页面初始加载时居中,这意味着如果您以较大的分辨率加载页面然后按比例缩小地图将偏离中心,因为在创建地图时,中心被定义为不同的位置(以较小的分辨率刷新可以解决此问题。)
// Google Maps
var map;
function initialize() {
var mapOptions = {
zoom: 17,
draggable: true,
center: new google.maps.LatLng(38.913914,-94.637427), // this one
mapTypeId: google.maps.MapTypeId.ROADMAP
};
在声明图像 src 时,它应该看起来像这样:
<img src="maps.googleapis.com/maps/api/staticmap?center=46168&zoom=11
&size=300×300&maptype=roadmap&sensor=false" alt="google map" />
您所做的只是更改一些值,然后您可以将此地图放置在您想要的任何位置。
居中选项