谷歌地图api(v3)没有显示标记

时间:2013-02-03 13:12:31

标签: javascript google-maps-api-3

我正在使用谷歌地图api(v3),我必须在地图上添加标记。 实际上,我没有显示它们或其他任何问题,但一段时间后标记开始不显示或更精确,它们会不时显示。

以下是一些代码,以便您了解我正在做什么以及问题可能来自哪里:

<!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>

这是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';

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()是一个使用ajax请求从DB获取数据然后调用addMarker函数的函数

1 个答案:

答案 0 :(得分:1)

loadSpots()结束时致电initializeMaps(),否则可能会在map初始化之前访问{{1}}。