status on supporting 3D Tiles transparency?

1. A concise explanation of the problem you’re experiencing.

Setting transparency/opacity doesn’t seem to be currently supported?

Hoping to confirm, and if there is any known workaround?

I found this as a lodged feature request, but it seems to have been closed without being resolved:

https://github.com/AnalyticalGraphicsInc/cesium/issues/5899

I would expect this to be a more common request, is it on the current roadmap?

2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

In our viewing tool, we want to be able to show our 3D tiled drone data over the top of the base imagery, with a slider to control its transparency so you can see features/alignment with underlying imagery or other 3D tile datasets.

4. The Cesium version you’re using, your operating system and browser.

v1.50, Chrome windows+osx

Thanks all.

Hey Andrew,

You should be able to do this with the styling language. For example, to set a tileset to 0.5 alpha you could do:

tileset.style = new Cesium.Cesium3DTileStyle({
color: ‘rgba(255, 255, 255, 0.5)’
});

``

Here’s a Sandcastle example with a slider for controlling the transparency. The only thing I’m noticing though is that going from transparency 1 to less than 1 is kind of a big jump.

Does this work for you?

hello,

I also having the same issue.

Is this 3Dtile style going to work for any 3DTile datasets.

For example is it going work for the following photogrammetry data:

https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/?src=3D%20Tiles%20Photogrammetry.html&label=3D%20Tiles

Unfortunately it seems not to be working with photogrammetry 3D tilesets at the moment.

I took Omar’s example and swapped in the sample photogrammetry dataset, the transparency has no effect.

Sandcastle example (change “photogrammetry = true” and re-run to see)

AC.

Ah, thanks for the Sandcastle Andrew.

It looks like this is because the styling only applies to features, and this tileset has none. I opened a feature request since we would like to support this, as well as a work-around that Sean mentioned:

I’m not sure when this would ship, but contributions are always welcome! Feel free to chime in on GitHub as well.

Hi Andrew,

In the meantime, for this particular use case I wonder if ClassificationPrimitives might be helpful.
See here: https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/?src=Classification.html

Hi Gary,

Thanks for the suggestion.

I did try using the classification primitives for transparency, but no luck as the alpha in the provided colour (e.g. rgb(255,255,255, 0.5)) affects the colourisation of the features rather than the features themselves, i.e. if it is 100% transparent then it is the classification which becomes transparent rather than the 3D tile data.

Unless I’m missing something?

AC.

Hi Andrew,

Cesium also allow "invert classification," which styles everything that isn't inside the volume to be a certain color or opacity. I forgot that it's a scene-level property though, so for your use case it could be cumbersome to use - you may have to move or show/hide classification volumes depending on what should be transparent vs. opaque. Totally understandable if you would rather wait on (or implement?) support for styling on feature-less tilesets.

For curiousity, I put together a quick example of invert classification here on Sandcastle: https://cesiumjs.org/Cesium/Build/Apps/Sandcastle/#c=fVTvb9owEP1XLL6QSMihYt2qlqIxoBNSqyLIun2IhExytNYcX2Q7oXTq/z4nIeTH1OWDwXfv3bt3sZMxRTIOB1Dklkg4kBlonsb0qYg5/bDYzlAaxiWo/oD8CSSxjwGlbGilMOMRqOuKGCpgBn6iEpFfQhw3kO/uTSADmVk1HYIEK1aq0mJ7ThouQINp91L+jOZ+mXROHaRKnFWXKNegMVUh0L3CeKotcBk5n4dfPtXyhRZNFI+54RloyqLIOUnmiFNLb4ixj81EID2PRCj7hoRMAWE7TA0RGDLDUQ4ISnEkqYaI7FERLjNQFimY1nzPS9AH6k2bLfyqwlV2nwFjMOq4lNowad8LuW4O6XsnXdGaVHKe1zd8rQjFvOY8BqmtrG7y8ie3Aq93qGJmav4KVCU0Q4FqmiTAVL6lT4u1v/i1vXtcP0z9QbtYdJZpNz9jVkRzJkfOFR0OyGW+2H9uTX93G7WYMYrvUlMModNwmPdTd1q01x3OtOIX5gtI600UgYu8iWFjuXTdjh/9goe2k42NfKjmGJVC01OjHI9soX6GIo2hX4bPltsnyT8m0PD3T47OFpvlj4ftaL71l/eL/PQ3j395Ots0e9/y1m7+hymG0rmY9ZzqJZ+TLdQb9MbaHAVMSg9feZygvRX21jqUegbiRNgPhfZ2afgbDA21zmljryKNI57ZqdwGvc43KOiVA7GZfSrEhr9B0JuMPYtv0QSyiMvnR2tFsGMOebmY3JdBSunYs9uK9Rc

This issue has just been fixed and should be available in the next release of Cesium on December 3rd! See the PR here:

Great news!
Thanks to everyone involved.