CesiumGS / CesiumGS/cesium

glTF transparency issue

Open
#12,909 7 comments 0 reactions 0 assignees View on GitHub
category - graphics category - model/gltf theme - visual quality type - bug
Dominant language
JavaScript
Stars
15.7k
Forks
3.9k
Avg merge
4d 6h
Merged PRs (30d)
34

Description

### What happened?

From the forums

> I am seeing transparency issues in the attached model when loaded in CesiumJS. The same model appears fine elsewhere , for ex. in gltf.report.. This is basically a parallax cube I will be using in my CesiumJS project. There are 3 planes with alpha mask inside the model, which has images as a texture. The plane for the curtain is correct since it is translucent, but for the planes which contain furniture images, it is not. However, in CesiumJS, they appear translucent as you can see in the attached screenshot as well. Is this a limitation or a bug in CesiumJS? Is there a way to solve this?

Link: https://community.cesium.com/t/gltf-transparency-issue/43269

glb sample data:

[ParallaxRoom.zip](https://github.com/user-attachments/files/22496297/ParallaxRoom.zip)

Sandcastle

http://localhost:8080/Apps/Sandcastle/index.html#c=bVJdb9owFP0rVp4yKXMSoO1GUzSJTtrDpjGY9pSXS2KINX9EtkNhU//7rh1SUlYUId9z7zn3s9LKOnLg7IkZ8kAUeyJLZnkn6a+AxWVUBXuplQOumCmjd/elKlUVmA3j+8YhM8+yEdwZgVgZUZritwHZCvYIDtIVGBACjmutJd2LbRmNWK223HGtkHouYgnG4QvUlO6Mlo9sbxizcakIeZ9PpjS7m81u84+JB2Yzmt1k07vsNph9Zfj05Q7FQs3V/iL/DVxDnV4jDMrG+fTmEtxyVzUYmr0gRgvxCmjaq5l96ROsPHWN0fE5Y9KrJUHikkIbznCqr1v+abCUnTbS0uZK7kcHjhmF4fEwqsQXMV4ICnJ3Qrl+pzTYnFkKdR3/9YNRINncbyiMaRCav7wCPCptPjaCU+qaiTkJagSV+EUOnVxx2ckVPzKx4X8wVT75MPjg6H2bCgTikwx/wfOM/8++i3PRzkD1m9Wfh176pu6jJCqsOwm26OUI+cRlq024txgPzTE8NJyRTbcdCjhaWetlfWiRjqlFzQ+E1w9vnDepBFiLnl0nQgdltChSjP+PKnTYz/cDMwJOPqzJF197kFJapGi+zXRaiy2YK+V/

CesiumJS Screen Capture

https://github.com/user-attachments/assets/3f2cb040-2ef6-4dd2-a769-9e60ba403439

We noted from gltf.report that this glb uses the KHR_materials_specular and KHR_materials_ior extensions. We do not support the KHR_materials_ior, but from putting the glb into https://github.khronos.org/glTF-Sample-Viewer-Release/ and toggling off the extension using the advanced settings, this does not seem to impact what the user sees.

## Resolving

This can be resolved by clarifying this is a current limitation in CesiumJS, as opposed to a bug.

### Reproduction steps

1.
2.
3.
...

### Sandcastle example

_No response_

### Environment

Browser: Chrome 138.0.7204.183 (Official Build) (64-bit)
CesiumJS Version: 1.133
Operating System: Ubuntu 24.04

Contributor guide

Open the contributing guide

Research direction

Start with the linked forum discussion, ParallaxRoom.zip sample, and the supplied Sandcastle example. Compare the model's alpha-mask behavior in CesiumJS with the referenced glTF viewers, then document the confirmed limitation and its scope so users know whether the result is expected.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics
Issue type
Documentation
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.