第1节：vue cesium 概述（含网站地址+视频）

已于 2023-06-09 12:03:32 修改
阅读量1.9k 收藏 2
点赞数 1
分类专栏： cesium vue 文章标签： cesium cesiumjs cesium在线地图 cesium离线地图
于 2023-06-04 00:23:18 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_29384639/article/details/131027501
版权

在开始介绍vue cesium之前，我们先聊聊cesiumjs，如果你对这块内容比较熟悉，可以直接跳过这节内容。
在这里插入图片描述

cesiumJS

简介

官方网址：https://cesium.com/platform/cesiumjs/

CesiumJS 是一个开源 JavaScript 库，主要用于基于3D地球仪和地图的开发。
CesiumJS 建立在开源之上，为海量数据集提供强大的互操作性和扩展性。
从2012年到永远开源
CesiumJS是在Apache 2.0许可证下发布的，可免费用于商业和非商业用途。
支持3D Tiles 和其他标准格式的资源加载
支持高精度WGS84坐标的可视化及分析
可以在桌面或者手机端进行共享

沙箱示例

入口

地址：沙箱地址
查看全部示例，点击ALL

文档示例及API

入口


快速开始


vue cesium

网址：vue cesium
默认是vue3版本
![](https://img-blog.csdnimg.cn/img_convert/a06ee4f569e63aacdc6ebcdae33c924e.png

视频及源码

视频地址：B站视频
源码地址：见第3节之后

cesium vue
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
专栏目录
订阅专栏
专栏：Vue3.0 + Typescript + axios + bootstrap +原始注释博客专栏作品
01-31
项目描述 使用Vue3模仿知乎开发的项目 使用bootstrap进行css样式调整 使用TypeScript语法 使用初步思想开发 使用ESLint语法规范 使用Axios进行数据获取 使用vue-router进行路由重组 使用Vuex进行数据管理 代码中包含清晰注释，方便阅读 文章内容支持markdown格式 如何运行 git clone cd栏 npm安装 npm install bootstrap @ next npm运行发球 在线浏览地址 测试 测试密码111111 最后 希望您能留下一个star，感谢
vue视频：vue + vue路由器+ vuex +（获取-> axios）
02-05
写在前面（有问题可以加qq群：725165362） 该项目有两个版本，vue和React 前端项目地址前端预览 初步项目地址后台管理 API接口地址 （未更新，接口现在重写过） react版现在已经完成 react版项目地址 react版本预览 技术栈（Vue2.js + Node.js全栈项目） 由于页面不是很多，vuex用的不多，关键掌握怎么实现就好了 vue2 + vuex + vue-router + webpack + fetch/axios + sass + flex + svg +阿里字体图标 运行 git clone https://github.com/wclimb/vu
cesium-vue-webpack:Cesium+Vue+Webpack框架
05-06
Cesium+Vue+Webpack框架 此项目已废弃！ Cesium 1.63版本以后，不再使用AMD模式，而这个项目主要依赖AMD模式来加载，所以目前已不能使用。Cesium 1.62以下的版本仍可使用。 需要最新版Cesium+Vue模板请移步这里： vtxf 20190108 前言 之前使用Vue时，老是遇到webpack的一些配置问题。比如调试起来不方便、编译速度缓慢、服务器的目录结构总是不对等问题。经过多次填坑，终于摸索一套使用相对方便的框架出来。在这里和大家分享一下。 如果您也希望使用目前流行的vue来管理Cesium所在的三维窗口，不妨一试，希望能对您有所帮助！如果使用中遇到问题，欢迎提issue。 特色 1 可以直接调试Cesium源码 npm run dev时，可以直接调试Cesium源码，此源码非编译后unminifiedXXX文件夹下的代码，而是真正的Source目
vue-cesium:CesiumJS的Vue 3.x组件
04-02
VUE CESIUM VueCesium-用于GIS的CesiumJS的基于Vue 3.x的组件库。 :flexed_biceps: Vue 3.0合成API :fire: 用TypeScript编写 状态：测试版 该项目仍在大力开发中。 欢迎加入我们，并提出您的第一个请求。 语言能力 文献资料 您可以在上找到更多详细信息，API和其他文档。 加入我们的 ，开始与大家交流。 引导项目 带命令 $ yarn bootstrap 该项目将安装所有依赖项并运行lerna bootstrap来初始化项目 网站预览 带命令 $ yarn website-dev 该项目将启动网站供您预览所有现有组件 ## Generate new component With command ```bash $ yarn gen component-name 请注意， component-name必须为kebab-case ，通过用短划线替换
vue3.x中使用cesium，vue3.x+Cesium
05-04
在vue3.x版本中使用cesium，基于vue-cli创建项目，手动配置webpack，资源已配置好，下载完 进入项目下npm install 安装依赖后就可以运行了
vue中使用cesium方法总结
m0_46635519的博客
04-11 1万+
三种cesium结合Vue-cli4的方法，1自己配置，2vue-cli-plugins，3组件化
最新Vue + Cesium环境配置
热门推荐
qq_26610239的博客
02-24 1万+
vue中配置cesium最新教程，最新适配vue 3+、cesium 1.111。
vue-cesium 使用方法
Moke的博客
12-15 3984
MateLife is Like a Fuxking Movie 安装 npm i vue-cesium@2.2.6 使用 public > index.html <!-- include VueCesium --> <script src="https://unpkg.com/vue-cesium@latest/lib/index.umd.js"></script> main.js import VueCesium from 'vue-cesium
Vue 第三方集成之 Cesium
qq_25081445的博客
03-10 4030
最近项目有三维地图展示需求，甲方提供了三维数据，要求使用Cesium集成。 利用一天时间集中突击了一下做个笔记，后面再用到的话也好自查。 声明一下，作者也是最近刚接触cesium，目前的探索也只是作为初学者一个导引吧，避免少走弯路。不喜勿喷，谢谢。 资源 官网地址：https://cesium.com/platform/ 文档示例很多，API也很全，就是全部英文看起来费劲，建议深度学习可以看看。 GitHub地址：https://github.com/CesiumGS 有几个JavaScript分类的dem
vue使用cesium
qq_41713136的博客
10-09 6850
cesium.js
Cesium/VUE态势标绘组件完整源代码（未加密）：基于Cesium+VUE实现完整态势标绘组件，未加密，未压缩
05-09
也可以直接订阅我的专栏，同样可以拿到整个组件的所有源代码，专栏地址：https://blog.csdn.net/qq_34205305/category_11737227.htmlCesium/VUE态势标绘组件完整源代码（未加密）：基于Cesium+VUE实现完整态势标绘...
【在Vue项目上使用cesium】
m0_45991266的博客
11-16 2977
在Vue项目上使用cesium,我主要是为了对ceisum项目进行二次开发
vue 中使用 cesium
大家好，我是 ed.
12-27 8745
vue 中使用 cesium 我是在 vue 项目里面使用的 cesium，但是呢，有点问题，就是有些语法在js转vue的时候有些许的限制，比如说js中相对路径引入文件是一切OK的，vue 也能解决，但是呢，在引入的文件中又引用了其他的文件，vue 处理起来就不是特别的好用，所以说，我是直接在 vue 文件里面使用 iframe 标签引入的 html 文件来实现接入的，而vue和iframe之间的通信采用的 postMessage 方式实现，下面就稍微介绍一下。 vue项目引入cesium 这个相对来说
在vue上使用cesium开发三维地图
wangyingying12的博客
04-18 4713
沙盒是一种安全特性，将潜在风险的代码（例如第三方脚本）与系统的其余部分隔离开来，防止脚本对浏览器的恶意操作。'allow-scripts'是一个权限选项，允许在沙箱环境中运行脚本。如果未设置此权限，浏览器将阻止脚本在沙箱中运行并显示此错误消息。这个错误信息通常出现在脚本尝试在沙盒框架中运行，但是'allow-scripts'权限没有被设置。这只是一个简单的示例，您可以通过查看 Cesium 的文档和示例来学习如何使用更高级的功能。接下来，在 Vue 项目中引入 Cesium，可以使用以下几种方式。
CesiumJS第1篇，CesiumJS使用详细，在vue中使用Cesium.js（WebGIS中的Cesium地图可视化应用）
weixin_65793170的博客
06-21 9937
Cesium是一种基于WebGL开源的虚拟地球技术，可以用于构建高性能、跨平台的三维地球应用程序，它支持多种数据格式和地图服务，可以实现地球表面的高精度渲染、地形分析、数据可视化等功能。Cesium还提供了丰富的API和插件，方便开发者进行二次开发和定制化，且可免费商用，在航空航天、国防、城市规划、教育等领域得到了广泛应用。
【Vue+CesiumJS学习（1）】在Vue中使用Cesium（两种方法）
yuelizhe4774的博客
03-15 6211
在Vue中使用Cesium可以通过使用Cesium官方提供的包，或者使用开发者封装后的二次包。***注意 因为该项目于2022.12.31停止vue2版本更新，现在默认安装都是vue3版本，因此需要控制版本。Step 4：新建一个Vue文件，或者直接对默认的HelloWorld.vue进行修改。开发者提供的包还有很多便捷性的东西，这里不再阐述了，有需要可以自己去看看，地址如下。Step 3：在index.html中引入js文件和css文件。两种方法均在Vue项目中运行，略过Vue项目创建步骤。
从零开始vue项目使用cesium开发三维地图（一）
yinzisang的博客
11-12 8086
上图： 参考网上很多文档，都是webpack打包之类的，复杂且容易出错，通过vue-cli-plugin-cesium这个插件可以快速帮你创建一个demo示例，然后根据自己的需要创建三维地图 一、vue-cli快速创建一个vue项目框架（必须使用vue-cli3以上版本，要不然不能使用vue-cli-plugin-cesium插件） 1、vue --version 查看版本（我这里是最新版4.5） 2、 若不是vue-cli3版本以上需要安装最新版本 npm install -.....
VUE-cesium（综合demo-01配置基础项）
damadashen的博客
06-28 930
VUE-Cesium综合项目（基础配置及实现）
Vue+Cesium创建项目并加载地图全过程
wangyong_h
03-05 5798
Vue2创建项目并配置Cesium加载三维地图 cesium 安装配置 npm run dev 运行错误处理
vue Cesium
最新发布
09-10
Vue Cesium是一个基于Vue.js框架的Cesium封装库，用于在Web应用中集成和使用Cesium地球引擎。Cesium是一个开源的JavaScript库，可以构建高性能的3D地球和地图应用。 Vue Cesium提供了一系列Vue组件，使得在Vue项目中使用Cesium变得更加简单。它封装了Cesium的底层API，提供了一些高级功能和易用的接口，同时也保留了Cesium原有的强大功能。 使用Vue Cesium，你可以轻松创建交互式的3D地图、展示地理数据、添加标注、绘制图形等。它提供了丰富的配置选项和事件回调，方便你根据具体需求进行定制和扩展。 你可以通过npm安装Vue Cesium，并在Vue项目中引入相关组件来开始使用。例如： ```bash npm install vue-cesium ``` 然后在你的Vue组件中引入所需的组件，比如CesiumViewer： ```javascript import { CesiumViewer } from 'vue-cesium' export default { components: { CesiumViewer }, // ... } ``` 在模板中使用CesiumViewer组件： ```html <template> <CesiumViewer :options="viewerOptions" /> </template> ``` 以上只是一个简单的示例，你可以根据需要进行更复杂的配置和使用。 总之，Vue Cesium让在Vue项目中使用Cesium变得更加方便和灵活，同时发挥了Vue框架的优势和特性。它是一个很好的选择，如果你需要在Vue项目中集成Cesium地球引擎。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

打赏作者

cesium vue

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

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

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

打赏作者

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

抵扣说明：

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

余额充值