【Cesium】Cesium图层请求完成的回调

server/2024/9/25 22:31:50/

有一个业务需要用到cesium图层请求完成的回调,翻了好久的文档终于给我找到🌶️。
在这里插入图片描述
Cesium.ImageryProvider类的一个属性readyPromise
效果如下:

Cesium图层请求完成的回调


完整代码如下:

<html lang="en"><head><meta charset="utf-8"><!-- Include the CesiumJS JavaScript and CSS files --><script src="https://cesium.com/downloads/cesiumjs/releases/1.95/Build/Cesium/Cesium.js"></script><link href="https://cesium.com/downloads/cesiumjs/releases/1.95/Build/Cesium/Widgets/widgets.css" rel="stylesheet"><style>.button {width: 80px;height: 30px;background-color: rgba(92, 38, 116, 0.818);cursor: pointer;padding: 10px;color: #fff;text-align: center;line-height: 50px;border-radius: 10px;}</style>
</head><body><div id="cesiumContainer"><span id="addLayer" class="button">添加图层</span><span id="removeLayer" class="button">移除图层</span></div><script type="module">javascript">Cesium.Ion.defaultAccessToken = ';const viewer = new Cesium.Viewer('cesiumContainer', {});viewer.camera.setView({destination: Cesium.Cartesian3.fromDegrees(105, 35, 3456789),orientation: {heading: Cesium.Math.toRadians(360), //方向pitch: Cesium.Math.toRadians(-90), //俯仰角roll: Cesium.Math.toRadians(0),},});let layer = null;// 添加图层(async/await语法糖)async function addLayer() {let url = './assets/lyy.jpg';let rectangleArr = [100.0, 30.0, 110.0, 40.0]const singleTileImageryProvider = new Cesium.SingleTileImageryProvider({url: url,rectangle: new Cesium.Rectangle(...rectangleArr.map(item => Cesium.Math.toRadians(item))),});console.log("开始请求图层");try {// ⭐关键代码⭐const res = await singleTileImageryProvider.readyPromise;if (res) {console.log("图层请求成功");} else {console.log("图层请求失败");}} catch (error) {console.error("图层请求时发生错误:", error);}// 将imageryProvider添加到地图的图层列表中,使得图层可以在地图上显示return viewer.imageryLayers.addImageryProvider(singleTileImageryProvider);}/*// 添加图层(Promise)function addLayer() {return new Promise((resolve, reject) => {let url = './assets/lyy.jpg';let rectangleArr = [100.0, 30.0, 110.0, 40.0];const singleTileImageryProvider = new Cesium.SingleTileImageryProvider({url: url,rectangle: new Cesium.Rectangle(...rectangleArr.map(item => Cesium.Math.toRadians(item))),});console.log("开始请求图层");singleTileImageryProvider.readyPromise.then(res => {if (res) {console.log("图层请求成功");resolve(viewer.imageryLayers.addImageryProvider(singleTileImageryProvider));} else {console.log("图层请求失败");reject(new Error("图层请求失败"));}}).catch(error => {console.error("图层请求时发生错误:", error);reject(error);});});}*/// 移除图层function removeLayer() {viewer.imageryLayers.remove(layer)}// 给按钮添加点击事件document.getElementById("addLayer").onclick = async () => {layer = await addLayer()};document.getElementById("removeLayer").onclick = () => {removeLayer()};</script></div>
</body></html>

http://www.ppmy.cn/server/100715.html

相关文章

整理 酷炫 Flutter 优质 布局、交互 开源App

xtimer-flutter-app Flutter 计时器应用 项目地址&#xff1a;https://github.com/pedromassango/xtimer-flutter-app 项目Demo&#xff1a;https://download.csdn.net/download/qq_36040764/89631382

星露谷模组开发教程#6 烹饪和制造配方

首发于Enaium的个人博客 在上篇文章中我们添加了一个新的食物&#xff0c;但是这个食物并没有配方&#xff0c;所以我们今天来添加一个配方。 烹饪配方 我们在Data/CookingRecipes.json中可以看到所有的食物配方&#xff0c;所以我们需要修改这个配置文件来添加我们的食物配方…

AI 未来发展的核心支柱:钢铁、服务器与能源的新工业革命

人工智能&#xff08;AI&#xff09;正在以前所未有的速度发展&#xff0c;这场技术变革不再仅仅依赖算力、算法和数据&#xff0c;而是逐步走向以钢铁、服务器和能源为核心的新工业革命。在红杉资本美国合伙人大卫卡恩&#xff08;David Cahn&#xff09;的一次访谈中&#xf…

UE网络同步(一) —— 一个项目入门UE网络同步之概念解释

最近在学习UE网络同步&#xff0c;发现了一个非常好的教程&#xff0c;并且附带了项目文件&#xff0c;这里从这个小项目入手&#xff0c;理解UE的网络同步 教程链接&#xff1a;https://www.youtube.com/watch?vJOJP0CvpB8w 项目链接&#xff1a;https://github.com/awforsyt…

并行程序设计基础——并行模式之主从模式

目录 一、矩阵向量乘 二、主进程打印从进程消息 三、小结 上一节内容我们介绍了并行程序设计中的常用模式——对等模式&#xff0c;本节对另一种模式——主从模式进行介绍。 一、矩阵向量乘 首先通过矩阵向量乘CAB的例子来介绍主从模式。 具体实现方法为&#xff1a;主进程…

【逆向日记】1.关于YOLO视觉Ai软件逆向分析

逆向后截图 逆向过程 分析应用类型软件查壳静态、动态基址分析CE内存特征搜索OD锁死特征长度、修改想要内容动态补丁技术 CE基址记录

达梦数据库系列—49.审计功能

目录 1、打开审计 2、审计级别 系统级审计 语句级审计 对象级审计 3、审计文件管理 删除审计文件 查看审计信息 4、审计分析 审计分析工具Analyzer 审计分析工具dmaudtool 1、打开审计 0&#xff1a;关闭审计1&#xff1a;打开普通审计2&#xff1a;打开普通审计和…

PVE 系统下虚拟机数据盘从IDE转换为VIRIO

一、卸载已经挂载的 IDE 数据盘 [rootlocalhost ~]# df -h 文件系统 容量 已用 可用 已用% 挂载点 /dev/mapper/centos-root 29G 897M 29G 4% / devtmpfs 909M 0 909M 0% /dev tmpfs 920M 0 920M 0% /dev/shm tmpfs 920M 8.5M 912M 1% /run tmpfs 920M 0 920M 0% /sys/fs/cgro…