02.cesium中模型和图标加载处理

最新推荐文章于 2025-10-22 18:37:19 发布

原创

最新推荐文章于 2025-10-22 18:37:19 发布 · 787 阅读

7 ·

CC 4.0 BY-SA版权

文章标签：

#前端 #cesium

文章介绍了如何在2D和3D地图中根据模型动态加载图标点，涉及高度计算、BillboardCollection的使用以及如何通过异步优化`runTask`方法处理大量数据。重点是`getPointPosition`方法，它利用`sampleHeight`获取图标在模型表面的高度。

展示效果，我们期待图标点是根据模型，在模型的上方展示在这里插入图片描述
实现思路：
1.在二维地图和三维地图的加载的高度计算不同，需要判断
2.创建一个BillboardCollection，用来存放图标
3.在三维地图中调用getPointPostion方法，来计算图标的高度

 addBillboardsPrimitivesPlush(list, dataType) {
   
   
   		
      let keyIs2D = "2D";
      if (this.curKey == "2D" || (this.curKey.key && this.curKey.key == "2D")) {
   
   
        keyIs2D = "2D";
      } else {
   
   
        keyIs2D = "3D";
      }
      // item = JSON.parse(JSON.stringify(item)); // 数据隔离
      if (list.length === 0) {
   
   
        return;
      }
      billboards[dataType] = null;
      if (billboards[dataType] == null) {
   
   
        billboards[dataType] = this.cesium_viewer.scene.primitives.add(
          new Cesium.BillboardCollection(),
          10
        );
      }
      list.forEach((item) => {
   
   
        // item.attrs.moid = item.moid;
        if (item.geometry && item.geometry.coordinates) {
   
   
          billboards[dataType].add({
   
   
            id: {
   
    b