Can I overlay terrain with image, then have slopeRamp material on top of that?

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

**I want to show terrain imagery plus slope map, but I want the slope to show with 100% alpha in highlighted areas, and with 40% alpha in non-highlighted areas. **

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

Not a bug, just a question of how to accomplish my goal. I started with the Sandcastle Globe Materials example, then I added a png mask from my previous Photoshop project. The png here has all the trails in white, and the surrounding area transparent.

layers.addImageryProvider(new Cesium.SingleTileImageryProvider({
url : ‘jacksonholemask.png’,
rectangle : Cesium.Rectangle.fromDegrees(-110.875092, 43.5769444, -110.822037, 43.6129629)


This just overlays the trails in white with 0.5 alpha on top of everything. Ideally I want the white part to mask off the terrain imagery and only show the slope map. I tried adding a GroundPrimitive thinking maybe I could apply a slopeRamp material to that. The primitive drapes onto the elevation nicely, but I haven’t figured out how get the slope map onto it.

// Example 1: Create primitive with a single instance
var rectangleInstance = new Cesium.GeometryInstance({
geometry : new Cesium.RectangleGeometry({
rectangle : Cesium.Rectangle.fromDegrees(-110.875092, 43.5769444, -110.822037, 43.6129629)//,
//material: getSlopeContourMaterial()
id : ‘rectangle’,
attributes : {
color : new Cesium.ColorGeometryInstanceAttribute(0.0, 1.0, 1.0, 0.5)

viewer.scene.primitives.add(new Cesium.GroundPrimitive({
geometryInstances : rectangleInstance


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

Basically think of a ski area where ski trails show a slope map instead of snow, like this section of a map I did with Photoshop. You can see the trail just shows the slope, but the side areas also show trees and non-groomed areas. In this case, once the overlay was finished, I laid it on top of the 3D elevation representation. But with Cesium already having everything I need, I’d rather not have to make my own maps just to overlay on top of Cesium terrain. The terrain imagery and slope are already there, I just need to get the presentation the way I want it.


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

I’m working on Windows 10, Cesium 1.53, and Chrome 71.0.3578.98.