QWebEngineView加载Cesium报WebGL错

最新推荐文章于 2025-05-30 12:20:02 发布

原创最新推荐文章于 2025-05-30 12:20:02 发布 · 1.6w 阅读

24 ·

CC 4.0 BY-SA版权

文章标签：

#QWebEngineView #Cesium #Qt #WebGIS

Cesium开发专栏收录该内容

2 篇文章

订阅专栏

本文详细介绍了如何解决在使用CesiumWidget时遇到的WebGL初始化失败的问题。通过检查和启用WebGL支持，调整resetnotificationstrategy，并在应用程序中添加Qt::AA_ShareOpenGLContexts属性，最终成功解决了错误并实现了WebGL的正常运行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

具体错误：

js: Error constructing CesiumWidget.

Visit <a href="http://get.webgl.org">http://get.webgl.org</a> to verify that your web browser and hardware support WebGL. Consider trying a different web browser or updating your video drivers. Detailed error information is below:

RuntimeError: The browser supports WebGL, but initialization failed.

解决办法：

首先查看QWebEngineView是否启用了WebGL

m_pEngineView->load(QUrl(QStringLiteral("chrome://gpu/")));

然后查看reset notification strategy

如果是0x8252则支持WebGL，如果是0x0000则不支持WebGL。

我的显示是0x0000，下一步则开启WebGL。

在main函数QApplication或QCoreApplication创建之前添加Qt::AA_ShareOpenGLContexts属性

 QCoreApplication::setAttribute(Qt::AA_ShareOpenGLContexts);
 QApplication a(argc, argv);
 MainWindow w;
......

然后reset notification strategy变为0x8261，说明已经支持WebGL了

再次加载Cesium即可。

m_pEngineView->load(QUrl(QStringLiteral("http://localhost:8082/CesiumEarth/")));

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

wg8826

关注关注

1
点赞
踩
24

收藏

觉得还不错? 一键收藏
10
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

Cesium 实战 - 解决 The browser supports WebGL, but initialization failed 问题

非科班Java出身GISer的博客

05-08

5345

在公司内网服务器部署 cesium 项目的时候，发现提示浏览器不支持 WebGL 错误，经尝试，确认 cesium 1.101.0 以及之前的版本是可以正常显示的。推测原因：由于 cesium 高版本 glsl 语法是 300 版本，但是 window 7 环境下支持的谷歌浏览器版本低，不支持 glsl 高版本语法。因此，是由于 cesium 版本更新引起的，而 cesium 在更新 1.102.0 的时候，webgl 将默认使用 2 版本。

cesium小知识：Primitive与webgl互动示例

大剑师兰特的GIS世界

12-20

1589

在Cesium中，Primitive是一种用于高效渲染大量几何图形的机制。它允许你直接与WebGL进行交互，以实现自定义的渲染逻辑和效果。通过Primitive，你可以创建并管理自己的顶点缓冲区、索引缓冲区、着色器程序等，从而完全控制渲染过程。下面是一个简单的示例，展示了如何使用 Cesium 的Primitive来创建一个基于 WebGL 的立方体，并将其添加到 Cesium 场景中。

10 条评论您还未登录，请先登录后发表或查看评论

离线Cesium客户端

rpgpp55的博客

07-22

3479

平时调试Cesium放入了QT，程序搭建了轻量化的http服务器，使用webviewengine通信使程序与桌面版无异，菜单实现不全后续补充，工具也简单加了osg转3dtiles的功能，tileset.json拖进程序即可显示

如何解决 Cesium 报错：RuntimeError: Fragment shader failed to compile. Compile log: ERROR: 0:163: ‘varying‘

05-30

996

摘要： Cesium 在 WebGL 2 模式下报错 RuntimeError: Fragment shader failed to compile，主要由于 GLSL 300 中废弃了 varying 关键字。解决方案包括：1) 升级 Cesium 至 1.114+（自动修复）；2) 手动替换 varying 为 in/out；3) 临时强制回退 WebGL 1；4) 批量宏替换。建议优先升级 Cesium 版本或修改着色器代码，同时提供调试技巧与不同场景下的最佳实践。

Error constructing CesiumWidget.Visit http://get.webgl.org to verify that your web browser and hard

kouhunzhe的博客

09-01

1万+

vue cli3 引入cesium 报错 Error constructing CesiumWidget. Visit <a href="http://get.webgl.org">http://get.webgl.org</a> to verify that your web browser and hardware support WebGL. Consider trying a different web browser or updating your video d.

简单开启QWebengineView webGL的方法

先森不在忆

11-30

7019

