谷歌地图多个标记

时间:2013-07-16 10:43:38

标签: javascript google-maps

我知道网上已经多次询问过这个问题。但我仍然无法解决这个问题,已经有几天了,但我还是无法解决。我还是这个谷歌地图API的新手,也许还有一些我混淆了什么。

以下是我目前的代码:

var places = [
              ['Car Park', 1.301526,103.849379, 4],
              ['Bus Stop', 1.301132,103.850077, 3],
              ['MRT', 1.298515,103.845785, 2],
              ['Success Human Resource Center', 1.301486,103.849712, 1]
            ];

            var companyImage0 = new google.maps.MarkerImage('images/map-icon.png',
                new google.maps.Size(54,62),
                new google.maps.Point(0,0),
                new google.maps.Point(50,50)
            );

            var companyImage1 = new google.maps.MarkerImage('images/MRT.png',
                new google.maps.Size(30,30),
                new google.maps.Point(0,0),
                new google.maps.Point(50,50)
            );

            var companyImage2 = new google.maps.MarkerImage('images/bus-stop.png',
                new google.maps.Size(30,33),
                new google.maps.Point(0,0),
                new google.maps.Point(50,50)
            );

            var companyImage3 = new google.maps.MarkerImage('images/car-park.png',
                new google.maps.Size(30,30),
                new google.maps.Point(0,0),
                new google.maps.Point(50,50)
            );

            var companyShadow = new google.maps.MarkerImage('images/logo_shadow.png',
                new google.maps.Size(54,62),
                new google.maps.Point(0,0),
                new google.maps.Point(65, 50)
            );

            /*var companyPos = new google.maps.LatLng(1.301486,103.849712);*/

            for (var i = 0; i < places.length; i++) {
            var place = places[i];
            var myLatLng = new google.maps.LatLng(place[1],place[2]);
            var marker = new google.maps.Marker({
                position: myLatLng,
                map: map,
                shadow: companyShadow,
                icon: companyImage[i],
                title: 'Singapore',
                zIndex: places[2][2]});
            }

除此之外,我只想在用户点击SHRC标记时显示信息窗口,单击标记时,公交车站和MRT将没有任何内容。

感谢任何可以帮助我的灵魂。提前谢谢。

1 个答案:

答案 0 :(得分:1)

我不太确定你在这里要做什么,因为你对你所收到的错误一无所知。但是,您的代码中有三个错误:

CompanyMarker尚未初始化,并且您使用了错误的变量名称和z-index语法。请记住,数组是从零开始的索引,所以

places[2] // will retrieve the SHRC row data
places[2][2] //will retrive the Z-index number from the SHRC row

因此,请尝试以下更改:

var places = [
  ['Bus Stop', 1.301132,103.850077, 3],
  ['MRT', 1.298515,103.845785, 2],
  ['SHRC', 1.301486,103.849712, 1]
];

//change marker to companyMarker
var companyMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  shadow: companyShadow,
  icon: companyImage,
  title: 'Singapore',
  zIndex: places[2][2]}); //<- change from place[3], get the z-index number
}

google.maps.event.addListener(companyMarker, 'click', function() {
  infowindow.open(map,companyMarker);
});

最后,如果您有Bus Stop和MRT标记的其他事件处理程序,则需要将infowindow.close(map, someMarkerName)添加到companyMarker侦听器以关闭相应的窗口。