谷歌地图api（v3）不显示标记 [英] Google maps api(v3) doesn't show markers
问题描述
我正在使用谷歌地图api（v3），我必须在地图上添加标记。
实际上，我没有任何问题显示它们，但过了一段时间，标记开始不显示或更精确，它们会不时显示。
以下是一些代码，您可以看到我在做什么以及问题来自哪里：
< ！DOCTYPE html>
< html>
< head>
< meta name =viewportcontent =initial-scale = 1.0，user-scalable = no/>
< link rel =stylesheethref =style.csstype =text / cssmedia =screen/>
< script type =text / javascriptsrc =https://maps.googleapis.com/maps/api/js?key=[KEY]&sensor=true> < /脚本>
< script type =text / javascriptsrc =google.js>< / script>
< script type =text / javascriptsrc =dataLoading.js>< / script>
< / head>
< body onload =initializeMaps（）;>
< div id =map_canvas>< / div>
< script type =text / javascript>
loadSpots（）;
< / script>
< / body>
< / html>
这里是javascript代码：
var map;
var yMarker ='http://maps.google.com/mapfiles/ms/icons/yellow-dot.png';
var gMarker ='http://maps.google.com/mapfiles/ms/icons/green-dot.png';
var bMarker ='http://maps.google.com/mapfiles/ms/icons/blue-dot.png';
var pMarker ='http://maps.google.com/mapfiles/ms/icons/pink-dot.png';
函数initializeMaps（）
{
geocoder = new google.maps.Geocoder（）;
var mapOptions =
{
center：new google.maps.LatLng（46.52863469527167,2.4389648437），
zoom：6，
mapTypeId：google.maps.MapTypeId。 ROADMAP
};
map = new google.maps.Map（document.getElementById（map_canvas），
mapOptions）;
$ b函数getLatlng（地址，名称，类型）
{
geocoder.geocode（{'address'：address}，function（results，status）{
if（status == google.maps.GeocoderStatus.OK）
{
var marker = new google.maps.Marker（{
title：name，
map ：map，
animation：google.maps.Animation.DROP，
position：results [0] .geometry.location
}）;
marker.setIcon（（type == 2？gMarker：（type == 3？bMarker：（type == 4？pMarker：yMarker））））;
}
}）;
}
函数addMarker（地址，名称，类型）
{
if（address！= null&&&address; =）
getLatlng（地址，名称，类型）;
}
EDIT1
LoadSpots（）是一个函数，它通过ajax请求从数据库获取数据，然后调用addMarker函数
<在 initializeMaps（）结尾处调用 loadSpots（），否则可能发生 map 将在其初始化之前被访问。
I am working with google maps api(v3) and i have to add markers on a map. Actually, I had no problem with displaying them or whatever but after a while the markers started not to be displayed or more precisly, they are displayed from time to time.
Here is some code so you can see what i'm doing and where the problem could come from:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=[KEY]&sensor=true"></script>
<script type="text/javascript" src="google.js"></script>
<script type="text/javascript" src="dataLoading.js"></script>
</head>
<body onload="initializeMaps();">
<div id="map_canvas"></div>
<script type="text/javascript">
loadSpots();
</script>
</body>
</html>
And here is the javascript code:
var map;
var yMarker = 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png';
var gMarker = 'http://maps.google.com/mapfiles/ms/icons/green-dot.png';
var bMarker = 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png';
var pMarker = 'http://maps.google.com/mapfiles/ms/icons/pink-dot.png';
function initializeMaps()
{
geocoder = new google.maps.Geocoder();
var mapOptions =
{
center: new google.maps.LatLng(46.52863469527167, 2.4389648437),
zoom: 6,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
}
function getLatlng(address, name, type)
{
geocoder.geocode({'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK)
{
var marker = new google.maps.Marker({
title: name,
map: map,
animation: google.maps.Animation.DROP,
position: results[0].geometry.location
});
marker.setIcon((type == 2 ? gMarker : (type == 3 ? bMarker : (type == 4 ? pMarker : yMarker))));
}
});
}
function addMarker(address, name, type)
{
if (address != null && address != "")
getLatlng(address, name, type);
}
EDIT1
LoadSpots() is a function that gets data from DB with an ajax request and then calls addMarker function
Call loadSpots() at the end of initializeMaps(), otherwise it may happen that the map will be accessed before it's initialized.
这篇关于谷歌地图api（v3）不显示标记的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
