VS中加载cesium

最新推荐文章于 2023-03-06 09:30:00 发布

Wendy421

最新推荐文章于 2023-03-06 09:30:00 发布

阅读量1.1k

点赞数

分类专栏： cesium学习文章标签： javascript vue.js 前端

本文链接：https://blog.csdn.net/wendy421/article/details/124886279

版权

cesium学习专栏收录该内容

3 篇文章 1 订阅

订阅专栏

本文介绍了小白在使用Cesium时遇到的渲染停止错误，并提供了两种解决方案：一是通过正确引入jQuery和Cesium.js文件，二是本地引用Cesium资源。两种方法都能成功打开Cesium地图应用。

摘要由CSDN通过智能技术生成

作为小白，加载cesium报错，显示An error occurred while rendering. Rendering has stopped.

经过一番询问大佬们，终于知道原因了，解决方案有两个，如下：

（一）在head中添加用下面的代码

<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
<script src="https://cesium.com/downloads/cesiumjs/releases/1.82/Build/Cesium/Cesium.js"></script>
<link href="https://cesium.com/downloads/cesiumjs/releases/1.82/Build/Cesium/Widgets/widgets.css" rel="stylesheet">

得到完整的代码如下所示

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>HelloWorld</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
    <script src="https://cesium.com/downloads/cesiumjs/releases/1.82/Build/Cesium/Cesium.js"></script>
    <link href="https://cesium.com/downloads/cesiumjs/releases/1.82/Build/Cesium/Widgets/widgets.css" rel="stylesheet"> 
</head>

<body>
    <div id="map"></div>
    <script>
        var viewer = new Cesium.Viewer('map');
    </script>
</body>

点击运行

（二）在head中引入下列代码

<script src="../Build/Cesium/Cesium.js"></script>
<style>
   @import url('../Build/Cesium/Widgets/widgets.css');
</style>

得到最终的完整代码如下所示

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>HelloWorld</title>
    <script src="../Build/Cesium/Cesium.js"></script>
    <style>
        @import url('../Build/Cesium/Widgets/widgets.css');
    </style>
</head>

<body>
    <div id="map"></div>
    <script>
        var viewer = new Cesium.Viewer('map');
    </script>
</body>

在代码框这里右键点击