Question

我在点击手风琴元素时尝试显示特定的地图标记，并隐藏其他标记（如果存在）。

我正在建立我的标记：

function setMarkers(data) {

    var items, markers_data = [];

    if (data.length > 0) {
        items = data;
        j = 0;
        for (var i = 0; i < items.length; i++) {
            var item = items[i];
            j++
            lat_long = ('"' + item.martygeocoderlatlng + '"');
            lat_long = lat_long.replace(/\(|\)/g, '');
            lat_long = lat_long.split(',');

            lat = lat_long[0].replace('"', '');
            lng = lat_long[1].replace('"', '');

            marker_id = item.id;

            if (lat != undefined && lng != undefined) {
                var icon = 'community.png';

                markers_data.push({
                    lat: lat,
                    lng: lng,
                    id: marker_id,
                    title: item.title.rendered,
                    infoWindow: {
                        content: '<div class="infoWindow"><h3>' + item.title.rendered + '</h3>' + item.content.rendered + '<strong>Phone:</strong> <a target="_blank" href="tel:' + item.aoi_phone + '">' + item.aoi_phone + '</a><!--<br><strong>Hours:</strong> ' + item.aoi_hours + '--><br><a href="' + item.aoi_url + '">Visit Website</a></div>'
                    },
                    icon: {
                        url: '/wp-content/plugins/lstar-custom/assets/img/list_marker_' + j + ".png",
                        //anchor:new google.maps.Point(scaledSize/4,scaledSize/4),
                        size: new google.maps.Size(25, 25)
                    },
                    animation: google.maps.Animation.DROP,
                });
            }
        }
    }
    // console.log(markers_data);
    map.addMarkers(markers_data);

}

我用这个交替传递给setMarkers函数的数据：

jQuery('#poi_cat_amusementattractions').one('click', function(e) {
    var xhr_cat_amuse = jQuery.getJSON('path/to/json');
    xhr_cat_amuse.done(setMarkers);
});
jQuery('#poi_cat_dining').one('click', function(e) {
    var xhr_cat_dine = jQuery.getJSON('path/to/json');
    xhr_cat_dine.done(setMarkers);
});

哪种标记可以在地图上显示，但是如何在单击元素时删除任何现有标记？

我也在使用这个插件用于gmaps。 https://hpneo.github.io/gmaps/

Answer 1

您在评论中提到的库包含removeMarkers function（清除已添加到地图中的所有标记）。

您可以在致电addMarkers之前在function setMarkers (data) { ... // Clear the map from all markers map.removeMarkers(); // Add new markers to the map map.addMarkers(markers_data); }功能中调用此功能：

.mouse {
  margin-bottom:20px;
  padding:5px;
  overflow:hidden;
  width:200px;
}
.mouse:after {
  content:"";
  height:2px;
  display:block;
  background:red;
  margin-top:5px;
  transition: transform 1s;
  transform:translateX(100%);
}
.mouse:hover:after {
  transform:translateX(-100%);
}

如何使用jQuery单击事件替换地图标记？

1 个答案: