setCenter()基于特定标记

时间:2015-11-29 10:44:25

标签: javascript google-maps google-maps-api-3

我想问一下谷歌地图中有关标记的问题。如果我在地图中有多个标记,我如何定位到特定标记?

我已经在下面的地图代码中添加了多个标记:

var markers = [], marker;

function setMarker()
{
    var infoWindowContent = [];
    for (var i = 0; i < locations.length; i++) {
        infoWindowContent[i] = '<div id="content">' +'<h2>' +locations[i][0] +'</h2>' +'<div id="bodyContent"><p>Latitude: ' +locations[i][1] +'<br/>Longitude: ' +locations[i][2] +'<br/>Speed: ' +locations[i][3] +'KM/h</div></div>';

        marker = new google.maps.Marker({
            position: new google.maps.LatLng(locations[i][1], locations[i][2]),
            map: map,
            title: locations[i][0],
            id: locations[i][4],
            icon: 'http://pickndrop.my/img/school_bus.png'
            });

            markers.push(marker);

            // Display multiple markers on a map
            var infoWindow = new google.maps.InfoWindow();

            google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infoWindow.setContent(infoWindowContent[i]);
                infoWindow.open(map, marker);
                map.setCenter(marker.position);
                }
            })(marker, i));
    }
}

在上面的代码中,我已经创建了一个数组来推送所有标记。现在我想要定位一个特定的标记,以便我可以根据用户输入(从下拉列表)更改地图中心。例如,当用户选择标记1时,地图中心将更改为标记1.我尝试使用下面的代码,但它无效。

<select id="children" onchange="setTarget()">
    <option value="0">Marker 1</option>
    <option value="1">Marker 2</option>
</select>


function setTarget()
{   
    var x = document.getElementById('children').value;
    map.setCenter(markers[x].getPosition());
}

谢谢。

1 个答案:

答案 0 :(得分:0)

上面的代码工作正常,我不能正确地从数据库中检索值。