zhufu 2 months ago
commit a4bb67344d

@ -340,6 +340,14 @@
createMessage.error('DRC连接失败状态码' + rs.data.result);
}
}
//
if (rs.method == 'fly_to_point') {
if (rs.data.result == 0) {
createMessage.success('指点飞行成功');
} else {
createMessage.error('指点飞行失败,状态码' + rs.data.result);
}
}
});
});
onUnmounted(() => {

@ -10,20 +10,20 @@
<div class="content-edit">
目标点纬度
<div style="display: flex; flex-direction: column; align-items: center">
<a-input v-model:value="data.points.latitude" readonly />
<a-input v-model:value="data.points[0].latitude" readonly />
<span style="margin-top: 4px; font-size: 12px; color: #f2762d">地图右键选择目标点</span>
</div>
</div>
<div class="content-edit">
目标点经度
<div>
<a-input v-model:value="data.points.longitude" readonly />
<a-input v-model:value="data.points[0].longitude" readonly />
</div>
</div>
<div class="content-edit">
目标点高度
<div>
<a-input v-model:value="data.points.height" />
<a-input v-model:value="data.points[0].height" />
</div>
</div>
<div class="content-button">
@ -57,13 +57,15 @@
});
const data = reactive({
flight_id: buildGUID(),
fly_to_id: buildGUID(),
max_speed: 10,
points: {
latitude: 35.134615,
longitude: 118.296676,
height: 115,
},
points: [
{
latitude: 35.134615,
longitude: 118.296676,
height: 115,
},
],
});
const takeOff = () => {
const querys = {
@ -87,8 +89,8 @@
onMounted(() => {
//
EventBus.on('obtainTheLocation', (val: any) => {
data.points.latitude = val.lat;
data.points.longitude = val.lng;
data.points[0].latitude = val.lat;
data.points[0].longitude = val.lng;
});
});
</script>

@ -22,8 +22,12 @@
<div class="content-button">
<a-button @click="obtain"></a-button>
<a-button @click="singleShot"></a-button>
<a-button @click="enterDRC"></a-button>
<a-button @click="exitDRC">退</a-button>
<a-button @click="enterDRC" style="background-color: #24d365; border: none"
>进入飞行控制</a-button
>
<a-button @click="exitDRC" style="background-color: #e3150e; border: none"
>退出飞行控制</a-button
>
</div>
<div class="direction-controller">
<img src="@/assets/images/flightoperation/direction_controller.png" alt="" />

@ -45,12 +45,13 @@ watch(
const emits = defineEmits(["exitDraw","flyToThere"])
const airPoints = ref([])
const currentAirPoint = ref({});
const airPointConfigShow = ref(false);
//
let moveTool:mars3d.thing.MatrixMove2;
//
watch(
currentAirPoint,
@ -84,12 +85,23 @@ let polygonGraphicLayer:mars3d.layer.GraphicLayer;
let polygonLineGraphicLayer:mars3d.layer.GeoJsonLayer;
//
let stickGroundPointLayer:mars3d.layer.GraphicLayer;
// 线
let lineGroundPointLayer:mars3d.layer.GraphicLayer;
let graphic = null;
const exitDraw = () => {
//
graphicLayer ? graphicLayer.clear() : null;
stickGroundPointLayer ? stickGroundPointLayer.clear() : null;
lineGroundPointLayer ? lineGroundPointLayer.clear() : null;
polygonGraphicLayer ? polygonGraphicLayer.clear() : null;
polygonLineGraphicLayer ? polygonLineGraphicLayer.clear() : null;
airPoints.value = [];
@ -136,7 +148,7 @@ const initMap = ()=>{
map = new mars3d.Map(vChartRef.value,
{
"scene": {
"center": {"lat":35.134762,"lng":118.295245,"alt":953.2,"heading":360,"pitch":-60},
"center": {"lat":35.132103,"lng":118.296315,"alt":260.9,"heading":357.9,"pitch":-32},
"scene3DOnly": false,
"shadows": false,
"removeDblClick": true,
@ -363,7 +375,41 @@ const initMap = ()=>{
})
graphicLayer.bindContextMenu([
{
text: "按轴平移",
icon: "fa fa-pencil",
callback: (event) => {
const graphic = event.graphic
let id = event.graphic.options.id;
if(moveTool){
return null;
}
//
moveTool = new mars3d.thing.MatrixMove2({
position: graphic.position,
})
map.addThing(moveTool)
moveTool.on(mars3d.EventType.change, (event) => {
graphic.position = event.position
pointMove(event,id);
})
}
},
{
text: "停止平移",
icon: "fa fa-pencil",
callback: (event) => {
const graphic = event.graphic
if(moveTool){
map.removeThing(moveTool);
moveTool.destroy();
moveTool = null;
console.log("moveTool",moveTool);
}
}
}, {
text: "删除",
icon: "fa fa-camera-retro", // font-class
callback: (e) => {
@ -373,6 +419,19 @@ const initMap = ()=>{
])
map.addLayer(graphicLayer);
//
stickGroundPointLayer = new mars3d.layer.GraphicLayer({
isAutoEditing: false //
})
map.addLayer(stickGroundPointLayer);
// 线
lineGroundPointLayer = new mars3d.layer.GraphicLayer({
isAutoEditing: false //
})
map.addLayer(lineGroundPointLayer);
// 线
graphicLayer.on(mars3d.EventType.click,(e)=>{
@ -433,12 +492,17 @@ const uavPoints = ref([]);
//
const handlerDrawPoint = (e) => {
if(moveTool){
moveTool.destroy();
moveTool = null;
}
let position = mars3d.LngLatPoint.fromCartesian(e.position);
let uuid = buildUUID();
//
const graphic = new mars3d.graphic.BillboardEntity({
let graphic = new mars3d.graphic.BillboardEntity({
id:uuid,
name: "航点",
position: [position._lng,position._lat,position._alt],
@ -457,34 +521,59 @@ const handlerDrawPoint = (e) => {
}
},
})
graphicLayer.addGraphic(graphic)
uavPoints.value.push(graphic);
//
const rectSensor = new mars3d.graphic.RectSensor({
id: "camera"+uuid,
position: [position._lng,position._lat,position._alt],
show:true,
//
let stickGraphic = new mars3d.graphic.PointEntity({
id:"stick"+uuid,
position: [position._lng,position._lat],
style: {
angle1: 30, // 1
angle2: 30, // 2
length: 10, //
rayEllipsoid: false,
color: "rgba(0,255,255,0.3)",
color: "#f5f5f5",
pixelSize: 8,
outline: true,
topShow: true,
topSteps: 2,
flat: true,
cameraHpr: true,
heading: 0,
pitch: 90, // 0 - 360
roll: 0,
outlineColor: "#f5f5f5",
outlineWidth: 1,
clampToGround:true,
}
})
graphicLayer.addGraphic(rectSensor)
stickGroundPointLayer.addGraphic(stickGraphic);
// 线
let lineGraphic = new mars3d.graphic.PolylineEntity({
id:"line"+uuid,
positions: [[position._lng,position._lat,position._alt], [position._lng,position._lat,0]],
style: {
color: '#f5f5f5',
width: 1,
},
});
lineGroundPointLayer.addGraphic(lineGraphic);
//
// const rectSensor = new mars3d.graphic.RectSensor({
// id: "camera"+uuid,
// position: [position._lng,position._lat,position._alt],
// show:true,
// style: {
// angle1: 30, // 1
// angle2: 30, // 2
// length: 10, //
// rayEllipsoid: false,
// color: "rgba(0,255,255,0.3)",
// outline: true,
// topShow: true,
// topSteps: 2,
// flat: true,
// cameraHpr: true,
// heading: 0,
// pitch: 90, // 0 - 360
// roll: 0,
// }
// })
// graphicLayer.addGraphic(rectSensor);
//
let airPointInfo = {
id:uuid,
name:"航点",
@ -496,17 +585,61 @@ const handlerDrawPoint = (e) => {
cameraVerticalAngle:0,
focalLength:0,
}
airPoints.value?.push(airPointInfo);
uavPoints.value.push(graphic);
//
currentAirPoint.value = airPoints.value[airPoints.value?.length-1]
// 线
handlerDrawLine();
}
graphicLayer.addGraphic(graphic)
//
const pointMove = (e,id)=>{
const cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.position);
const longitude = mars3d.Cesium.Math.toDegrees(cartographic.longitude);
const latitude = mars3d.Cesium.Math.toDegrees(cartographic.latitude);
const height = cartographic.height; //
let stickGraphic = stickGroundPointLayer.getGraphicById("stick"+id);
if(stickGraphic){
stickGraphic.setOptions({
position: [longitude,latitude],
style: {
color: "#f5f5f5",
pixelSize: 8,
outline: true,
outlineColor: "#f5f5f5",
outlineWidth: 1,
clampToGround:true,
}
})
}
let lineGraphic = lineGroundPointLayer.getGraphicById("line"+id);
if(lineGraphic){
lineGraphic.setOptions({
positions: [[longitude,latitude,height], [longitude,latitude,0]],
style: {
color: '#f5f5f5',
width: 1,
},
})
}
//
airPoints.value?.forEach((item,index)=>{
if(item.id == id){
airPoints.value[index].lng = longitude;
airPoints.value[index].lat = latitude;
airPoints.value[index].alt = height;
}
})
// 线
handlerDrawLine();
}
// 线
const handlerDrawLine = () => {
@ -523,7 +656,7 @@ const handlerDrawLine = () => {
positions.unshift([startPosition.value[0],startPosition.value[1],startPosition.value[2]]);
//
if(positions.length>0){
if(positions.length>1){
let lineGraphic = graphicLayer.getGraphicById("pointsLine");
if(lineGraphic){
@ -842,9 +975,9 @@ const CalculateAreaInfo = (polygon,lines)=>{
//
const updateAirPoint = (e)=>{
// idgraphic
let graphic = graphicLayer.getGraphicById(e.id);
//
let graphic = graphicLayer.getGraphicById(e.id);
if(graphic){
graphic.setOptions({
id:e.id,
@ -867,8 +1000,35 @@ const updateAirPoint = (e)=>{
})
}
let cameraGraphic = graphicLayer.getGraphicById('camera'+e.id);
//
let stickGraphic = stickGroundPointLayer.getGraphicById("stick"+e.id);
if(stickGraphic){
stickGraphic.setOptions({
position: [e.lng,e.lat],
style: {
color: "#f5f5f5",
pixelSize: 8,
outline: true,
outlineColor: "#f5f5f5",
outlineWidth: 1,
clampToGround:true,
}
})
}
// 线
let lineGraphic = lineGroundPointLayer.getGraphicById("line"+e.id)
if(lineGraphic){
lineGraphic.setOptions({
positions: [[e.lng,e.lat,e.alt], [e.lng,e.lat,0]],
style: {
color: '#f5f5f5',
width: 1,
},
})
}
let cameraGraphic = graphicLayer.getGraphicById('camera'+e.id);
if(cameraGraphic){
cameraGraphic.setOptions({
position: [e.lng,e.lat,e.alt],
@ -893,6 +1053,7 @@ const updateAirPoint = (e)=>{
// }
})
}
// 线
handlerDrawLine()
}
@ -929,9 +1090,10 @@ const deleteAirPoint = (e)=>{
}
let stickGraphicLayer:mars3d.layer.GraphicLayer;
let moveTool:mars3d.thing.MatrixMove2;
//
const flyToThere = (e) => {
@ -955,13 +1117,13 @@ const flyToThere = (e) => {
moveTool = new mars3d.thing.MatrixMove2({
position: graphic.position,
})
map.addThing(moveTool)
moveTool.on(mars3d.EventType.change, (event) => {
graphic.position = event.position
uavGraphicMove(event);
})
map.addThing(moveTool)
}
},
{
@ -974,6 +1136,13 @@ const flyToThere = (e) => {
moveTool = null;
}
}
},
{
text: "删除",
icon: "fa fa-camera-retro", // font-class
callback: (e) => {
deleteFlyToThere(e);
}
}
])
@ -1057,7 +1226,7 @@ const flyToThere = (e) => {
// 线
const connectLine = new mars3d.graphic.PolylineEntity({
let connectLine = new mars3d.graphic.PolylineEntity({
id:"flytothere-line",
positions: [[position._lng,position._lat,position._alt], [position._lng,position._lat,0]],
style: {
@ -1066,9 +1235,6 @@ const flyToThere = (e) => {
},
});
uavGraphicLayer.addGraphic(graphic);
stickGraphicLayer.addGraphic(stickGraphic);
uavGraphicLayer.addGraphic(connectLine);
@ -1115,12 +1281,39 @@ const stickGraphicMove = (e) => {
}
}
//
const deleteFlyToThere = (e) =>{
let id = e.graphic.id;
let uavGraphic = uavGraphicLayer.getGraphicById(id);
if(uavGraphic){
uavGraphicLayer.removeGraphic(uavGraphic);
}
let lineGraphic = uavGraphicLayer.getGraphicById("flytothere-line");
if(lineGraphic){
uavGraphicLayer.removeGraphic(lineGraphic);
}
let stickGraphic = stickGraphicLayer.getGraphicById("flytothere-stick");
if(stickGraphic){
stickGraphicLayer.removeGraphic(stickGraphic);
}
if(moveTool){
moveTool.destroy();
moveTool = null;
}
emits("flyToThere",{_lng:null,_lat:null,_alt:null})
}
//
const uavGraphicMove = (e) => {
const cartographic = mars3d.Cesium.Cartographic.fromCartesian(e.position);
//
const longitude = mars3d.Cesium.Math.toDegrees(cartographic.longitude);
const latitude = mars3d.Cesium.Math.toDegrees(cartographic.latitude);

Loading…
Cancel
Save