GeoJSON in EPSG:3857

CesiumJS
1

Hi,

I’m trying to load a GeoJson onto the map. The GeoJson is coming from GeoServer and the coordinates are in meters (EPSG:3857). The only way I could load the data correctly was by converting the coordinate points to EPSG:4326 and then load with Cesium.GeoJsonDataSource.

const proj = new Cesium.WebMercatorProjection();
featureInfo.data.geometry.coordinates.forEach(polygon => {
    polygon.forEach(ring => {
        ring.forEach((point, index, coordinateArray) => {
            const cartographic = proj.unproject(new Cesium.Cartesian3(point[0], point[1]));
            const x = Cesium.Math.toDegrees(cartographic.longitude);
            const y = Cesium.Math.toDegrees(cartographic.latitude);
            coordinateArray[index] = [x, y];
        });
    });
});

self.viewer.dataSources.add(Cesium.GeoJsonDataSource.load(featureInfo.data, {
    stroke: Cesium.Color.ORANGE,
    fill: Cesium.Color.YELLOW,
    strokeWidth: 3
}));

The code above only works for MultiPolygon feature type. Now I have to make changes to support all other feature type, which is annoying. Is there an easier way to do this?

Thank you,

Hugo

2

Hey,

To be honest I’d write a pre-processor that loads the GeoJSON file as plain JSON (ie. don’t parse the thing into an internal model), find all coords and convert them before streaming that file back to Cesium for parsing and rendering. Otherwise you’re stuck in model conversion hell.

Cheers,

Alex

3

I did write the necessary code to support all feature types, by now. It’s not a lot of work. I just feel that Cesium provides, or should provide, a better and easier way to do this.

Thank you Alexander for your feedback.

Hugo

4

Hey,

I guess it depends on CesiumJS’s focus, and I can understand that coordinate systems is on the side of the Cartesian coord system that sits at the core of the GL engine. And it makes sense to throw WGS84 in there as well, and leave all others to things like proj4.

One thing we could push for, though, would be callback functions upon Cesium digestion, which they could use internally but also expose externally for us to overwrite. For example, when you ingest a GeoJSON file to the system, have a onCoordIngest() function with a Cartographic input, so that if you’ve got a different coord system you’d extend this instead.

Cheers,

Alex

1 Like