With the 1.50 release, CesiumJS now supports the new specular glossiness glTF extension. This extension gives you greater control over how a 3D model responds to various realistic lighting conditions.
Materials on this model are powered by the new specular-glosssiness extension. Racing bicycle by Francesco Coldesina.
glTF’s physically based rendering (PBR) material models define how a surface responds to light, e.g., how reflective or dull it is. As opposed to glTF’s built-in metallic-roughness model, the specular-glossiness extension can represent a broader range of materials by exposing more parameters, such as the specular color.
For example, by setting the specular color of this bike to a slightly reddish tint, we can simulate the soft glow of sunset.
Bike model with a metallic-roughness material vs. specular-glossiness.
Since we only changed the specular color of our bike’s material, only the shiny and reflective surfaces, such as the rims and the spokes, are affected by the red tint; the frame of the bike is unaffected. This is the kind of fine-grained control that is easier to achieve with specular glossiness.
Another benefit of supporting this extension is that it makes CesiumJS compatible with a lot more models. For example, a lot of assets on Sketchfab use this PBR workflow.
If I were working on a proposal to add some solar panels to our headquarters, I could visualize it by grabbing a high quality solar panel model from Sketchfab and placing it on top of a photogrammetry model of our building in CesiumJS.
Solar panel model by Joel on Sketchfab displayed on top of a photogrammetry model in CesiumJS.
That way I can quickly experiment with different placements and easily share my results on the web.
Try this out in CesiumJS either by grabbing a model from Sketchfab or converting your OBJ files to glTF with obj2gltf.
I’d love to see how you use this in your projects! You can reach me on Twitter @Omar4ur.