Cesium 问题：Resource.js:2041 Uncaught (in promise) TypeError: Failed to execute ‘createImag

最新推荐文章于 2024-08-21 14:09:37 发布
最新推荐文章于 2024-08-21 14:09:37 发布
阅读量77 收藏
点赞数 3
分类专栏： Cesium 文章标签： javascript 开发语言 ecmascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_53810245/article/details/141364281
版权
Cesium 专栏收录该内容
98 篇文章 53 订阅 ¥59.90 ¥99.00
订阅专栏

文章目录

问题

在这里插入图片描述
而且地图也没出来
在这里插入图片描述

分析

控制台报错，球体未加载出瓦片数据，但是请求是发送到的并且有瓦片数据的返回

在这里插入图片描述

上网搜寻解决方案时是这么解释的：mockjs原生代码影响了cesium加载地图，导致页面只出现蓝色球，而无具体瓦片数据
如果还是没有理解，看下边这两张图

  • 正常的瓦片数据请求
    在这里插入图片描述
  • 当前的瓦片数据请求
    在这里插入图片描述

它说的是提供的数据格式不对，开F12查看请求数据，是由mock.js发起的请求

解决

了解本专栏 订阅专栏 解锁全文
博客zhu虎康
关注
  • 3
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
订阅专栏
mockjs 导致cesium地图无法加载
qq_37312180的博客
12-12 419
发现请求数据http状态是304，而且是由mock.js发起的请求。
Uncaught NetworkError: Failed to execute ‘importScripts‘ on ‘WorkerGlobalScope‘: The script at xxxx
宏斌的博客
09-04 3170
从creata-ract-app迁移到了next.js莫名奇妙解决了 可能是打包的工作不同 CRA的 webpack在开发阶段时可以正常的. next似乎使用了 SWC 来处理。three.js开发中 使用web worker 引入外部对象和第三方库 开发时没有问题 打包后出现报错导致web worker无法使用。原因 引用了第三方库。
vue编辑表格报错 Failed to execute ‘getComputedStyle‘ on ‘Window‘: parameter 1 is not of type ‘Element‘.
X_W123的博客
12-04 7531
vue table报错
Failed to execute 'texImage2D' on 'WebGLRenderingContext': Tainted canvases may not be loaded.
菜鸟karroy
03-13 8826
three.js:27461 DOMException: Failed to execute 'texImage2D' on 'WebGLRenderingContext': Tainted canvases may not be loaded. at THREE.WebGLState.texImage2D (file:///H:/3d_demo/demo6/js/three.js:274...
Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'.
weixin_30325487的博客
07-15 2399
今天复习了一下关于getComputedStyle的用法，遇到了小小的挫折。报错前的代码： <div class="box"> <div id="box1"> <input type="text"> <input type="text"> ...
"Failed to execute 'texImage2D' on 'WebGLRenderingContext': tainted canvases may not be loded."
热门推荐
guoguicheng的博客
04-16 1万+
出现这错误是因为threejs内部没有处理图片跨域问题，设置图片TextureLoader为允许跨域就可以了var loader=new THREE.TextureLoader(); loader.setCrossOrigin( "Anonymous" );
cesium 解决 WebGLRenderingContext 丢失问题
纯爱枫若情的博客
11-29 6210
通常来说，对于大多数使用场景，页面上只需要创建一个 cesium 的 viewer 就够用了。 ​ 但是架不住，某些情况下，会需要多个 viewer 的存在。 ​ 了解 cesium 的童鞋应该知道，一般情况下，一个 viewer 对应着一个 webgl context，如果有多个就会存在多个 WebGLRenderingContext。 ​ 如果还不了解 WebGLRenderingContext 是什么的童鞋，建议去了解学习下 webgl 相关的知识，下面送上学习链接：https://develope
【包教包会】1分钟解决CocosCreator灰屏Failed to execute ‘shaderSource’ on ‘WebGLRenderingContext’
CocosCreator水煮肉片饭的博客
05-02 1598
CocosCreator编辑器灰屏Failed to execute ‘shaderSource’ on ‘WebGLRenderingContext’
Cesium开发
七岁
11-21 1296
Cesium 是在webgl 上做的gis 地图，目前开源； 参考教程： http://cesium.marsgis.cn/docs/go.html?id=12 http://www.cnblogs.com/fuckgiser/p/5633748.html https://www.cnblogs.com/mazhenyu/p/6494748.html 官网教程：https://cesiu...
cesium-cartographic:Cesium.js中用于制图计算的数学助手扩展
05-28
Cesium.js中用于制图计算的数学助手扩展 安装 npm install --save cesium cesium-cartographic 用法 import * as cc from 'cesium-cartographic' import * as Cesium from 'cesium' cc . ...
cesium vue3脚手架：cesium@1.103.0+vue3+view-ui-plus
08-02
项目集成框架：cesium@1.103.0+vue3； 项目采用vite构建，将cesium 1.103.0集成到vue3框架中，实现vue3版本的cesium脚手架, 前端ui采用view-ui-plus@1.3.14版本。 ## 项目安装 ``` 1.进入项目根目录 2.执行依赖安装...
CesiumMeshVisualizer:Cesium + Three.js。 在线实例
05-06
CesiumMeshVisualizer 使您可以在Cesium中使用three.js几何，并使用网格，几何，诸如three.js的材质在Cesium中管理可渲染对象。建造npm install --save-devnpm run build安装npm install cesiummeshvisualizer下载 ...
openlayers : ol.js、ol.css 下载
07-23
OpenLayers 是一个强大的开源JavaScript库，专门用于在Web上创建交互式的地图应用。它支持多种数据源，包括WMS、WMTS、TMS、GeoJSON等，使得开发者能够轻松地将地理信息集成到网页中。`ol.js`是OpenLayers的核心...
vue-cesium:CesiumJS的Vue 3.x组件
04-02
VueCesium-用于GIS的CesiumJS的基于Vue 3.x的组件库。 :flexed_biceps: Vue 3.0合成API :fire: 用TypeScript编写 状态：测试版 该项目仍在大力开发中。 欢迎加入我们，并提出您的第一个请求。 语言能力 文献资料 ...
网上商品订单转手系统bootpf
weixin_43213064的博客
08-18 498
【代码】springboot网上商品订单转手系统bootpf
【js】各类前端输入校验方法
最新发布
galaxyJING的博客
08-21 155
【代码】【js】各类前端输入校验方法。
44 个 React 前端面试问题
广漂程序猿DevinRock
08-14 1154
虚拟 DOM 是 React 中的一个概念，其中创建实际 DOM（文档对象模型）的轻量级虚拟表示并将其存储在内存中。它是一种用于优化 Web 应用程序性能的编程技术。当 React 组件的数据或状态发生更改时，虚拟 DOM 会被更新，而不是直接操作真实 DOM。然后，虚拟 DOM 计算组件的先前状态和更新状态之间的差异，称为“比较”过程。一旦识别出差异，React 就会高效地仅更新真实 DOM 的必要部分以反映更改。这种方法最大限度地减少了实际 DOM 操作的数量，并提高了应用程序的整体性能。
Nuxt3【内置的工具函数】2024最新版
朝阳39的博客
08-20 876
用于在Vue应用程序或API路由中进行HTTP请求，详见。
Failed to load resource: the server responded with a status of 401 () CesiumTerrainProvider.js:151 Uncaught (in promise) RequestErrorEvent
05-31
这个错误通常表示请求高程数据的URL需要验证用户身份，但没有提供有效的验证信息。解决这个问题的方法是提供正确的验证信息，以便服务器可以验证用户身份，并提供高程数据。 如果你使用的是Cesium Ion提供的高程数据服务，可以按照以下步骤提供验证信息： 1. 在Cesium Ion网站上创建一个账户，并登录。 2. 创建一个访问令牌，用于访问高程数据服务。具体步骤如下： a. 在Cesium Ion网站上，进入"Access Tokens"页面。 b. 点击"New Access Token"按钮，创建一个新的访问令牌。 c. 选择"Asset"权限，并在"Asset"下拉菜单中选择你需要访问的高程数据服务。 d. 点击"Create Access Token"按钮，创建访问令牌。 3. 在你的Cesium应用程序中，使用访问令牌作为高程数据服务的验证信息。具体步骤如下： ```javascript var accessToken = 'YOUR_ACCESS_TOKEN_HERE'; var terrainProvider = new Cesium.CesiumTerrainProvider({ url: 'https://assets.cesium.com/1/terrain/world-terrain-quantized-mesh', requestVertexNormals: true, requestWaterMask: true, accessToken: accessToken // 将访问令牌作为验证信息 }); var viewer = new Cesium.Viewer('cesiumContainer', { terrainProvider: terrainProvider }); ``` 在上面的代码中，我们创建了一个访问令牌，并将其作为验证信息传递给了`CesiumTerrainProvider`对象。这样可以确保在请求高程数据时提供了有效的验证信息，避免出现401错误。 你可以将上面的代码添加到你的项目中，替换掉原来的高程数据配置，然后重新运行项目，看看是否成功加载高程数据。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

博客zhu虎康

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值