Question

我已将不同的信息传递到我的自定义Google地图中，如下所示;

marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map,
    icon:image,
    title: locations[i][0],
    price: locations[i][3],
    occupancy: locations[i][4],
});

我试图在点击按钮时过滤标记;

$(document).on('click', '#price-filter', function(){
    $.each(map.markers, function(i, marker) {
        if(marker.price <= '80.00')
            marker.visible = false;
        else
            marker.visible = true;
    });
});

这没有运行，我在function initMap() {}及其外部尝试了点击，但它不起作用。有什么想法吗？

编辑请找到位于https://jsfiddle.net/g19avj3e/

的JSFiddle

Answer 1

如果你移动initMap函数中的on click函数（这样渲染DOM并且它可以找到#price-filter复选框），它就会运行。但是没有map.markers数组。您可以创建该阵列并将标记推到其上：

// before loop
map.markers = [];

// inside loop
map.markers.push(marker);

下一个问题是标记没有记录的.visible属性，您需要使用记录的.setVisible()方法。

$(document).on('click', '#price-filter', function(){
    $.each(map.markers, function(i, marker) {
        if(marker.price <= '80.00')
            marker.setVisible(false);
        else
            marker.setVisible(true);
    });
});

proof of concept fiddle

过滤Google地图标记

1 个答案: