Cesium 1.107+ 自定义类支持 readyPromise

由于cesium 1.107+ 的图元(Primitive) 已经不支持 readyPromise。

但是个人感觉比较好用,于是用了一个插件来实现。

用法:

js 复制代码
// 定义图元并添加,和之前一样
const boxGreen = new BoxPrimitive({
  color: "#ff0000"
})
viewer.scene.primitives.add(boxGreen.primitive)

// 这个是新增的,创建一个 readyPromise 辅助器
const readyHelper = new ReadyPromiseHelper(viewer)
readyHelper.readyPromise(boxGreen.primitive).then(() => {
  console.log("primitive is ready");
})

ReadyPromiseHelper 实现

js 复制代码
export class ReadyPromiseHelper {
  constructor(viewer) {
    this.viewer = viewer;

    this._primitives = new Map();

    viewer.scene.postRender.addEventListener(() => {
      const needDelete = []
      this._primitives.forEach((readyCallback, primitive) => {
        if (primitive.ready) {
          readyCallback()
          needDelete.push(primitive)
        }
      })

      needDelete.forEach(primitive => {
        this._primitives.delete(primitive)
      })
    })
  }

  readyPromise(primitive) {
    let readyCallback;

    const promise = new Promise((resolve, reject) => {
      readyCallback = resolve;
    });
    this._primitives.set(primitive, readyCallback)
    return promise;
  }
}
相关推荐
无聊的老谢1 分钟前
Vue 3 + Leaflet 实现高性能 Web GIS 基站监控平台
前端·javascript·vue.js
之歆3 分钟前
Day23_Bootstrap 前端框架完全指南:从栅格系统到组件化开发
开发语言·前端·javascript·前端框架·bootstrap·ecmascript·less
前端 贾公子3 分钟前
3.响应式系统基础:从发布订阅模式的角度理解 Vue2 的数据响应式原理(上)
前端·javascript·vue.js
2501_940041746 分钟前
纯前端高阶实战:涵盖3D、音频可视化与复杂交互的开发命题
前端
AIFQuant7 分钟前
外汇交易平台技术栈深度解析:行情 API、清算、风控、前端一体化方案
前端·python·websocket·金融·restful
NiceCloud喜云8 小时前
Opus 4.8 的 Effort Control 怎么选:Low 到 Max 五档策略
android·java·大数据·前端·c++·python·spring
wordbaby9 小时前
React Native + RNOH:跨页面数据回传的最佳实践与避坑指南
前端·react native
GISer_Jing9 小时前
Three.js着色器编译机制深度解析
javascript·webgl·着色器
丷丩9 小时前
MapLibre GL JS第22课:查看本地GeoJSON
前端·javascript·map·mapbox·maplibre gl js
AI玫瑰助手9 小时前
Python函数:默认参数的定义与注意事项
开发语言·python·信息可视化