Rendering artifacts for billboards alpha blending

CesiumJS
1

Hi,

I am using billboards to render some basic clouds but run into issues with alpha transparency. Attached, a screenshot to demonstrate the problem.

When several transparent billboards (png with alpha) are stacked, their ordering will sometimes create wrong alpha blending.

Regards,

Xavier.

2

Thanks Xavier. This is a known issue. We have it reported on our GitHub here: https://github.com/AnalyticalGraphicsInc/cesium/issues/2130

Best,

Hannah

3

Hi Xavier,

Thanks again for the report. This should be fixed with #4886, which will be in Cesium 1.30 next Tuesday.

Your screenshot is also pretty cool, we’d love to see the demo if you have a public link.

Thanks,

Patrick

4

Hi Patrick,

I can now follow up you your email as I just publicly released my new version using billboards to render some clouds in Cesium.

You can check it out at http://www.geo-fs.com

note: there is an important performance impact when using blendOption=OPAQUE_AND_TRANSLUCENT

Thank you.

Xavier.

cover-plain.jpg
cover-plain.jpg2048×1187 940 KB

5

Hi Xavier,

Wow, your screenshot looks amazing! We’ll connect offline to showcase your work on the Cesium website.

Are you interested in contributing your cloud implementation back into Cesium so you don’t have to maintain it? Even if you don’t think it is complete (doc, unit tests, etc.), feel free to open a pull request and we’ll help get it merged. For more info, see CONTRIBUTING.md.

As for OPAQUE_AND_TRANSLUCENT performance, it has to render the billboards twice and discard the translucent or opaque fragments depending on the pass. We knew it would be slow, which is why we waited so long to add it! There may be some optimizations for your case, for example, completely opaque billboards could be put into a separate billboard collection.

Finally, when I went to GeoFS - Fly in Your Web Browser, it appeared frozen in both Chrome and Firefox, and I had the following error in the console:

Uncaught ReferenceError: _gat is not defined

at Object.geofs.initViewer (geofs.js?kc=1490879860:130)

at geofs.js?kc=1490879860:144

at dispatch (geofs.js?kc=1490879860:3)

at i (geofs.js?kc=1490879860:3)

Any ideas?

Patrick

6

Hi Patrick,

Looks like you could not load Google analytics at the time you tried - this is weird, I’ll have a look.

GeoFS is already showcased at http://cesiumjs.org/demos/GEFSonline.html :wink:

Thanks,

Xavier.