demo-mars3d
This commit is contained in:
parent
323ca1a193
commit
38621cb3ee
|
@ -0,0 +1,14 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<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>mars3d-vite</title>
|
||||
<script type="module" src="/src/index.ts"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="mars3dContainer"></div>
|
||||
</body>
|
||||
</html>
|
|
@ -0,0 +1,20 @@
|
|||
{
|
||||
"name": "mars3d-demo",
|
||||
"version": "1.0.0",
|
||||
"license": "MIT",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"serve": "vite build && vite preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"vite": "^3.0.4",
|
||||
"vite-plugin-earth": "link:.."
|
||||
},
|
||||
"dependencies": {
|
||||
"@turf/turf": "^6.5.0",
|
||||
"mars3d": "^3.5.0",
|
||||
"mars3d-cesium": "^1.103.1"
|
||||
}
|
||||
}
|
|
@ -0,0 +1,9 @@
|
|||
html,
|
||||
body,
|
||||
#mars3dContainer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
}
|
|
@ -0,0 +1,54 @@
|
|||
import * as mars3d from 'mars3d';
|
||||
import './css/main.css';
|
||||
import 'mars3d/dist/mars3d.css';
|
||||
/**
|
||||
*
|
||||
* import * as mars3d from 'mars3d';
|
||||
* const map = new mars3d.Map('mars3dContainer', {});
|
||||
*
|
||||
*
|
||||
*/
|
||||
const map = new mars3d.Map('mars3dContainer', {
|
||||
scene: {
|
||||
center: { lat: 30.054604, lng: 108.885436, alt: 17036414, heading: 0, pitch: -90 },
|
||||
showSun: true,
|
||||
showMoon: true,
|
||||
showSkyBox: true,
|
||||
showSkyAtmosphere: false, // 关闭球周边的白色轮廓 map.scene.skyAtmosphere = false
|
||||
fog: true,
|
||||
fxaa: true,
|
||||
globe: {
|
||||
showGroundAtmosphere: false, // 关闭大气(球表面白蒙蒙的效果)
|
||||
depthTestAgainstTerrain: false,
|
||||
baseColor: '#546a53'
|
||||
},
|
||||
cameraController: {
|
||||
zoomFactor: 3.0,
|
||||
minimumZoomDistance: 1,
|
||||
maximumZoomDistance: 50000000,
|
||||
enableRotate: true,
|
||||
enableZoom: true
|
||||
}
|
||||
},
|
||||
control: {
|
||||
baseLayerPicker: true, // basemaps底图切换按钮
|
||||
homeButton: true, // 视角复位按钮
|
||||
sceneModePicker: true, // 二三维切换按钮
|
||||
navigationHelpButton: true, // 帮助按钮
|
||||
fullscreenButton: true, // 全屏按钮
|
||||
contextmenu: { hasDefault: true } // 右键菜单
|
||||
},
|
||||
terrain: {
|
||||
url: '//data.mars3d.cn/terrain',
|
||||
show: true
|
||||
},
|
||||
basemaps: [
|
||||
{
|
||||
name: '天地图影像',
|
||||
icon: 'img/basemaps/tdt_img.png',
|
||||
type: 'tdt',
|
||||
layer: 'img_d',
|
||||
show: true
|
||||
}
|
||||
]
|
||||
});
|
|
@ -0,0 +1,10 @@
|
|||
import { defineConfig } from 'vite';
|
||||
import earth from 'vite-plugin-earth';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [
|
||||
earth({
|
||||
useMars3D: true
|
||||
})
|
||||
]
|
||||
});
|
|
@ -1,6 +1,6 @@
|
|||
import { defineConfig } from 'vite';
|
||||
import cesium from 'vite-plugin-earth';
|
||||
import earth from 'vite-plugin-earth';
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [cesium()]
|
||||
plugins: [earth()]
|
||||
});
|
||||
|
|
|
@ -52,6 +52,7 @@
|
|||
},
|
||||
"peerDependencies": {
|
||||
"cesium": "^1.95.0",
|
||||
"@turf/turf": "^6.5.0",
|
||||
"mars3d-cesium": "^1.90.0",
|
||||
"mars3d": "^3.2.0",
|
||||
"vite": ">=2.7.1"
|
||||
|
|
1274
pnpm-lock.yaml
1274
pnpm-lock.yaml
File diff suppressed because it is too large
Load Diff
65
src/index.ts
65
src/index.ts
|
@ -12,17 +12,20 @@ interface VitePluginEarthOptions {
|
|||
devMinifyCesium?: boolean;
|
||||
cesiumBuildRootPath?: string;
|
||||
cesiumBuildPath?: string;
|
||||
useMars3D?: boolean;
|
||||
}
|
||||
|
||||
export default function vitePluginEarth(options: VitePluginEarthOptions = {}): Plugin {
|
||||
let CESIUM_NAME = options.useMars3D ? 'mars3d-cesium' : 'cesium';
|
||||
const {
|
||||
rebuildCesium = false,
|
||||
devMinifyCesium = false,
|
||||
cesiumBuildRootPath = 'node_modules/cesium/Build',
|
||||
cesiumBuildPath = 'node_modules/cesium/Build/Cesium/'
|
||||
cesiumBuildRootPath = `node_modules/${CESIUM_NAME}/Build`,
|
||||
cesiumBuildPath = `node_modules/${CESIUM_NAME}/Build/Cesium/`
|
||||
} = options;
|
||||
|
||||
let CESIUM_BASE_URL = 'cesium/';
|
||||
let CESIUM_BASE_URL = `${CESIUM_NAME}/`;
|
||||
let MARS3D_BASE_URL = `mars3d/`;
|
||||
let outDir = 'dist';
|
||||
let base: string = '/';
|
||||
let isBuild: boolean = false;
|
||||
|
@ -40,11 +43,13 @@ export default function vitePluginEarth(options: VitePluginEarthOptions = {}): P
|
|||
outDir = c.build.outDir;
|
||||
}
|
||||
CESIUM_BASE_URL = path.posix.join(base, CESIUM_BASE_URL);
|
||||
MARS3D_BASE_URL = path.posix.join(base, MARS3D_BASE_URL);
|
||||
const userConfig: UserConfig = {};
|
||||
if (!isBuild) {
|
||||
// -----------dev-----------
|
||||
userConfig.define = {
|
||||
CESIUM_BASE_URL: JSON.stringify(CESIUM_BASE_URL)
|
||||
CESIUM_BASE_URL: JSON.stringify(CESIUM_BASE_URL),
|
||||
MARS3D_BASE_URL: JSON.stringify(MARS3D_BASE_URL)
|
||||
};
|
||||
} else {
|
||||
// -----------build------------
|
||||
|
@ -61,10 +66,18 @@ export default function vitePluginEarth(options: VitePluginEarthOptions = {}): P
|
|||
};
|
||||
} else {
|
||||
// build 2) copy Cesium.js later
|
||||
let external = ['cesium'];
|
||||
let plugins = [externalGlobals({ cesium: 'Cesium' })];
|
||||
|
||||
if (options.useMars3D) {
|
||||
external.push('mars3d');
|
||||
plugins.push(externalGlobals({ mars3d: 'mars3d' }));
|
||||
}
|
||||
|
||||
userConfig.build = {
|
||||
rollupOptions: {
|
||||
external: ['cesium'],
|
||||
plugins: [externalGlobals({ cesium: 'Cesium' })]
|
||||
external: external,
|
||||
plugins: plugins
|
||||
}
|
||||
};
|
||||
}
|
||||
|
@ -73,19 +86,31 @@ export default function vitePluginEarth(options: VitePluginEarthOptions = {}): P
|
|||
},
|
||||
|
||||
configureServer({ middlewares }) {
|
||||
if (options.useMars3D) {
|
||||
const cesiumPath = path.join(cesiumBuildRootPath, 'Cesium');
|
||||
middlewares.use(path.posix.join('/', CESIUM_BASE_URL), serveStatic(cesiumPath));
|
||||
|
||||
const mars3dPath = path.join(`node_modules/mars3d`, 'dist');
|
||||
middlewares.use(path.posix.join('/', MARS3D_BASE_URL), serveStatic(mars3dPath));
|
||||
} else {
|
||||
const cesiumPath = path.join(cesiumBuildRootPath, devMinifyCesium ? 'Cesium' : 'CesiumUnminified');
|
||||
middlewares.use(path.posix.join('/', CESIUM_BASE_URL), serveStatic(cesiumPath));
|
||||
}
|
||||
},
|
||||
|
||||
async closeBundle() {
|
||||
if (isBuild) {
|
||||
try {
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Assets'), path.join(outDir, 'cesium/Assets'));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'ThirdParty'), path.join(outDir, 'cesium/ThirdParty'));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Workers'), path.join(outDir, 'cesium/Workers'));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Widgets'), path.join(outDir, 'cesium/Widgets'));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Assets'), path.join(outDir, `${CESIUM_NAME}/Assets`));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'ThirdParty'), path.join(outDir, `${CESIUM_NAME}/ThirdParty`));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Workers'), path.join(outDir, `${CESIUM_NAME}/Workers`));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Widgets'), path.join(outDir, `${CESIUM_NAME}/Widgets`));
|
||||
if (!rebuildCesium) {
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Cesium.js'), path.join(outDir, 'cesium/Cesium.js'));
|
||||
await fs.copy(path.join(cesiumBuildPath, 'Cesium.js'), path.join(outDir, `${CESIUM_NAME}/Cesium.js`));
|
||||
}
|
||||
|
||||
if (options.useMars3D) {
|
||||
await fs.copy(path.join(`node_modules/mars3d/`, 'dist'), path.join(outDir, 'mars3d'));
|
||||
}
|
||||
} catch (err) {
|
||||
console.error('copy failed', err);
|
||||
|
@ -111,6 +136,24 @@ export default function vitePluginEarth(options: VitePluginEarthOptions = {}): P
|
|||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (options.useMars3D) {
|
||||
tags.push(
|
||||
{
|
||||
tag: 'link',
|
||||
attrs: {
|
||||
rel: 'stylesheet',
|
||||
href: normalizePath(path.join(MARS3D_BASE_URL, 'mars3d.css'))
|
||||
}
|
||||
},
|
||||
{
|
||||
tag: 'script',
|
||||
attrs: {
|
||||
src: normalizePath(path.join(MARS3D_BASE_URL, 'mars3d.js'))
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
return tags;
|
||||
}
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue