Question

我正在与Leaflet一起尝试使一些GeoJSON正常运行。一切正常，地图可以正常工作，但是在DevTools控制台中，我遇到了无效的GeoJSON错误。我的组件是：

我有getRegionsGeoJson，它从某些URL返回给我geoJSON。

ngOnInit() {
    this.regionsGeoJsonSubscription$ = this.mapService.getRegionsGeoJson()
      .subscribe(regionsGeoJson => {
          this.regionsGeoJson = regionsGeoJson;
          this.regionsGeoJsonLoaded = Object.keys(this.regionsGeoJson).length > 0;
          this.statisticsEnabled = true;
          this.hidePreloader();
        }
      );

    // LeafletJS map init
    this.map = L.map('map')
      .setView([-25.441105, -49.276855], 13);

    L.tileLayer
      .provider('OpenStreetMap.Mapnik')
      .addTo(this.map);

    L.geoJSON( {
      style: function (feature) {
        return {color: feature.properties.color};
      }
    }).bindPopup(function (layer) {
      return layer.feature.properties.description;
    }).addTo(this.map);

  }
  hidePreloader() {
    this.preloader.nativeElement.style.display = 'none';
  }
}

Answer 1

L.geoJSON工厂期望其第一个参数是您的GeoJSON数据，如果以后将使用addData方法提供该参数，则为null。

您看到的错误是因为它试图将optuons对象解释为GeoJSON objetc，并且显然失败了。

Answer 2

解决方案：

L.geoJSON(this.regionsGeoJson <-- solution {
  style: function (feature) {
    return {color: feature.properties.color};
  }
}).bindPopup(function (layer) {
  return layer.feature.properties.description;
}).addTo(this.map);

LeafletJS无效的GeoJSON对象

2 个答案: