不能在地图上得到标记

时间:2015-09-23 06:55:48

标签: javascript google-maps

我正在尝试设置地图,但标记不会显示。这是我Google地图的javascript。

<script src="http://maps.googleapis.com/maps/api/js?key=REMOVED"></script>

<script>

    google.maps.event.addDomListener(window, 'load', initialize);

    function initialize() {
    var pos = {lat: -33.911757, lng: 151.158454};

    var mapProp = {
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    center:pos,
    zoom:17,
    styles: [TOO MUCH CODE HERE SO I REMOVED IT. IT'S A SNAZZY MAP]
};

var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);

var markerImage = 'http://www.mapsmarker.com/wp-content/uploads/leaflet-maps-marker-icons/bar_coktail.png';

var marker = new google.maps.Marker({
                position: pos,
                map: googleMap,
                title: 'Snazzy!',
                icon: markerImage
});
marker.setMap(googleMap);

}
</script>

HTML:

<div id="googleMap" style="width:600px;height:400px;"></div>

我无法弄清楚为什么标记不会显示。这里出了什么问题?

2 个答案:

答案 0 :(得分:0)

您正在使用在您点击功能之外定义的标记。

您需要查看的是google maps api,并了解如何获取点击的标记ID

标记在循环中递增,并且始终是最后创建的标记

您的代码不会创建标记。你应该添加像

这样的东西
var marker = new google.maps.Marker({
    position: new google.maps.LatLng(51.54968,-0.16305), 
    map: map,
    title: "One title"
});

答案 1 :(得分:0)

在您的代码中,您将div id 'googleMap'传递给标记的map属性。 相反,您必须传递初始化的map变量。请参阅下面的评论和编辑代码。

var map=new google.maps.Map(document.getElementById("googleMap"),mapProp); //you must use this map variable
var marker = new google.maps.Marker({
                    position: pos,
                    map: map, // map variable must be passed here, instead you passed googleMap
                    title: 'Snazzy!',
                    icon: markerImage
    });