添加billboard图片和gif标点

1.图片标点

this.viewer.entities.add({
        name: '监测设备',
        position: Cesium.Cartesian3.fromDegrees(lng, lat, 6),
        label: {
          //文字标签
          text: '监测设备',
          font: '14pt monospace',
          style: Cesium.LabelStyle.FILL,
          outlineWidth: 2,
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM, //垂直方向以底部来计算标签的位置
          pixelOffset: new Cesium.Cartesian2(0, -9), //偏移量
        },
        point: {
          color: Cesium.Color.RED, //点位颜色
          pixelSize: 10, //像素点大小
        },
        billboard: {
          //图标
          image: require('../../assets/img/sx.png'),
          width: 78,
          height: 135,
          scale: 0.9,
          pixelOffset: new Cesium.Cartesian2(0, -30),
        },
})

2.gif标点

//html
 <img
      id="pointgif"
      style="position: absolute; width: 5%; height: 10%; z-index: 2"
      src="https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=1057147160,1175866418&fm=26&gp=0.jpg"
    />

//js
    var htmlOverlay = document.getElementById('pointgif')
      var scratch = new Cesium.Cartesian2()
      this.viewer.scene.preRender.addEventListener(() => {
        var position = Cesium.Cartesian3.fromDegrees(
          114.3138316176749,
          30.56647299848209,
          0
        )
        var canvasPosition = this.viewer.scene.cartesianToCanvasCoordinates(
          position,
          scratch
        )
        if (Cesium.defined(canvasPosition)) {
          htmlOverlay.style.top = canvasPosition.y + 'px'
          htmlOverlay.style.left = canvasPosition.x + 'px'
        }
      })

本文地址：https://blog.csdn.net/skr_Rany/article/details/112578402