我如何使用复选框过滤 google 地图并将标记放入 google 地图？

Question

我在使用复选框过滤 google 地图和插入 google 地图标记时遇到问题。在这里我想通过复选框过滤结果。就像当我搜索沙特阿拉伯地区的任何城市时，它应该向我展示一些关于陈列室服务的观点。陈列室服务过滤器默认工作。现在，当我点击任何其他过滤器时，它应该显示标记，当我取消选中它时，它应该删除标记。请社区帮助我。

我在这里粘贴我的产品link

https://cdn.assetrepository.me/maps-test/ 除过滤器外，一切正常。这是我用来过滤数据的代码。

var listfilter = [];
$('input[name="showroom_services"]').on("change", function(){
    if ($('input[name="showroom_services"]').is(':checked')) {
        markerCluster.clearMarkers();
        listfilter = [];
        $.each(function(){
            listfilter.push($(this).attr());
        });
        $.each(jsondata, function(key, value) {
            drawMarkers(value);
        });
    }
});

Answer 1

此功能略有变化我希望它能起作用。您的 fiddle 不工作，因此很难给出准确的优化解决方案。试试这个，我希望它能正常工作。如果这项工作正常，那么您将不得不做一些更改，因为此代码未优化。你的绘图员一次又一次地打电话。因此，我会建议更改您的 drawmakers 功能并对其进行优化（可能 google 提供一些方法以更优雅的方式制作标记）

只需替换

var listfilter = [];
$('input[name="showroom_services"]').on("change", function(){
    if ($('input[name="showroom_services"]').is(':checked')) {
        markerCluster.clearMarkers();
        listfilter = [];
        $.each(function(){
            listfilter.push($(this).attr());
        });
        $.each(jsondata, function(key, value) {
            drawMarkers(value);
        });
    }
});

和

    $('input[name="showroom_services"]').on("change", function(){
    var searchField = $('#showroom_search').val();
    var expression = new RegExp(searchField, "i");
    var listfilterW=[];
    markerCluster.clearMarkers();
    var markerAlreadyMade=[];
    $('input[name="showroom_services"]').each(function(){
        if($(this).prop("checked")==true) {
        let crRef=$(this);
        $.each(jsondata, function(key, value) {
            if(value['services_list'].indexOf($(crRef).val())!==-1)
                if(markerAlreadyMade.indexOf(value.dealerId)==-1){
                    if(value.city.search(expression) != -1){
                        listfilterW.push(value);
                        markerAlreadyMade.push(value.dealerId)
                    }
                }
        });
        }
    })
    $.each(listfilterW, function(key, value) {
                drawMarkers(value);
        });
});

我希望这能奏效，如果不行，请告诉我。如果我有空，那么我一定会看到这个。 :)

我如何使用复选框过滤 google 地图并将标记放入 google 地图？

how do i filter google maps with checkbox and put the marker in google map?

javascript

jquery

json

google-maps-markers