cesium自定义st

发布时间 2024-01-02 09:16:11作者: zhh
/**
 * Crate wall geometry
 *
 * @param {Cartesian3[]} positions
 * @param {number} height
 * @returns {Geometry}
 */
function createWallGeometry(positions, height) {
  const indices = []
  const distances = [0]
  const times = (positions.length - 1) * 2
  let perimeter = 0
  for (let i = 0; i < times; i++) {
    // Indices
    if (i % 2) {
      indices.push(i + 2, i - 1, i + 1)
    } else {
      indices.push(i + 1, i, i + 3)
    }

    // Calculate distances
    if (positions[i + 1]) {
      const distance = Cartesian3.distance(positions[i], positions[i + 1])
      distances.push(distance)
      perimeter += distance
    }
  }

  let percent = 0
  const st = []
  const wallPositions = []
  for (let i = 0; i < positions.length; i++) {
    // St
    percent += distances[i] / perimeter
    if (i === positions.length - 1) percent = 1
    st.push(percent, 0, percent, 1)

    // Positions
    const position = positions[i]
    const bottomPoint = setHeight(position, 0)
    const topPoint = setHeight(position, height)
    wallPositions.push(
      bottomPoint.x,
      bottomPoint.y,
      bottomPoint.z,
      topPoint.x,
      topPoint.y,
      topPoint.z
    )
  }

  return new Geometry({
    attributes: {
      position: new GeometryAttribute({
        componentDatatype: ComponentDatatype.DOUBLE,
        componentsPerAttribute: 3,
        values: wallPositions,
      }),
      st: new GeometryAttribute({
        componentDatatype: ComponentDatatype.FLOAT,
        componentsPerAttribute: 2,
        values: new Float64Array(st),
      }),
    },
    indices: new Uint16Array(indices),
    primitiveType: PrimitiveType.TRIANGLES,
    boundingSphere: BoundingSphere.fromVertices(wallPositions),
  })
}

/**
 * Set height to position
 *
 * @param {Cartesian3} cartesian
 * @param {number} height
 * @returns
 */
export function setHeight(cartesian, height) {
  const cartographic = Cartographic.fromCartesian(cartesian)
  cartographic.height = height
  return Cartographic.toCartesian(cartographic)
}

  

https://community.cesium.com/t/the-imagematerialproperty-of-wallgraphics-may-incorrectly-render-and-display/16928