启用webGL作用：让QWebengineView可加载3d模型在开发的程序运行参数中加入 --ignore-gpu-blacklist 即可成功开启。附带测试网站：http://webglreport.com/ //添加exe默认运行参数 std::vector<char*> new_argv(argv, argv + argc); n...

Qt的WebEngineView加载网页时出现Error: WebGL is not supported

joyopirate的博客

10-06

1985

当我在qml中使用WebEngineView加载一个网页时，出现以下错误：其实这个问题在Qt的帮助文档中已经提及了解决办法：因此，可以按照下面的步骤操作一下：在项目的pro文件中，引入模块 2.2.在main.cpp文件 include相应头文件，然后执行手册中提到的三行代码：

检测自己的浏览器是否支持WebGL

手握灵珠常奋笔

04-13

9957

在浏览器地址栏输入 https://get.webgl.org 如果得出下面图形，就说明浏览器是支持WebGLS的，经过尝试，发现Chome浏览器，微软Edge以及搜狗浏览器都能很好的支持WebGL。 ...

小汽车3d模型，有贴图 3dmax2012可以打开，threejs\cesium等webgl可以加载

05-21

总的来说，这个小汽车3D模型结合了3ds Max的专业建模能力，THREE.js和Cesium的WebGL渲染优势，以及OBJ格式的跨平台兼容性，为开发者提供了一套便捷的3D资源，可以在网页应用中轻松创建逼真的汽车展示或互动体验。...

QWebEngineView和Cesium的结合使用

12-29

