Overlay country data with GeoJSON

CesiumJS
1

I've been struggling with finding a way to incorporate country data from naturalearthdata.com into a Cesium application. I get the following errors:

An error occurred while rendering. Rendering has stopped.
DeveloperError: normalized result is not a number
Error
    at new DeveloperError (http://localhost:8080/Source/Core/DeveloperError.js:44:19)
    at Function.Cartesian3.normalize (http://localhost:8080/Source/Core/Cartesian3.js:459:19)
    at computeTriangleAttributes (http://localhost:8080/Source/Core/GeometryPipeline.js:1903:24)
    at splitLongitudeTriangles (http://localhost:8080/Source/Core/GeometryPipeline.js:2060:17)
    at Object.GeometryPipeline.splitLongitude (http://localhost:8080/Source/Core/GeometryPipeline.js:2484:17)
    at geometryPipeline (http://localhost:8080/Source/Scene/PrimitivePipeline.js:139:38)
    at Object.PrimitivePipeline.combineGeometry (http://localhost:8080/Source/Scene/PrimitivePipeline.js:282:26)
    at combineGeometry (http://localhost:8080/Source/Workers/combineGeometry.js:12:41)
    at http://localhost:8080/Source/Workers/createTaskProcessorWorker.js:56:42

naturalearthdata.com gives me shp, prj, shx, and dbf files. I have not found a way to visualize shapefiles on Cesium, so I have been trying to convert it to GeoJSON (mostly because of the sandcastle example) using mapshaper.com and various other websites, with no luck. I saved the json file to the same folder as the sandcastle example, and here is my very simple code:

var viewer = new Cesium.Viewer('cesiumContainer');

Sandcastle.addDefaultToolbarButton('Default styling', function() {
    viewer.dataSources.add(Cesium.GeoJsonDataSource.load('../../SampleData/ne_10m_admin_0_countries2.json'));
});

I realize I'm probably missing something very basic here, but please help! How can I overlay countries with borders?

2

Hello,

Could you attach the GeoJSON file so we can take a look at it? I think the problem is some of the positions of the polygon being at either the north or south pole. We have a related issue open here: https://github.com/AnalyticalGraphicsInc/cesium/issues/4760

Best,

Hannah

3

Thank you for the quick response. Here’s the file.

ne_10m_admin_0_countries2.json (1.39 MB)

4

What version of Cesium are you using? I was able to load this file fine in our current master branch, so it’s possible the bug was fixed between the version you’re using and now. Try updating to Cesium 1.29 when it is released on January 2, and let me know if you still see the problem then.

Best,

Hannah

5

I was running 1.27. I upgraded to the current 1.28 and the issue still occurs. I’ll let you know if it still happens after I upgrade to 1.29.

6

Unfortunately upgrading to v 1.29 did not resolve the error. Any other thoughts?

7

I was able to reproduce the crash. For some reason it’s crashing in Sandcastle but not our test CesiumViewer application. I’ve submitted a bug report here: https://github.com/AnalyticalGraphicsInc/cesium/issues/4801
In the meantime, I did find a possible workaround. If you don’t need the 2D and Columbus view map modes, you can set ‘scene3DOnly: true’ and the geometry renders fine.

var viewer = new Cesium.Viewer(‘cesiumContainer’, {
scene3DOnly: true
});

viewer.dataSources.add(Cesium.GeoJsonDataSource.load(’…/…/SampleData/ne_10m_admin_0_countries2.json’));

``

Best,

Hannah

8

Thank you!!!