I am attempting to load the following geoJson file in a test app based on the standard HelloWorld sample app.
{
"type": "FeatureCollection",
"generator": "overpass-turbo",
"copyright": "The data included in this document is from www.openstreetmap.org. The data is made available under ODbL.",
"timestamp": "2016-09-12T19:22:48Z",
"features": [
{
"type": "Feature",
"id": "way/442106309",
"properties": {
"@id": "way/442106309",
"addr:city": "Ottawa",
"addr:housenumber": "999",
"addr:postcode": "H8G8F9",
"addr:street": "My Road",
"building": "apartments",
"building:levels": "3",
"levels": "3"
},
"geometry": {
"type": "Polygon",
"coordinates": [
[
[
-75.7337391,
45.3783003
],
[
-75.7335222,
45.378383
],
[
-75.7335439,
45.3784096
],
[
-75.733525,
45.3784206
],
[
-75.7335406,
45.3784375
],
[
-75.7335003,
45.378453
],
[
-75.7335867,
45.378543
],
[
-75.7338474,
45.3784262
],
[
-75.7337391,
45.3783003
]
]
]
}
}]}
I am loading this using the following code:
var dataSource = Cesium.GeoJsonDataSource.load('../data/kirkwood.json').then(function(data) {
viewer.dataSources.add(data);
viewer.zoomTo(data);
}
This results in the following error message:
An error occurred while rendering. Rendering has stopped.
RangeError: Invalid array length
RangeError: Invalid array length
at updateFrustums (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:155215:36)
at createPotentiallyVisibleSet (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:155389:13)
at executeCommandsInViewport (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:155943:9)
at updateAndExecuteCommands (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:155841:17)
at render (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:156177:9)
at Scene.render (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:156215:13)
at CesiumWidget.render (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:164962:25)
at render (http://127.0.0.1:8081/Build/CesiumUnminified/Cesium.js:164364:32)
I am confused, as the geoJson validates just fine using http://geojson.io and http://geojsonlint.com
Could anyone offer some helpful suggestions?
Thanks!
The error you've shown here is unfortunately kind of a catch-all error from the inside of the Cesium render loop. It's one that crops up anytime an invalid object introduces an invalid bounding sphere into the list of visible objects. Sadly this error isn't thrown when the bad object is first added to the list. The error doesn't get thrown until Cesium's render loop attempts to render all the objects, with a bad object included. The bad object is discovered long after its creation routines are gone from the call stack, and as such the error doesn't pinpoint where things first went wrong. The bottom of the call stack just asks for the next frame to render, meaning the code that introduced the problem has already completed and returned.
That said, the code you've shown here does work for me in Cesium 1.25. It shows a yellow polygon on a particular building. But, some of the variable names here look wrong to me, suggesting you may be mis-using them in other parts of your code that you haven't shown here. In particular, dataSource is really a Promise, not a real DataSource, and data is the real dataSource. So, I suggest a rename:
var dataSourcePromise = Cesium.GeoJsonDataSource.load('../data/kirkwood.json').then(
function(dataSource) {
viewer.dataSources.add(dataSource);
viewer.zoomTo(dataSource);
}
);
This code isn't any different from what you posted, but what you posted works fine on my machine. What I've done here is rename some variables in case you were trying to use them elsewhere, creating problems. This should hopefully make it clear that you can't use dataSourcePromise as an actual DataSource.
If you haven't found the problem after applying this re-factoring, you may need to either post here or remove any additional code you have that is adding objects to be rendered in Cesium. The error makes it clear that some kind of invalid object has been added to the render loop.