GeoJSON positioning & styling

CesiumJS
1

Hi all,

As a Cesium beginner, I’m starting with a basic example, displaying points stored in GeoJSON.
See the example [1].

I got 2 problems in this example:

- Positioning: as you pan the map, you can see the points are moving too, with a quite big imprecision. Looks related to the terrain, it isn’t observed if I remove the terrain provider.

- Styling: if I uncomment line 23 (`defaultPoint.point = undefined`), the icon/billboard doesn’t appear. But I see the successful request for the image in the browser devtools.

Am I missing something? It seems to me I’m doing as explained in the doc[2]

Thanks for any inputs on this (-:

1 - http://jsfiddle.net/tvDN3/3/
2 - http://cesiumjs.org/Cesium/Build/Documentation/GeoJsonDataSource.html?classFilter=geojs&show=all

2

The first problem is due to Cesium rendering object at an height given by the WSG84 ellipsoid (please correct me if I'm mistaken). You can easily solve it in two ways:

1) Workaround/hacky: add a new value into the "coordinates" field in the geoJSON (see: http://jsfiddle.net/YLa4q/1/). This is not valid geoJSON I think, but tricks Cesium in rendering the points ABOVE the terrain. As you can see in the new JSFiddle, one point is rendered correctly while the others still "slide" (they are on the mountains so height needs to be higher)

2) Less hacky: add an observer that computes the height of an object by calling SampleTErrain whenever a new object is added to the dynamic object collection of the geojsonprovider.

3) *meh* way: modify the geojson terrain provider to automatically do the 2nd point.

As for your second issue, I have no clue sorry :slight_smile:

3

Thanks a lot for the hints, I’m gonna try this.

The first problem is due to Cesium rendering object at an height given by the WSG84 ellipsoid (please correct me if I'm mistaken). You can easily solve it in two ways:

1) Workaround/hacky: add a new value into the "coordinates" field in the geoJSON (see: Edit fiddle - JSFiddle - Code Playground). This is not valid geoJSON I think, but tricks Cesium in rendering the points ABOVE the terrain. As you can see in the new JSFiddle, one point is rendered correctly while the others still "slide" (they are on the mountains so height needs to be higher)

2) Less hacky: add an observer that computes the height of an object by calling SampleTErrain whenever a new object is added to the dynamic object collection of the geojsonprovider.

3) *meh* way: modify the geojson terrain provider to automatically do the 2nd point.

Looks to me that it should be the default when the data only contains X/Y. I may be wrong…

4

Works great when the elevation is set, thanks.

Anyone got an idea for the icon not showing up ? (-:

Thanks in advance.

5

Weird, I’m experiencing the same issue. It seems that the problem just happens with billboards in the geojson data source (using CZML or manually adding billboards work just fine).

I’m trying to figure out what’s wrong but, at the moment, I don’t have any clue. Anybody else can help?

6

I looked into it, and confirmed this is a bug in Cesium. GeoJsonDataSource assumes it only needs to update the display once, but because the billboard image is loaded asynchronously, it’s not full loaded. I opened https://github.com/AnalyticalGraphicsInc/cesium/issues/1603 to track it.

7

I’ve known about this for a while but kept forgetting to submit an issue, it shouldn’t be hard to fix.

For now you can work around it in your own code by adding the following snippet somewhere in your app before you using GeoJSON. (it only needs to be done once). If you are using requireJS, don’t forget to remove the Cesium prefix.

Cesium.GeoJsonDataSource.prototype.getIsTimeVarying = function() {

return true;

};

8

Thank you guys for looking into this issue :slight_smile:

9

Thanks a lot guys for digging into this. I’ll follow the issue.
In the meanwhile, the workaround works fine.

Thanks everyone!