mirror of
https://github.com/jiangteng2019/satellite-track.git
synced 2025-06-16 14:58:19 +00:00
'增加轨道可视化'
This commit is contained in:
parent
91ee7dfcbd
commit
de22cc18ee
@ -5,7 +5,7 @@
|
|||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<link rel="icon" href="/favicon.ico">
|
<link rel="icon" href="/favicon.ico">
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>satellite-track/</title>
|
<title>satellite-track</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
@ -5,16 +5,16 @@ class SatelliteEntity {
|
|||||||
|
|
||||||
constructor(tle = "", options = {}) {
|
constructor(tle = "", options = {}) {
|
||||||
const [name, tleLine1, tleLine2] = this._checkTle(tle);
|
const [name, tleLine1, tleLine2] = this._checkTle(tle);
|
||||||
|
let circle = tleLine2.slice(52, 64);
|
||||||
|
|
||||||
|
this.name = name.trim();
|
||||||
this.name = name;
|
|
||||||
this.tleLine1 = tleLine1.trim();
|
this.tleLine1 = tleLine1.trim();
|
||||||
this.tleLine2 = tleLine2.trim();
|
this.tleLine2 = tleLine2.trim();
|
||||||
this.satrec = twoline2satrec(this.tleLine1, this.tleLine2);
|
this.satrec = twoline2satrec(this.tleLine1, this.tleLine2);
|
||||||
|
|
||||||
this.totalSeconds = 864000;// 864000
|
this.totalSeconds = 864000;// 864000
|
||||||
this.stepSeconds = 300;
|
this.stepSeconds = 150;
|
||||||
this.leadTime = 5822;
|
this.leadTime = parseInt(24 * 3600 / circle);
|
||||||
this.trailTime = 0;
|
this.trailTime = 0;
|
||||||
|
|
||||||
}
|
}
|
||||||
@ -39,6 +39,7 @@ class SatelliteEntity {
|
|||||||
for (let i = 0; i < this.totalSeconds / this.stepSeconds; i++) {
|
for (let i = 0; i < this.totalSeconds / this.stepSeconds; i++) {
|
||||||
let sateTime = new Date(now + i * this.stepSeconds * 1000);
|
let sateTime = new Date(now + i * this.stepSeconds * 1000);
|
||||||
let sateCoord = this.getPositionEci(sateTime);
|
let sateCoord = this.getPositionEci(sateTime);
|
||||||
|
if (!sateCoord) continue;
|
||||||
const cesiumTime = Cesium.JulianDate.addSeconds(start, i * this.stepSeconds, new Cesium.JulianDate());
|
const cesiumTime = Cesium.JulianDate.addSeconds(start, i * this.stepSeconds, new Cesium.JulianDate());
|
||||||
const cesiumPosition = { x: sateCoord.x * 1000, y: sateCoord.y * 1000, z: sateCoord.z * 1000 };
|
const cesiumPosition = { x: sateCoord.x * 1000, y: sateCoord.y * 1000, z: sateCoord.z * 1000 };
|
||||||
positionProperty.addSample(cesiumTime, cesiumPosition);
|
positionProperty.addSample(cesiumTime, cesiumPosition);
|
||||||
@ -55,19 +56,32 @@ class SatelliteEntity {
|
|||||||
description: this.name,
|
description: this.name,
|
||||||
availability: new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({ start: start, stop: stop })]),
|
availability: new Cesium.TimeIntervalCollection([new Cesium.TimeInterval({ start: start, stop: stop })]),
|
||||||
position: this._getPositionProperty(),
|
position: this._getPositionProperty(),
|
||||||
point: { pixelSize: 6, color: Cesium.Color.RED },
|
point: { pixelSize: 8, color: Cesium.Color.fromRandom({ alpha: 1.0 }) },
|
||||||
path: new Cesium.PathGraphics({
|
path: new Cesium.PathGraphics({
|
||||||
width: 0.5,
|
width: 1,
|
||||||
show: false,
|
show: false,
|
||||||
leadTime: this.leadTime,
|
leadTime: this.leadTime,
|
||||||
trailTime: this.trailTime,
|
trailTime: this.trailTime,
|
||||||
material: Cesium.Color.LIME
|
material: Cesium.Color.LIME,
|
||||||
}),
|
}),
|
||||||
|
label: {
|
||||||
|
text: this.name,
|
||||||
|
font: '12px sans-serif',
|
||||||
|
scale: 0.8,
|
||||||
|
showBackground: true,
|
||||||
|
backgroundColor: new Cesium.Color(0.165, 0.165, 0.165, 0.5),
|
||||||
|
backgroundPadding: new Cesium.Cartesian2(4, 4),
|
||||||
|
outlineWidth: 1,
|
||||||
|
verticalOrigin: Cesium.VerticalOrigin.TOP,
|
||||||
|
horizontalOrigin: Cesium.VerticalOrigin.LEFT,
|
||||||
|
pixelOffset: new Cesium.Cartesian2(0, 5),
|
||||||
|
// scaleByDistance: new Cesium.NearFarScalar(1.5e3, 1.5, 8.0e7, 0.0),
|
||||||
|
fillColor: Cesium.Color.WHITE,
|
||||||
|
distanceDisplayCondition: new Cesium.DistanceDisplayCondition(10.0, 5000000),
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return satelliteEntity;
|
return satelliteEntity;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default SatelliteEntity
|
export default SatelliteEntity
|
@ -8,7 +8,7 @@
|
|||||||
import * as Cesium from 'cesium';
|
import * as Cesium from 'cesium';
|
||||||
import "cesium/Build/Cesium/Widgets/widgets.css";
|
import "cesium/Build/Cesium/Widgets/widgets.css";
|
||||||
|
|
||||||
import { onMounted } from 'vue';
|
import { onMounted, onBeforeMount } from 'vue';
|
||||||
|
|
||||||
import "./SatelliteTrack.scss"
|
import "./SatelliteTrack.scss"
|
||||||
|
|
||||||
@ -17,12 +17,11 @@ import { getTleWithLastThirtyDays } from '@/http/index'
|
|||||||
import SatelliteEntity from '@/js/SatelliteEntity';
|
import SatelliteEntity from '@/js/SatelliteEntity';
|
||||||
|
|
||||||
|
|
||||||
console.log(import.meta.env.MODE)
|
|
||||||
|
|
||||||
window.CESIUM_BASE_URL = import.meta.env.MODE === 'development' ? '/cesium' : '/satellite-track/cesium';
|
window.CESIUM_BASE_URL = import.meta.env.MODE === 'development' ? '/cesium' : '/satellite-track/cesium';
|
||||||
|
|
||||||
let viewer;
|
let viewer;
|
||||||
const totalSeconds = 864000;
|
const totalSeconds = 864000;
|
||||||
|
const satelliteMap = new Map();
|
||||||
|
|
||||||
|
|
||||||
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJiYjZmMWM4Ny01YzQ4LTQ3MzUtYTI5Mi1hNTgyNjdhMmFiMmMiLCJpZCI6NjIwMjgsImlhdCI6MTYyNjY3MTMxNX0.5SelYUyzXWRoMyjjFvmFIAoPtWlJPQMjsVl2e_jQe-c';
|
Cesium.Ion.defaultAccessToken = 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJqdGkiOiJiYjZmMWM4Ny01YzQ4LTQ3MzUtYTI5Mi1hNTgyNjdhMmFiMmMiLCJpZCI6NjIwMjgsImlhdCI6MTYyNjY3MTMxNX0.5SelYUyzXWRoMyjjFvmFIAoPtWlJPQMjsVl2e_jQe-c';
|
||||||
@ -96,12 +95,23 @@ function parseTle(data = "") {
|
|||||||
return tles;
|
return tles;
|
||||||
}
|
}
|
||||||
|
|
||||||
//处理点击事件
|
|
||||||
function addCesiumEventListener() {
|
function addCesiumEventListener() {
|
||||||
let that = this;
|
|
||||||
let callback = viewer.screenSpaceEventHandler.getInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);// 还原点击聚焦方块的效果。
|
let callback = viewer.screenSpaceEventHandler.getInputAction(Cesium.ScreenSpaceEventType.LEFT_CLICK);// 还原点击聚焦方块的效果。
|
||||||
viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
|
viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(movement) {
|
||||||
callback(movement);
|
callback(movement);
|
||||||
|
const pickedFeature = viewer.scene.pick(movement.position);
|
||||||
|
console.log(pickedFeature);
|
||||||
|
if (!Cesium.defined(pickedFeature)) {
|
||||||
|
satelliteMap.forEach(item => {
|
||||||
|
item.path.show = false;
|
||||||
|
})
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (pickedFeature) {
|
||||||
|
pickedFeature.id.path.show = new Cesium.ConstantProperty(true);
|
||||||
|
pickedFeature.id.label.distanceDisplayCondition = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
}, Cesium.ScreenSpaceEventType.LEFT_CLICK);
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -115,7 +125,9 @@ onMounted(async () => {
|
|||||||
|
|
||||||
parsedResult.forEach(tle => {
|
parsedResult.forEach(tle => {
|
||||||
let satellite = new SatelliteEntity(tle);
|
let satellite = new SatelliteEntity(tle);
|
||||||
viewer.entities.add(satellite.createSatelliteEntity());
|
let cesiumSateEntity = satellite.createSatelliteEntity();
|
||||||
|
let result = viewer.entities.add(cesiumSateEntity);
|
||||||
|
satelliteMap.set(satellite.name, result);
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user