javascript 左上角的谷歌地图中心
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/14044758/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Google Map Centers at top left corner
提问by Devyn
I've been looking at many different examples, problems, and other things regarding this and I can't seem to find anything, so i'll finally ask a question.
我一直在查看与此相关的许多不同示例、问题和其他事情,但似乎找不到任何东西,所以我最终会提出一个问题。
The map I have does not center the marker and doesn't even display it. The point it the very top left corner. See here: http://i.imgur.com/Cc1ZK.png
我拥有的地图没有将标记居中,甚至没有显示它。点它的左上角。见这里:http: //i.imgur.com/Cc1ZK.png
I have a tab system for contact information. When someone clicks a tab, the map and info slides down and shows up the proper marker (4 separate maps), however I can't get the first one to work so I can't copy/paste it.
我有一个用于联系信息的标签系统。当有人点击一个选项卡时,地图和信息会向下滑动并显示正确的标记(4 个单独的地图),但是我无法让第一个工作,所以我无法复制/粘贴它。
Here is my code:
这是我的代码:
Script:
脚本:
var latlng = new google.maps.LatLng(42.3535727, -83.0591444);
var options = {
zoom: 14,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP,
};
var map = new google.maps.Map(document.getElementById('detroit_map'), options);
marker1 = new google.maps.Marker({
position: new google.maps.LatLng(42.3535727, -83.0591444),
map: map
});
map.setCenter(latlng);
Html:
网址:
<div id="detroit_map" style="width:270px;height:170px;"></div>
P.S, I get no errors in chrome developer tools.
PS,我在 chrome 开发者工具中没有发现错误。
It's hopefully something really simple that I overlooked.
希望这是我忽略的一些非常简单的事情。
Thanks
谢谢
Found the answer for future viewers:
为未来的观众找到了答案:
Turns out, my tabs causing the display between block, and none were making my map load weird. I made an initialize function for each, and called setTimout('functionName', 1000); to call the maps to load.
事实证明,我的选项卡导致块之间的显示,并且没有使我的地图加载变得奇怪。我为每个函数都做了一个初始化函数,并调用了 setTimout('functionName', 1000); 调用要加载的地图。
I changed my map code a little bit, but everything can we found on w3schools under their tutorial.
我稍微更改了我的地图代码,但是我们可以在 w3schools 的教程下找到所有内容。
回答by Thomas
Initialize the map after the tab is clicked. This also works for the iframe google map, when used inside a tab.
单击选项卡后初始化地图。当在选项卡内使用时,这也适用于 iframe 谷歌地图。
回答by iamkrillin
Tell your map to resize..
告诉你的地图调整大小..
google.maps.event.trigger(map, 'resize');
map is the map instance that is returned by
map 是返回的地图实例
map = new google.maps.Map(document.getElementById("map_canvas"), {
mapTypeId: google.maps.MapTypeId.ROADMAP
});