过滤标记谷歌地图API V3

Filtering Markers Google Maps API V3

本文关键字：API V3 谷歌地图 过滤      更新时间：2023-09-26

我需要你的帮助:

目前我在Google Maps电子表格中有一组数据。有几件事我需要过滤这些数据。例如类别和类型。

这些是使用JSON收集的:

/** 
 * Called when JSON is loaded. Creates sidebar if param_sideBar is true.
 * Sorts rows if param_rankColumn is valid column. Iterates through worksheet rows, 
 * creating marker and sidebar entries for each row.
 * @param {JSON} json Worksheet feed
 */       
function cm_loadMapJSON(json) {
  var bounds = new google.maps.LatLngBounds();
  for (var i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    if(entry["gsx$" + param_latColumn]) {
      var lat = parseFloat(entry["gsx$" + param_latColumn].$t);
      var lng = parseFloat(entry["gsx$" + param_lngColumn].$t);
      var point = new google.maps.LatLng(lat,lng);
      var html = "<div class='infoscherm' style='font-size:12px'>";
      html += "<h2>" + entry["gsx$"+param_titleColumn].$t 
              + "</h2>";
      var label = entry["gsx$"+param_titleColumn].$t;
      if(entry["gsx$" + param_screenCategory]) {
        html += "<h3>" + "Screen Category/Purpose: " + "</h3>" + "<p>" + entry["gsx$"+param_screenCategory].$t + "</p>";
      }
      var screentype = entry["gsx$"+param_screenType].$t;
      if(entry["gsx$" + param_screenType]) {
        html +=  "<h3>" + "Screen Type: " + "</h3>" + "<p>" + entry["gsx$"+param_screenType].$t + "</p>";
      }
      if(entry["gsx$" + param_publicSpace]) {
        html += "<h3>" + "Type of Public Space: " + "</h3>" + "<p>" + entry["gsx$"+param_publicSpace].$t + "</p>";
      }
      var space = entry["gsx$"+param_publicSpace].$t;
      if(entry["gsx$" + param_screenInteraction]) {
        html += "<h3>" + "Type of interaction: " + "</h3>" + "<p>" + entry["gsx$"+param_screenInteraction].$t + "</p>";
      }
      if(entry["gsx$" + param_descriptionColumn]) {
        html += "<h3>" + "Description: " + "</h3>" + "<p>" + entry["gsx$"+param_descriptionColumn].$t + "</p>";
      }
      if(entry["gsx$" + param_screenAddress]) {
        html += "<h3>" + "Screen Location: " + "</h3>" + "<p>" + entry["gsx$"+param_screenAddress].$t + "</p>";
      }
      html += "</div>";
      // create the marker
      var marker = cm_createMarker(kaart,point,label,html,screentype,space);
      // cm_map.addOverlay(marker);
      cm_mapMarkers.push(marker);
      cm_mapHTMLS.push(html);
      bounds.extend(point); 
    }
  }
  kaart.fitBounds(bounds);
  kaart.setCenter(bounds.getCenter());
}

现在我希望能够过滤位于数组中的标记。因此，只显示符合过滤器的标记。

此函数从地图中删除所有标记。我正在考虑修改这个函数，为标记创建一个良好的动态过滤器。但是我想不出来。任何帮助吗?或者是其他更好的工作方式?

function clearOverlays() {
  if (cm_mapMarkers) {
    for (i in cm_mapMarkers) {
      cm_mapMarkers[i].setMap(null);
    }
  }
}

thank x In advance

您需要并行数组或键值数组，例如:

cm_mapMarkers.push({ point: marker, category: 'something' });

然后

function showSome(categoryName) {
  if (cm_mapMarkers) {
    for (var i = 0, marker; marker = cm_mapMarkers[++i]; ) {
      if(marker.category == categoryName){
        // do something with this marker
      }else{
        // do or do not with others.
      }
    }
  }
}
相关文章：