Skip to content

C
cesium-frame
Commit 514ee641 by jlc
Options

update：飞机案例代码结构的修改

parent 1786dbce
Showing with 86 additions and 95 deletions
src/examples/movingTarget/aircraft/aircraft-function.js
export function addAircraft() { export function addAircraft(viewer) {
const script = document.createElement('script'); const czml = [
script.src = 'https://cesium.com/downloads/cesiumjs/releases/1.99/Build/Cesium/Cesium.js'; {
script.onload = () => { id: "document",
window.Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3Njg4ZWU5Yi1iZDhiLTRhYmUtOTRiYS04YjM5NmUwNjVmMDMiLCJpZCI6MjI3MzQ3LCJpYXQiOjE3MjA1MjA4Mjh9.E5XW4LnwgfVAaBC-znaYr61m4yK0-j2qEQhi9qwFFPE' name: "SpaceX",
version: "1.0",
const viewer = new window.Cesium.Viewer('cesiumContainer', { clock: {
infoBox: false, interval: "2019-08-28T04:00:00Z/2019-08-28T04:20:00Z",
shouldAnimate: true currentTime: "2019-08-28T04:00:00.00Z",
}); multiplier: 1,
range: "LOOP_STOP",
const czml = [ step: "SYSTEM_CLOCK_MULTIPLIER"
{ }
id: "document", },
name: "SpaceX", {
version: "1.0", id: "path",
clock: { name: "path for Spacex",
interval: "2019-08-28T04:00:00Z/2019-08-28T04:20:00Z", description: "<p>this is a description</p>",
currentTime: "2019-08-28T04:00:00.00Z", availability: "2019-08-28T04:00:00Z/2019-08-28T04:20:00Z",
multiplier: 1, path: {
range: "LOOP_STOP", material: {
step: "SYSTEM_CLOCK_MULTIPLIER" polylineOutline: {
} color: {
}, rgba: [255, 0, 255, 255],
{ },
id: "path", outlineColor: {
name: "path for Spacex", rgba: [0, 255, 255, 255],
description: "<p>this is a description</p>", },
availability: "2019-08-28T04:00:00Z/2019-08-28T04:20:00Z", outlineWidth: 5
path: { },
material: { },
polylineOutline: { width: 8, // 折线宽度
color: { leadTime: 5,
rgba: [255, 0, 255, 255], trailTime: 50000,
}, resolution: 5,
outlineColor: { },
rgba: [0, 255, 255, 255], orientation: {
}, "velocityReference": "#position"
outlineWidth: 5 },
}, model: {
}, gltf: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/Cesium_Air.glb',
width: 8, // 折线宽度 // https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/Cesium_Air.glb
leadTime: 5, // https://gitee.com/jin-linchao/cesium-assets/raw/master/3Dmodel/Cesium_Air.glb
trailTime: 50000, minimumPixelSize: 128,
resolution: 5, },
}, position: {
orientation: { epoch: "2019-08-28T04:00:00.00Z",
"velocityReference": "#position" cartographicDegrees: [
}, 0, 120, 40, 65000,
model: { 1200, 130, 40, 80000
gltf: 'https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/Cesium_Air.glb', ]
// https://raw.githubusercontent.com/jinlinchao123/Cesium-assets/main/3Dmodel/Cesium_Air.glb }
// https://gitee.com/jin-linchao/cesium-assets/raw/master/3Dmodel/Cesium_Air.glb },
minimumPixelSize: 128, ];
}, var dataSourcePromise = viewer.dataSources.add(Cesium.CzmlDataSource.load(czml));
position: { dataSourcePromise.then(function (dataSource) {
epoch: "2019-08-28T04:00:00.00Z", // 根据模型所在的实体去进行加载
cartographicDegrees: [ viewer.trackedEntity = dataSource.entities.getById('path');
0, 120, 40, 65000, }).catch(function (error) {
1200, 130, 40, 80000 console.error(error);
] });
}
},
];
var dataSourcePromise = viewer.dataSources.add(Cesium.CzmlDataSource.load(czml));
dataSourcePromise.then(function (dataSource) {
// 根据模型所在的实体去进行加载
viewer.trackedEntity = dataSource.entities.getById('path');
}).catch(function (error) {
console.error(error);
});
// viewer.trackedEntity.orientation = Cesium.Quaternion.fromHeadingPitchRoll(new Cesium.HeadingPitchRoll(Cesium.Math.toRadians(-60), Cesium.Math.toRadians(45), Cesium.Math.toRadians(0)));
// let matrix = viewer.trackedEntity?.computeModelMatrix(Cesium.JulianDate.fromIso8601('2019-08-28T04:00:00.00Z'))
// // 通过调试的实体来绘制模型坐标轴
// viewer.scene.primitives.add(
// new Cesium.DebugModelMatrixPrimitive({ // 加载模型偏移矩阵的图元
// modelMatrix: matrix, // 设置偏移矩阵
// length: 100000,
// width: 10
// })
// );
};
document.head.appendChild(script);
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'https://cesium.com/downloads/cesiumjs/releases/1.119/Build/Cesium/Widgets/widgets.css';
document.head.appendChild(link);
} }
src/examples/movingTarget/aircraft/aircraft.vue
<template> <template>
<div id="cesiumContainer" class="cesium-container"></div> <div id="cesiumContainer" class="cesium-container"></div>
</template> </template>
<script setup> <script setup>
import { onMounted } from 'vue'; import { onMounted } from 'vue';
import { addAircraft } from './function'; import { addAircraft } from './function';
let viewer;
onMounted(() => { onMounted(() => {
addAircraft() const script = document.createElement('script');
script.src = 'https://cesium.com/downloads/cesiumjs/releases/1.99/Build/Cesium/Cesium.js';
script.onload = () => {
window.Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiI3Njg4ZWU5Yi1iZDhiLTRhYmUtOTRiYS04YjM5NmUwNjVmMDMiLCJpZCI6MjI3MzQ3LCJpYXQiOjE3MjA1MjA4Mjh9.E5XW4LnwgfVAaBC-znaYr61m4yK0-j2qEQhi9qwFFPE'
viewer = new window.Cesium.Viewer('cesiumContainer', {
infoBox: false,
shouldAnimate: true
});
addAircraft(viewer)
};
document.head.appendChild(script);
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = 'https://cesium.com/downloads/cesiumjs/releases/1.119/Build/Cesium/Widgets/widgets.css';
document.head.appendChild(link);
}); });
</script> </script>
<style> <style>
.cesium-container { .cesium-container {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
} }
</style> </style>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment