Cesium:矩形实体上的自定义 material

Cesium: Custom material on a Rectangle Entity

我正在尝试添加一个实体,该实体具有多个不同的属性,例如 material(主要是 alpha)和旋转。 RectangleGraphics 覆盖了旋转,并且在我设置 material 来表示纹理时起作用。

viewer.entities.add({ 
  name: 'Site Layer', 
  rectangle: { 
    coordinates: rectangle, 
    material: 'Image.jpg', 
    rotation: Cesium.Math.toRadians(13)     
  }
});

但是,当我尝试通过使用自定义 Material(使用 https://github.com/AnalyticalGraphicsInc/cesium/issues/2484)实现透明度时,它显示为白色纹理而不是所需的结果......类似于:

material = new Cesium.Material({
    fabric : {
        type : 'Color',
            uniforms : {
                image : 'Image.jpg',
                alpha : 0.5
            }
             components : {
                 diffuse : 'texture2D(image, materialInput.st).rgb',
                 alpha : 'texture2D(image, materialInput.st).a * alpha'
            }
        }
    }
);
viewer.entities.add({ 
  rectangle: { 
    coordinates: rectangle, 
    material: material,
    rotation: Cesium.Math.toRadians(13)     
  }
});

阅读文档,矩形中的 material 似乎是 Cesium.MaterialProperty 而不是 Cesium.Material ...这是否意味着我不能简单地分配 Material 到一个矩形?如果没有,我能否以某种方式将 Material 包装在自定义 Material属性 中以使其工作?

出于好奇,为什么 Material 和 Material属性 之间的功能差异?

p.s。 GroundPrimitive 对我不起作用,因为我需要支持的主要浏览器之一 (Safari) 报告 GroundPrimitives.isSupported = false

也张贴在这里https://groups.google.com/forum/#!topic/cesium-dev/1IPjHD7G_NA

汉娜在论坛上回答了这个问题。我会在下面复制她的回答,但首先我会添加我自己的注释,说明为什么 MaterialPropertyMaterial 不同。

Property 版本,与所有 Cesium Entity Properties 一样,旨在描述当 Cesium 动画时,某些事物的定义如何随时间变化。例如,MaterialProperty 可以在一个时间间隔内表示纯色,而在单独的时间间隔内表示条纹 material。实际的底层 Material 可能会被破坏,并因此在动画期间创建一个替换的。

对于你的情况,如果你真的需要一个定制的 Material,你目前最好的选择是避免实体 API 及其时间动态属性,而只使用图形基元直接用Material class。但正如 Hannah 指出的那样,对于简单的图像 alpha 混合,您不需要它。汉娜写道:


这应该会在即将发布的版本 (1.16) 中得到修复 您可以使用此代码制作半透明图像:

var viewer = new Cesium.Viewer('cesiumContainer');
viewer.entities.add({
    rectangle: {
        coordinates: Cesium.Rectangle.fromDegrees(-125,30,-110,40),
        material: new Cesium.ImageMaterialProperty({
            image: '../images/Cesium_Logo_Color.jpg',
            alpha: 0.5
        }),
    }
});