Question

我有一个角度2应用程序，其中我集成了谷歌地图。我有两个geojson文件，我从服务器获取，需要在地图上显示。这些文件包含每个功能的属性颜色。

我在提取文件后动态包含颜色。

在我的地图组件中，我有以下内容：

ngOnInit() {
        this.subscription = this.service.loadGeoJson().subscribe(() => this.geoJsonInit());
    }

    ngOnDestroy() { this.subscription.unsubscribe(); }

    private geoJsonInit() {
        Promise.resolve(dashboardMapService.getAllGeoJsonData().then(geoData => this.geoJsonData.push(...geoData))).then(() => dashboardMapService.loadAPI().then(res => this.onMapsReady()));
    }

在地图服务中，我有以下内容：

    const GEO_JSON: Array<Object> = [];
    let GeoJsonPromise            = Promise.resolve(GEO_JSON);

//rest of service

static getAllGeoJsonData() {
        return GeoJsonPromise;
    }

    loadGeoJson(): Observable<any> {
        if ( GEO_JSON && GEO_JSON.length > 0 ) return Observable.of(GEO_JSON);
        else
            return Observable.forkJoin([ this.loadDistrictsGeoJson(), this.loadSubDistrictsGeoJson() ]).switchMap(d => this.GeoJsonInit(d));
    }

我面临的问题是，在初始加载时，多边形显示在地图上但没有颜色。但如果我切换路线并返回地图路线，则会显示颜色。

在控制台中。 feature.getProperty（'color'）最初显示未定义，但是在从地图路线来回走后，它们就被定义了。

所以我假设传递的geojsons文件最初不包含颜色。

如何在将地理数据加载到地图之前确保正确获取地理数据？

Answer 1

private geoJsonInit() {
    Promise.resolve(dashboardMapService.getAllGeoJsonData().then(geoData => this.geoJsonData.push(...geoData))).then(() => dashboardMapService.loadAPI().then(res => this.onMapsReady()));
}

返回undefined - 你应该做的是

private geoJsonInit() {
    return dashboardMapService.getAllGeoJsonData()
        .then(geoData => this.geoJsonData.push(...geoData))
        .then(() => dashboardMapService.loadAPI())
        .then(res => this.onMapsReady());
}

如何确保正确加载geojson文件？

1 个答案: