原生cesium、mars3d、supermap-cesium在vue3+vite中引入

最新推荐文章于 2024-05-08 13:51:50 发布
最新推荐文章于 2024-05-08 13:51:50 发布
阅读量435 收藏 1
点赞数
分类专栏： Cesium 文章标签： 3d
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42038997/article/details/134853265
版权

1. 原生cesium

需要下载

yarn add cesium

yarn add vite-plugin-cesium

2. mars3d

需要下载

yarn add mars3d mars3d-cesium

yarn add vite-plugin-mars3d

3. supermap-cesium

只需要引入官网下载的包，build文件夹下的cesium，以及项目中引入的其他cesium 不需要引入包括插件。
在这里插入图片描述

index.html
在这里插入图片描述

Lanwarf-前端开发
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
supermap WebGL 3D与原生Cesium加载3DTiles问题
一醉千秋的专栏
09-05 3826
1.supermap提供无插件的三维地图开发包，即supermap WebGL 3D，是基于Cesium定制开发的，当前对应的原生Cesium版本为1.40、1.54。而最新的Cesium已经更新到1.61。 2.原生Cesium加载3DTiles时，性能在不断优化，当加载的范围较大时，会出现崩溃现象，而supermap WebGL 3D定制后，加载速度明显优于原生Cesium，这点为super...
在vue3中使用Cesium保姆篇
qq_35452726的博客
01-05 4835
当然我们如果在项目中使用三位地图的话肯定不要左下角的的logo的，由于cesium的api没办法关闭，所以就只能用css样式来控制了，代码中用到了cesium的token,如果不知道token在哪取的话可以看这篇文章。在cesium中用到的坐标是笛卡尔坐标，所以我们的经纬度需要进行转换后才能使用。这样可以让logo隐藏掉但是，由于是在vue3中， v-deep已经废弃了，当然，这个是写在组件加载后的，自然还要引入onMounted。在里面引入刚才下载的插件并使用，代码如下。暂时更到这里，后续还会更新。
在Mars3d实现cesium的ImageryLayer自定义瓦片的层级与原点
最新发布
m0_69803146的博客
05-08 535
在Mars3d实现cesium的ImageryLayer自定义瓦片的层级与原点，自定义一个layerType
超图的supermap-cesium
全栈小菜鸟
11-11 1098
vue集成cesium或超图的supermap-cesium学习笔记
通过mars3d1.8+cesium1.6根据坐标获取对应坐标在3dtiles模型上的高度
张志强的博客
07-04 2572
要在3D模型上获取坐标的高度，我们需要首先将模型加载到地图中。使用mars3d，您可以轻松加载3D模型，并使用cesium强大的功能进行操作和分析。现在，我们已经成功地获取到了对应坐标在3D模型上的高度。总结起来，通过结合mars3d和cesium这两个强大的前端库，我们可以轻松获取对应坐标在3D模型上的高度。然而，对于一些开发者来说，如何在3D模型上获取对应坐标的高度可能是一个挑战。一旦我们的3D模型加载完成，我们就可以使用cesium的功能来获取对应坐标在模型上的高度了。
01从mars3d到cesium
m0_69803146的博客
02-23 829
阿祖从Mars3d到cesium的进阶
mars3d-supermap-master_supermap_火星代码_火星科技cesium_mars3d-supermap_
09-11
在"mars3d-supermap-master"项目中，通过引入SuperMap的JS文件，开发者可以访问SuperMap的丰富GIS服务，如在线地图服务、空间数据查询等，从而将2D/3D地图无缝集成到Vue.js+Cesium的应用中。 **四、项目结构分析** ...
基于vue3+vite+cesium 生成热力图CesiumHeatmap源码
11-22
在vue3+vite+cesium加载CesiumHeatmap生成热力图时不能直接使用， 需对源码进行重新封装及修改后方可在vue3+vite中调用； 源码已修改并验证可用；
vue3+ts+vite+cesium 加载天地图影像、标注等多服务器随机加载切换版本
04-02
这段基于 Vue.js 的 Cesium 地图应用示例展示了如何使用 Cesium.js 创建一个具有自定义配置的 3D 地球视图。Cesium.js 是一个开源 WebGL 虚拟地球引擎，可以构建交互式的 3D 地图应用。示例中的底图和注记图层来自...
个Vite+Vue3+TypeScript+Cesium.js集成模板是一个开箱即用的项目模板
04-01
该模板提供了一个简单的示例，展示了如何在Vue3应用程序中使用Cesium.js API创建一个基本的地球场景，并实现了一些基本的交互功能。除此之外，该模板还提供了一些常用的依赖和插件，如axios、element-plus、vuex等，...
mars3d-link-supermap:Mars3D兼容使用超图平台示例
04-01
更多示例，请从mars3d功能示例库中拷贝即可。 运行站点 在任意开发编辑器（如vscode等）或http服务器（如node，nginx，tomcat，IIS等）下直接运行浏览a10_createMap_viewer.html等示例页面即可 运行效果 压缩及改造 ...
Mars3D三维地球平台软件 主仓库，包含示例及引导（基于Cesium技术）.rar
05-28
Cesium 是一款面向三维地球和地图的，世界级的JavaScript开源产品。它提供了基于JavaScript语言的开发包，方便用户快速搭建一款零插件的虚拟地球Web应用，并在性能，精度，渲染质量以及多平台，易用性上都有一定的保证。 Cesium隶属于AGI公司，该公司一直致力于时空数据业务。正如很多开源项目都有一个个性化的名字，Cesium也不例外。Cesium原意是化学元素铯，铯是制造原子钟的关键元素，通过命名强调了Cesium产品专注于基于时空数据的实时可视化应用。 AGI的英文全称为Analytical Graphics Incorporation，三位创始人曾在通用公司宇航部的供职工程师，提供STK（System/Satellite Toolkit Kit）和Cesium两款产品。该公司是航天分析软件的领导者，而STK则是该公司的旗舰产品。经过多年来在时空数据的积累，AGI公司逐渐掌握了大量3D可视化技术，也感受到各行各业对海量3D数据的强烈需求，因此于2012年创建了cesiumjs开源项目，围绕Cesium生态圈打造了一套安全独立的企业级解决方案
mars
03-31
火星应用-Billie Coding Challenge 要求 安装方式 npm install 配置 复制环境变量 cp env.example .env 采用 启动后端服务器 npm run server 启动应用 npm run start 注释 The app was created with create-react-app.
【mars3d】Cesium实现雷达放射波
球球博客
06-21 1447
先看效果图说明：使用的是mars3d框架，原生的Cesium实现方式可以绕道~
【超图+CESIUM】【基础学习使用】01、前置学习资料
汪同学丶的博客
02-24 1652
超图学习使用，前置基础资料准备，包含API、示例等
Mars3D/Cesium + VUE3
qq_54665632的博客
01-11 1614
Mars3D/Cesium + VUE3
Cesium学习(Mars3D) 基础配置项与功能
a1578460233的博客
08-05 5312
配置项记录 中文教程-小白必备 中文api文档–学会查阅文档 准备工作-引入文件 vue-cli目录 public/index.html <!--引入cesium基础lib--> <link href="http://mars3d.cn/lib/Cesium/Widgets/widgets.css" rel="stylesheet" type="text/css" /> <script src="http://mars3d.cn/lib/Cesium/Cesiu
【Mars3d】实现cesium叠加dwg或者其他矢量图的解决方案
m0_69803146的博客
12-14 587
【Mars3d】实现cesium叠加dwg或者其他矢量图的解决方案
基于Mars3D/Cesium第三方库的动态模型间连线
Boooooil的博客
06-19 1238
在使用基于Cesium的Mars3D第三方库做开发的时候，碰到了这么一个需求：“实现两个模型之间的连线，这个直线可以随着模型的移动而移动”。Mars3D中提供了一个标绘功能，简单来说就是可以通过拖动鼠标改变模型在图层上的位置。所以提出的需求就简化成了————“鼠标拖动模型，模型间的连线随着模型移动而移动”....
vue3+vite +cesium
09-13
4. 在App.vue中创建一个Cesium容器并初始化Cesium实例： ```html <div id="cesiumContainer"></div> import { Viewer } from "cesium"; import { onMounted } from "vue"; onMounted(() => { const viewer = ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值