Homepage

Appearance

概述 ​

Cesium 提供的样式规则系统，可对 3D Tiles 进行： 按属性着色， 显示隐藏元素等控制。

javascript
const osmBuildingsTileset = await Cesium.createOsmBuildingsAsync()
viewer.scene.primitives.add(osmBuildingsTileset)

osmBuildingsTileset.style = new Cesium.Cesium3DTileStyle({
  color: {
    conditions: [
      ["${feature['name']} === '兰生大厦'", "color('red')"],
      ["true", "color('white')"],
    ],
  },
  show: "${feature['building']} === 'apartments'"
})

viewer.camera.lookAt(
  Cesium.Cartesian3.fromDegrees(121.47, 31.23, 0),
  new Cesium.HeadingPitchRange(
    Cesium.Math.toRadians(0),
    Cesium.Math.toRadians(-45),
    10000
  )
)
javascript
osmBuildingsTileset.style = new Cesium.Cesium3DTileStyle({
  color: {
    conditions: [
      ["${distanceFromComplex} > 0.010", "color('green')"],
      ["${distanceFromComplex} > 0.006", "color('blue')"],
      ["${distanceFromComplex} > 0.002", "color('yellow')"],
      ["${distanceFromComplex} > 0.0001", "color('red')"],
    ]
  },
  // defines用于创建变量，vec2用于二维向量
  // distance为内置函数：https://github.com/CesiumGS/3d-tiles/tree/main/specification/Styling#built-in-functions
  defines: {
    distanceFromComplex:
      "distance(vec2(${feature['cesium#longitude']}, ${feature['cesium#latitude']}), vec2(121.47, 31.23))",
  },
})
/次