为了使 `QWebEngineView` 能够加载并展示基于 WebGL 的 Cesium 地图，需先设置好基本的 Qt 应用环境。这涉及到引入必要的库以及初始化应用程序实例。 ```cpp #include #include <QWebEngineView> int main(int ...

43.（cesium篇）cesium加载gif图片.zip

06-09

该资源包的执行效果查看地址：https://blog.youkuaiyun.com/m0_60387551/article/details/123184049 “地图之家”专栏中的“43.（cesium篇）cesium加载gif图片”。如下载有问题，可联系博主。解压密码：cesium

浏览器(以chrome为例)设置对WebGL的支持

欢迎光临Andy511823558的空间

02-16

1万+

浏览器(chrome为例)设置对WebGL的支持某些浏览器由于不支持WebGL渲染，在浏览三维场景服务的时候会报“Your WebGL implementation doesn't seem to support hardware accelerated rendering”错误，解决方法如下：

QtWebEngineView加载本地网页

joyopirate的博客

08-23

863

直接加载放在exe同级目录下的资源是不行的，需要把资源通过qrc放到exe里面，然后通过类似。运行网页中包含的脚本，还可以取得返回值。这样的路径加载才行。

Error constructing CesiumWidget.解决办法（Vue + Cesium）

总柴的博客

05-25

1万+

Vue3 + Typescript + Cesium项目换进搭建 1 安装vue3脚手架 npm i -g @vue/cli 2 创建项目并启动 vue create myapp cd myapp yarn myapp 3 安装cesium yarn add cesium 4 去node_modules中找到cesium/Biuld/Cesium文件夹，复制到public中 5 在index.html中引入本地cesium环境： <link rel=“stylesheet” href="

cesium 报错{"code":"InvalidCredentials","message":"Invalid access token"}

A873054267的博客

10-28

9359

这是因为需要申请token。申请页面为：https://cesium.com/ion/tokens 在初始化viewer之前，将token加入即可 Cesium.Ion.defaultAccessToken='你的token'; var viewer = new Cesium.Viewer('cesiumContainer',{ baseLayerPicker:false, ...

js 判断支持webgl_Three.js检测webgl支持并回退到常规画布

weixin_39866741的博客

12-21

150

Can anyone who has used three.js tell me if its possible to detect webgl support, and, if not present, fallback to a standard Canvas render?解决方案Yes, it's possible. You can use CanvasRenderer instead o...

android webview支持webgl,在Android 5的WebView上支持WebGL

weixin_29001655的博客

05-26

1596

我有一个Web项目(取决于WebGL)，可以在计算机，任何浏览器上工作。现在，我正在尝试将该项目作为基于Android手机的应用程序打开。我使用WebView来完成此任务。我的手机(Nexus3)安装了Android 4.3，随后我了解到，在安装Android 5之前，WebView组件不支持WebGL。在Android5中，WebView成为依赖Chromium 37版(可以更新)的可更新独立组...

WebGL可视化地球和地图引擎：Cesium.js

热门推荐

GIS笔记

07-23

3万+

Cesium介绍Cesium是国外一个基于JavaScript编写的使用WebGL的地图引擎。Cesium支持3D,2D,2.5D形式的地图展示，可以自行绘制图形，高亮区域，并提供良好的触摸支持，且支持绝大多数的浏览器和mobile。无需任何插件。Cesium 使用 WebGL 来进行硬件加速图形化；跨平台；跨浏览器；实现真正的动态数据进行可视化。Cesium 基于 Apache 开源协议，支持

QT cesium

03-29

<think>好的，我现在需要帮助用户解决如何在QT中集成或使用Cesium的问题。首先，我得回忆一下QT和Cesium的基本情况。QT是一个跨平台的C++应用程序框架，常用于开发GUI程序，而Cesium是一个基于WebGL的地理空间可视化库，主要用于3D地球和地图的展示。用户的需求是将两者结合起来，这在技术上可能涉及到将Web内容嵌入到QT应用中。首先，我想到QT提供了QWebEngineView组件，可以用来嵌入Web页面。Cesium本身是运行在浏览器中的JavaScript库，所以一个可能的方案是在QT应用中创建一个Web视图，然后加载Cesium的网页。这应该是比较直接的集成方式。需要检查用户是否了解如何在QT中使用Web视图，可能需要指导他们配置WebEngine模块。接下来，用户可能需要具体的步骤，比如创建一个基本的QT项目，添加Web视图组件，然后加载本地的Cesium页面或者在线示例。这时候需要确保QT项目正确配置了WebEngine的支持，可能需要在项目文件（.pro）中添加相应的模块引用。另外，Cesium的资源路径设置可能需要注意。比如在引用[1]中提到，设置window.CESIUM_BASE_URL来指定资源目录，这可能同样适用于QT中的集成，确保资源文件正确加载，避免出现404错误。可能需要指导用户如何将Cesium的Build文件复制到项目资源目录，并在HTML中正确引用。还有一种情况是，用户可能需要更复杂的交互，比如QT应用与Cesium的JavaScript代码之间的通信。这时候可能需要使用QWebChannel来实现双向通信，允许C++代码调用JavaScript函数，反之亦然。这可能涉及到在Web页面中注入通信桥接的代码，并在QT中设置相应的通道。还需要考虑跨平台的问题，比如在Windows、Linux或macOS上部署时，确保WebEngine模块正常工作，并且资源路径正确。此外，性能优化也是一个方面，特别是当Cesium加载大量数据时，需要确保QT应用的响应性。最后，根据引用[3]中的电子栅栏例子，用户可能有兴趣在集成后的应用中实现类似的高级功能，可能需要指导他们如何在QT中处理Cesium的事件，比如对象进入区域触发QT端的响应。这可能涉及到监听Cesium的事件并通过WebChannel传递到QT应用。总结可能的步骤：使用QWebEngineView加载Cesium网页、配置Cesium资源路径、处理QT与JavaScript的通信、部署和优化。需要将这些步骤详细分解，并给出示例代码，同时提醒注意事项，比如资源路径和模块依赖。</think>在QT中集成Cesium主要依赖QT的Web视图组件实现WebGL渲染，以下是两种典型方案和具体实施步骤： ### 方案一：基于QWebEngineView的基础集成 1. **环境配置** - 安装QT时勾选`Qt WebEngine`组件 - 在.pro项目文件中添加： ```qmake QT += webenginewidgets ``` 2. **创建Web容器** ```cpp #include <QWebEngineView> QWebEngineView* view = new QWebEngineView(this); view->load(QUrl("qrc:/cesium.html")); // 加载本地HTML setCentralWidget(view); ``` 3. **Cesium资源部署 - 将Cesium的`Build`目录复制到项目`resources`文件夹 - 在HTML中配置基础路径： ```html <script> window.CESIUM_BASE_URL = '/cesium/'; // 对应QT资源路径[^1] </script> <script src="qrc:/cesium/Cesium.js"></script> ``` ### 方案二：双向通信集成（QT-JavaScript交互） 1. **建立通信通道** ```cpp QWebChannel* channel = new QWebChannel(view->page()); view->page()->setWebChannel(channel); channel->registerObject("qtBridge", this); // 注册QT对象 ``` 2. **JS端消息接收** ```javascript new Cesium.Viewer('cesiumContainer').scene.postRender.addEventListener(() => { const position = viewer.camera.position; window.qtBridge.onCameraMove(position); // 触发QT信号 }); ``` 3. **QT信号槽绑定** ```cpp Q_INVOKABLE void onCameraMove(const QVariant& coord) { qDebug() << "Camera position:" << coord.toPointF(); } ``` ### 性能优化要点 1. 启用硬件加速： ```cpp QCoreApplication::setAttribute(Qt::AA_UseOpenGLES); QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling); ``` 2. 内存管理： ```cpp view->settings()->setAttribute(QWebEngineSettings::Accelerated2dCanvasEnabled, true); view->settings()->setMaximumPagesInCache(3); ```