javascript - 谷歌地图 setVisible 不是函数

Question

这是我的 markers[] 数组:

partnerMarkers = [
        // London
        { lat: 51.515482718, lng: -0.142903122, name: "London", content: "Our home town and international hub." },
// Dubai
        { lat: 25.2644444, lng: 55.3116667, name: "Middle East", content: "Dubai desc" }
];

我有这个函数，循环遍历标记数组(由别处的按钮触发):

function toggle_layer(markers) {
    for (var i=0; i<markers.length; i++) {
        markers[i].setVisible(false);
    }
}

我得到 markers[i].setVisible is not a function - 但是这工作正常:

function toggle_layer(markers) {
    for (var i=0; i<markers.length; i++) {
        console.log(markers[i]);
    }
}

为什么 setVisible 在此上下文中不起作用？

Answer 1

这是 JSFiddle Demo:

似乎您的标记只是对象而不是 google.maps.Markers，因此它没有 setVisible() 函数。您基本上希望将对象中的数据转换为 google.maps.Marker 对象。我创建了一个全局数组 gooMarker 来保存标记。通过单击 map 下方的链接，它会隐藏标记。下面是创建标记然后隐藏它们的方法:

HTML 标记:

<div id='parent'>
    <div id="map_canvas" style="width: 650px; height: 550px;"></div>
</div>
<div id='hidemark'>Click to hide markers</div>

JavaScript + Google Map V3 API:

var map;
var gooMarker = [];

var partnerMarkers = [
   {
    lat: 51.515482718,
    lng: -0.142903122,
    name: "London",
    content: "Our home town and international hub."},
    {
    lat: 25.2644444,
    lng: 55.3116667,
    name: "Middle East",
    content: "Dubai desc"}
];

function initialize() {

    var london = new google.maps.LatLng(51.5, 0);

    var myOptions = {
        backgroundColor: '#FFFFF',
        zoom: 2,
        center: london,
        navigationControl: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };

    var map_canvas = document.getElementById("map_canvas");

    map = new google.maps.Map(map_canvas, myOptions);

    for (var i = 0; i < partnerMarkers.length; i++) {
        gooMarker.push(new google.maps.Marker({
            position: new google.maps.LatLng(partnerMarkers[i].lat, partnerMarkers[i].lng),
            map: map,
            title: partnerMarkers[i].name
        }));
    }
}

function hideMarkers(){
    for(var i=0; i<gooMarker.length; i++){
        gooMarker[i].setVisible(false);
    }
}

document.getElementById('hidemark').onclick = hideMarkers;

window.onload = initialize;