Commit e5dafbfa by jlc

update:指定连接类型添加虚线连接

parent b032a3d1
...@@ -92,7 +92,7 @@ export class SpecifyConnectionType { ...@@ -92,7 +92,7 @@ export class SpecifyConnectionType {
} }
// 连接方式为静态线 // 连接方式为静态线
useStatic() { useStaticLines() {
// 创建连线函数 // 创建连线函数
function createConnection(viewer, satellitePositionProperty, stationPosition, color, maxDistance) { function createConnection(viewer, satellitePositionProperty, stationPosition, color, maxDistance) {
return viewer.entities.add({ return viewer.entities.add({
...@@ -137,7 +137,57 @@ export class SpecifyConnectionType { ...@@ -137,7 +137,57 @@ export class SpecifyConnectionType {
}); });
this.connections = []; this.connections = [];
} else { } else {
this.useStatic(); this.useStaticLines();
}
this.visible = !this.visible;
}
// 连接方式为虚线
useDashedLine() {
// 创建连线函数
function createConnection(viewer, satellitePositionProperty, stationPosition, color, maxDistance) {
return viewer.entities.add({
polyline: {
positions: new Cesium.CallbackProperty((time) => {
const satellitePosition = satellitePositionProperty.getValue(time);
const distance = Cesium.Cartesian3.distance(satellitePosition, stationPosition);
if (distance > maxDistance) {
return []; // 返回空数组隐藏连线
}
return [satellitePosition, stationPosition];
}, false),
width: 1.5,
material: new Cesium.PolylineDashMaterialProperty({
color: color,
dashLength: 16
})
}
});
}
// 获取测站位置
const stationOnePosition = Cesium.Cartesian3.fromDegrees(...this.stationOne.position);
const stationTwoPosition = Cesium.Cartesian3.fromDegrees(...this.stationTwo.position);
const stationThreePosition = Cesium.Cartesian3.fromDegrees(...this.stationThree.position);
// 最大连接显示距离
const maxDistance = 5000000;
// 创建连线
this.connections.push(createConnection(this.viewer, this.satelliteEntity.position, stationOnePosition, Cesium.Color.BLUE, maxDistance));
this.connections.push(createConnection(this.viewer, this.satelliteEntity.position, stationTwoPosition, Cesium.Color.GREEN, maxDistance));
this.connections.push(createConnection(this.viewer, this.satelliteEntity.position, stationThreePosition, Cesium.Color.YELLOW, maxDistance));
}
// 切换虚线的显示和隐藏
toggleDashedLine() {
if (this.visible) {
this.connections.forEach(connection => {
this.viewer.entities.remove(connection);
});
this.connections = [];
} else {
this.useDashedLine();
} }
this.visible = !this.visible; this.visible = !this.visible;
} }
......
<template> <template>
<div id="cesiumContainer" class="cesium-container"></div> <div id="cesiumContainer" class="cesium-container"></div>
<div> <div class="btn-class">
<button class="btn-class" @click="createConnections">静态线</button> <button>多个起点的脉冲线</button>
<button>圆锥</button>
<button>脉冲圆锥</button>
<button>一个脉冲的线</button>
<button @click="StaticLines">静态线</button>
<button @click="DashedLine">虚线</button>
</div> </div>
</template> </template>
...@@ -93,9 +98,15 @@ onMounted(() => { ...@@ -93,9 +98,15 @@ onMounted(() => {
document.head.appendChild(link); document.head.appendChild(link);
}); });
function createConnections() { // 连接方式为静态线类方法的调用
function StaticLines() {
satellite.toggleStaticLines(); satellite.toggleStaticLines();
} }
// 连接方式为虚线类方法的调用
function DashedLine() {
satellite.toggleDashedLine();
}
</script> </script>
<style> <style>
......
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