mockjs 导致cesium地图无法加载

已于 2024-01-26 13:38:08 修改
阅读量419 收藏
点赞数
分类专栏： Cesium 文章标签： 前端 javascript 数据库
于 2023-12-12 14:17:35 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37312180/article/details/134948085
版权
在使用MockJS时遇到Cesium地图无法加载的问题，报错信息指向数据格式错误。深入分析发现，MockJS替代了xhr请求，对二进制流处理不当。解决方案包括禁用MockJS或修改其源码，通过阻止对特定路由的处理来避免影响Cesium地图的请求。通过修改Mock.js源码中相关行数，解决了问题。
摘要由CSDN通过智能技术生成

 1.报错信息

Uncaught (in promise) TypeError: Failed to execute 'createImageBitmap' on 'Window': The provided value is not of type '(Blob or HTMLCanvasElement or HTMLImageElement or HTMLVideoElement or ImageBitmap or ImageData or OffscreenCanvas or SVGImageElement or VideoFrame)'.

3.问题分析 

搜索一番，没有发现类似问题 开始以为是cesium的key有问题，更换key，更换成高德的图层都无效 于是仔细研究报错信息，发现它说的是提供的数据格式不对，开F12查看请求数据

了解本专栏 订阅专栏 解锁全文 超级会员免费看
vitenode
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
订阅专栏
Vue3+Cesium，解决无法加载底图
weixin_54937289的博客
11-26 1025
通过报错提示，安装了以下js库在配置文件vue.config.js里修改，代码如下resolve: {},},},});
vue+cesium离线地图关网报错不加载底图：https://api.cesium.com/v1/assets/2/endpoint?access_token=eyJhbGciOiJIUzI1
阿小绿的博客
03-12 6638
简单来说，我关网了，然后地图不出来了，理应来说应该是出来才对，毕竟离线地图，但是我发现有个东西一直在被加载。就它一个报错，导致我关网地图不出来。 原因：我们的cesium.js文件里面请求了这些东西（我是这么猜想的，也许不是，知道的请指教）。解决办法，我就是换了一下我的cesium文件。下图是我报错之前的cesium.js。 换了以后就成功了。如下图，就检测不到了。然后关网成功显示，并且也不请求那个链接了。 希望能帮助到你。 ...
CESIUM加载地图，不报错，但是加载不出来
m0_37189977的博客
07-21 2583
## CESIUM加载地图，不报错，但是加载不出来 我这儿的问题是初始化Cesium.viewer时的options中未指定imageryProvider
mockjs导致cesium地图加载出错
Hello的World
05-11 291
按照文章的方法修改mock.js的源码。地球底图成功显示出来，但是这个方法不好，其他同事还得修改源码，重写mock的send方法,其实最主要的是修改。于是仔细研究报错信息，发现它说的是提供的数据格式不对，开。面向搜索引擎一番，没有发现类似问题，然后换原生。加载试试，得到的是一个没有底图的球。查看请求数据，好像也没啥异常。,因为这mock源代码中,最后小破球就成功显示出来了。出现地图加载出错的问题。偶然见看见掘金一篇文章。在vue中使用超图的。
cesium加载百度地图
05-20
cesium加载百度地图方法
Cesium地形没加载出来？-可能是你相机视角选错了；Cesium 加载地形数据
qq290048663
07-06 1083
point，polygon，polyline，Cesium基础教程003-添加高德地图，魔卡托投影 mercator。point，polygon，polyline，Cesium基础教程003-添加高德地图，魔卡托投影 mercator。那么，你的地形数据，可能是由于你不知道人家是让什么地形起伏了，导致你的相机视角不知道调整到什么经纬度position，你该观察建筑物还是山。我这里是后来意识到，人家给了测试的地形数据坐标，那我直接相机设置即可。比如这里的：URL配置，姑且认为大家都是配置正确的；
Cesium地图不加载或者加载有问题怎么办
阿小绿的博客
02-26 7218
如上图所示，没有显示地球。 主要原因是因为 地球影像图层出错了是必然了，我们人眼都可以看出来。解决办法去创建一个属于自己的token，放到项目里面去 影像图层错了，cesium ion token过期啦 注册秘钥https://cesium.com/ion/signin 点击箭头所指方向进行注册账户，如果有账户直接登录就好了。 登录进来【Access Tokens】下面的默认秘钥，拿到我们需要的页面 Cesium.Ion.defaultAccessToken = '你的秘钥' 然后重新清除浏览.
解决Cesium无法加载出地球的问题
热门推荐
syzdev的博客
08-10 1万+
如图只看得到星空，看不到地球：界面下方的文本： This application is using Cesium’s default ion access token. Please assign Cesium.Ion.defaultAccessToken with an access token from your ion account before making any Cesium API calls. You can sign up for a free ion account at https
项目中使用高德地图, 地图加载不出来,只有高德Logo
a42558444的博客
03-03 1786
项目是vue2的，我把相同的代码复制到另外一个项目中，发现可以正常显示。 如果出现类似情况，请检查你是否使用了mockjs，我吧mockjs关闭后地图就正常加载了, 如果出现地图不能加载控制台报错, Invalid Object: LngLat(NaN, NaN), 很有可能是你的地图容器也就是container的DIV没有设置宽高, 以上是我遇到的问题, 希望可以帮到你
Cesium支持加载百度地图源码可直接使用
04-13
很多小伙伴想要在Cesium里增加百度地图，现在源代码整理好了，需要的可以下载了，具体有什么问题可以私信我
Cesium加载大地图案例
07-21
【Cesium加载大地图案例】是一个使用Cesium for Unity技术实现的项目，旨在展示如何在Unity引擎中有效地加载和管理大规模的地理空间数据。Cesium是一个强大的开源库，专为构建三维地球应用而设计，它提供了高精度的...
43.（cesium篇）cesium加载gif图片.zip
06-09
该资源包的执行效果查看地址：https://blog.csdn.net/m0_60387551/article/details/123184049 “地图之家”专栏中的“43.（cesium篇）cesium加载gif图片”。如下载有问题，可联系博主。 解压密码：cesium
slider.rar cesium加载天地图实现地图卷帘
07-21
在这个主题中，我们将深入探讨如何利用Cesium加载天地图，并实现地图卷帘功能。 首先，我们要明白“天地图”是中国的一个国家级地理信息公共服务平台，它提供了丰富的地图服务，包括基础地图、地形数据、卫星影像等...
cesium 实体无法拾取
qq_39330397的博客
10-26 627
因为viewer.scene.pick()只能获取一个对象，并且是最顶部的对象。暂时不清楚这样的渲染原理，如果不给实体高度,渲染感觉就会糊在一起。解释下为什么给填充色透明度为0：如果你不设置填充色或者直接用polyline实体，这样你是无法实现点击范围面的效果，只能点击边界线，很显然，对用户不友好。如下图，功能要求展示范围边界，以及楼栋拉高实体，并且范围和楼栋都可以点击。在确实方法没问题后，我们说一下特定场景拾取不到entity的问题。以上加载完后，发现无论怎么点击，获取到的都是边界实体。
使用mockjs的时候，拦截了地图的资源请求怎么办
qq_65949679的博客
02-27 427
查了一下mock.js的工作原理，它直接替换了xhr请求，改成了自己的实现，如果路由没有匹配到，就进行跳转。解决方案有两个，一个是去掉mock.js二是修改mock.js的源码。在使用地图组件的时候，因为数据都是自己写的，所以我选择了mockjs来实现虚拟数据，但是在渲染的时候，地图的资源居然不显示了，一开始我以为是key出现了问题，但是更改玩key还是不显示，这到底是怎么回事呢？如果有更好的办法，欢迎各位小伙伴来评批指正~修改前：//大概在8360行。然后重启项目就可以啦！
TypeError: Failed to execute ‘createObjectURL‘ on ‘URL‘: Overload resolution failed
qq_46302247的博客
04-07 1万+
但是也没有出现“TypeError: Failed to execute ‘createObjectURL’ on ‘URL’: Overload resolution failed”报错，而且a.download = '二维码.png’变成了a.download = ‘二维码’，也成功下载了图片。也没有“TypeError: Failed to execute ‘createObjectURL’ on ‘URL’: Overload resolution failed”这个报错了，成功下载了图片。
基于arco框架 cesium开发
王小四的博客
02-11 713
react 基于arco 框架，create-react-app 创建的项目。
加载本地图片报错GET...403 (Forbidden)和Error: Failed to execute ‘drawImage‘ on ‘CanvasRenderingContext2D‘
luwei233的博客
04-06 7035
学习微信游戏开发时，加载本地图片报错，发生两个错误记录如下： 1.GET http://127.0.0.1:57967/res/background.png 403 (Forbidden) 查询了各种资料，没有找到相关文档，后面看了下图片路径 image.src=‘…/res/background.png’，报着试的态度改成 image.src=‘res/background.png’;，结果运行成功，不知道是什么原因，有知道的朋友帮忙指导下，可能是微信开发者工具升级导致的bug？ let image=wx
前端字符串将其分割成长度为 32 的子字符串数组
最新发布
人与人之间最小的差别是智商，最大的差别是坚持。
08-19 359
要实现这个需求，可以编写一个简单的 JavaScript 函数来处理字符串并将其分割成长度为 32 的子字符串数组。将字符串切割后，对list数据进行数据处理。
cesium地图贴图加载过慢
06-07
Cesium地图贴图加载过慢的原因可能有很多，以下是一些常见的解决方法： 1.使用合适的影像服务：Cesium支持多种影像服务，例如ArcGIS、Bing Maps、Google Maps等。如果贴图加载速度过慢，可以尝试更换影像服务，例如使用Bing Maps可以提高加载速度。 2.选择合适的地图图层：Cesium提供了多种地图图层，例如卫星图、街道图等。不同的图层加载速度也不同，可以根据具体情况选择合适的地图图层。 3.调整地图显示范围：地图显示范围越大，需要加载的贴图就越多，加载速度也就越慢。可以通过调整地图显示范围来减少需要加载的贴图数量，从而提高加载速度。 4.使用WebGL：Cesium使用WebGL来渲染地图，如果浏览器不支持WebGL，地图加载速度就会变慢。可以在浏览器中开启WebGL支持，从而提高地图加载速度。 5.使用CDN加速：可以将地图贴图放在CDN上，通过CDN来加速地图加载速度。 6.使用缓存：可以通过浏览器缓存来加速地图加载速度，减少重复加载。 希望以上方法可以帮助到您解决Cesium地图贴图加载过慢的问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

vitenode

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

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

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

打赏作者

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

抵扣说明：

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

余额充值