基于 Vue3.x + Mars3D 平台的🌎Vite插件

vite-plugin-mars3d使用说明

安装

1//安装mars3d主库
2npm install mars3d mars3d-cesium @turf/turf --save
3
4//安装vite插件
5npm install vite-plugin-mars3d --save

配置

vite.config.ts中引入plugin插件

1import { defineConfig } from 'vite';
2import { mars3dPlugin } from 'vite-plugin-mars3d';
3
4export default defineConfig({
5  plugins: [mars3dPlugin()]
6});

如果你个性化需求，也可以按需传入参数

1import { defineConfig } from 'vite';
2import { mars3dPlugin } from 'vite-plugin-mars3d';
3
4export default defineConfig({
5  plugins: [
6      mars3dPlugin({
7        mars3dPackageName: "mars3d",
8        mars3dRunPath: "mars3d",//目录名称
9        cesiumPackageName: "mars3d-cesium",
10        cesiumRunPath: "mars3d-cesium",//目录名称
11        useStatic: false,
12        useCDN: false
13      }),
14  ]
15});

使用原生cesium时

1. 不要安装mars3d-cesium包，仅安装cesium包，就是不能同时存在2个cesium包 package.json文件示例:

1  "dependencies": {
2    "cesium": "^1.118.0",
3    "mars3d": "^3.7.20",
4    "mars3d-space": "^3.7.20",
5    "rollup": "^2.79.1",
6    "vue": "^3.2.47"
7  },
8  "devDependencies": {
9    "vite": "^4.2.0",
10    "vite-plugin-mars3d": "^4.1.0",
11    "@vitejs/plugin-vue": "^4.1.0",
12    "typescript": "^4.9.3",
13    "vue-tsc": "^1.2.0"
14  }

2. vite.config中引入时使用配置 mars3dPlugin({ cesiumPackageName: "cesium" })

vite.config.ts文件示例:

1import { defineConfig } from "vite";
2import vue from "@vitejs/plugin-vue";
3import { mars3dPlugin } from "vite-plugin-mars3d"; // 引入插件
4
5
6export default defineConfig({
7  plugins: [
8    vue(),
9    mars3dPlugin({ cesiumPackageName: "cesium" }), // 使用cesium原生包
10  ],
11});

参考

https://github.com/nshen/vite-plugin-cesium

常见问题

• 如果项目的 package.json 没有 type:"module" ，请使用 "vite-plugin-mars3d":"~3.1.3"
• 如果项目的 package.json 有 type:"module" 直接用最新版本即可。
• 如果无法排除解决问题，也可以在vite.config.ts配置改为静态引入 mars3dPlugin({ useStatic: true })

Mars3D 是什么

Mars3D平台 是火星科技研发的一款基于 WebGL 技术实现的三维客户端开发平台，基于Cesium优化提升与 B/S 架构设计，支持多行业扩展的轻量级高效能 GIS 开发平台，能够免安装、无插件地在浏览器中高效运行，并可快速接入与使用多种 GIS 数据和三维模型，呈现三维空间的可视化，完成平台在不同行业的灵活应用。

Mars3D 平台可用于构建无插件、跨操作系统、 跨浏览器的三维 GIS 应用程序。平台使用 WebGL 来进行硬件加速图形化，跨平台、跨浏览器来实现真正的动态大数据三维可视化。通过 Mars3D 产品可快速实现浏览器和移动端上美观、流畅的三维地图呈现与空间分析。

相关网站

• Mars3D 官网：http://mars3d.cn

• Mars3D 开源项目列表：https://github.com/marsgis/mars3d

版权说明

1. Mars3D 平台由火星科技自主研发，拥有所有权利。
2. 任何个人或组织可以在遵守相关要求下可以免费无限制使用。