colors - 自定义作为来自静态文件的 geoJson 文件的传单覆盖

Question

我正在使用 Leaflet 构建地图应用程序。我正在从静态文件中提取国会选区的 geojson 文件。我想为每个包含地区名称的地区添加一个弹出窗口 - 它位于 geojson 文件中。我也想用独特的颜色给这些地区上色。

我已经尝试使用此代码添加带有地区名称的弹出窗口。这没用。

  var polygons;
  $.getJSON(
    "http://localhost:8080/assets/geo/NationalCongressional.json",
    function(data) {
      polygons = L.geoJSON(data, {
        style: myCustomStyle,
        onEachFeature: function(feature, layer) {
          layer.bindPopup(feature.properties.name);
        }
      });
    }
  );
  var overlays = {
    polygons: polygons
  };

  L.control.layers(baseMaps, overlays).addTo(myMap);

错误是多边形未定义。

如果我不乱用这样的代码来自定义图层，那么我可以直接将 geojson 添加到我的地图中，没有问题。像这样...

  var NationalCongressional = new L.geoJson.ajax(
    "http://localhost:8080/assets/geo/NationalCongressional.json",
    {
      style: upperHouseStyle
    }

  var overlays = {
    NationalCongressiona: NationalCongressional
  };

  L.control.layers(baseMaps, overlays).addTo(myMap);
  );

标签： colorspopupleafletoverlaygeojson

Answer 1

弄清楚了。这是解决方案...

  var NationalCongressional = new L.geoJson.ajax(
    "http://localhost:8080/assets/geo/NationalCongressional.json",
    {
      style: upperHouseStyle,
      onEachFeature: function(feature, layer) {
        layer.bindPopup(feature.properties.NAMELSAD);
        if (feature.properties.NAMELSAD == "Congressional District 8") {
          console.log("found a match");
          layer.setStyle({ color: "orange" });
        }
      }
    }
  );

  var overlays = {
    NationalCongressional: NationalCongressional
  };

  L.control.layers(baseMaps, overlays).addTo(myMap);