Material class throws an error in the example provided in the documentation

CesiumJS
1

Here is the code of a example in the document.

polygon.material = new Cesium.Material({
  fabric: {
    type: 'Color',
    uniforms: {
      color: new Cesium.Color(1.0, 1.0, 0.0, 1.0)
    }
  }
});

And here is a mini repo:

  const viewer = new Cesium.Viewer(container)

  const entity = viewer.entities.add({
    polygon: {
      hierarchy: Cesium.Cartesian3.fromDegreesArray([
        -108.0, 42.0, -100.0, 42.0, -104.0, 40.0
      ]),
      material: new Cesium.Material({
        fabric: {
          type: 'Color',
          uniforms: {
            color: new Cesium.Color(1.0, 0.0, 0.0, 0.5)
          }
        }
      })
    }
  })

In cesium version 1.112.0, it throw error "Unable to infer material type: [object Object]"

2

This error is thrown due to the difference between the ‘Entity API’ and the ‘Primitive API’.

The details are subtle (and I’ll frankly admit that I wouldn’t claim to have a perfectly clear picture here either), but the key differences are explained at the beginning of Creating Entities – Cesium

As an attempt to boil it down to the most relevant part:

You are trying to create an Entity. And when you want to create an Entity, then the material that you are passing in there, via the material property, may not be a Cesium.Material. It has to be a Cesium.MaterialProperty.

So if you want to assign a simple color material (property) to that entity, then the code would be

const viewer = new Cesium.Viewer("cesiumContainer");

const entity = viewer.entities.add({
  polygon: {
    hierarchy: Cesium.Cartesian3.fromDegreesArray([
      -108.0, 42.0, -100.0, 42.0, -104.0, 40.0
    ]),
    material: new Cesium.ColorMaterialProperty(
      new Cesium.Color(1.0, 0.0, 0.0, 0.5)
    )
  }
});
3

That was a misunderstanding…Document said polygon.material = new Cesium.Material so I thought the polygon here means Entity.polygon.:persevere: