suzhou-jichuang-lanhai
/
uav-flight-control
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

地图点位图标类型区分

Browse Source
main
许宏杰 2 months ago
parent 36bbef1ca6
commit 30e07b54e2
6 changed files with 329 additions and 238 deletions
Show Stats Download Patch File Download Diff File

BIN
src/assets/images/marker-park.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB

BIN
src/assets/images/marker-school.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

0
src/assets/images/default-icon.png → src/assets/images/marker-uav.png
Unescape View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 5.4 KiB

After

Width:  |  Height:  |  Size: 5.4 KiB

63
src/assets/styles/marsMap.scss
Unescape View File

@ -4,30 +4,65 @@
color: #ffffff;
font-weight: 600;
text-shadow: 1px 1px 0px #000000;
background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(89, 249, 255, 1));
border: 1px solid #59F9FF;
padding: 3px 13px;
letter-spacing: 2px;
border-radius: 14px;
}
.color-uav{
background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(34, 232, 174, 1));
border: 1px solid #22E8AE;
&:after{
content: "";
position: absolute;
bottom: -73px;
left: calc(50% - 2px);
display: block;
width: 3px;
height: 70px;
border-right: 3px solid #22E8AE;
}
}
.color-school{
background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(89, 249, 255, 1));
border: 1px solid #59F9FF;
&:after{
content: "";
position: absolute;
bottom: -73px;
left: calc(50% - 2px);
display: block;
width: 3px;
height: 70px;
border-right: 3px solid #59F9FF;
}
}
.color-park{
background: linear - gradient(to bottom, rgba(135, 206, 235, 0.1), rgba(51, 224, 100, 1));
border: 1px solid #33E064;
&:after{
content: "";
position: absolute;
bottom: -73px;
left: calc(50% - 2px);
display: block;
width: 3px;
height: 70px;
border-right: 3px solid #33E064;
}
}
.marker-icon{
display: block;
margin: auto;
margin-top:5px;
width: 40px;
height: 60px;
background: url('../images/default-icon.png');
background-size: 100% 100%;
}
}
.div-marker:after{
content: "";
position: absolute;
bottom: -73px;
left: calc(50% - 2px);
display: block;
width: 3px;
height: 70px;
border-right: 3px solid #2bcdbb;
}

34
src/views/components/map/marsMap.vue
Unescape View File

@ -68,8 +68,13 @@ const params = reactive({
speed: 500,
});
let isGamepad = false;
// 使用 import.meta.glob 动态导入本地图片
const imageModules = import.meta.glob('@/assets/images/*.png', { eager: true });
// 获取图片路径
const imageUrls = Object.values(imageModules).map((module) => module.default);
let isGamepad = false;
let map = null;
let list = [];
let uav = null;
@ -99,9 +104,9 @@ onMounted(()=>{
*/
const onAddGamepadboardListener = () => {
window.addEventListener("gamepadconnected", function (e) {
var gp = navigator.getGamepads()[e.gamepad.index];
// var gp = navigator.getGamepads()[e.gamepad.index];
proxy.$modal.msgSuccess("手柄控制已启动");
// 获取无人机最后的信息
// 获取无人机固定航线最后的信息
const uavItem = mapLayer.uav.getGraphicById('uav1');
const {heading,pitch,roll,position } = uavItem
const cartographic = mars3d.LngLatPoint.fromCartesian(position)
@ -131,9 +136,9 @@ const boostrapUav = () => {
// // 绘制停机场矩形
// initRectangle();
// //渲染所有图标点
// initMarker();
initMarker();
//渲染无人机
initUav();
// initUav();
};
const startgamepad = () => {
@ -285,13 +290,13 @@ const initRectangle = () => {
* 渲染所有点位
*/
const initMarker = () => {
console.log(imageModules)
PointJson.map((item, index) => {
item.point = item.wz.split(",").map(Number);
// 绘制水波浪圆
circlePoint(item, index);
//绘制名字图标
lablePoint(item, index);
// 绘制水波浪圆
circlePoint(item, index);
});
};
@ -300,17 +305,18 @@ const initMarker = () => {
*/
const lablePoint = (item, index) => {
const markerDiv = new mars3d.graphic.DivGraphic({
position: item.wz.split(",").map(Number),
position: item.wz,
id: `marker${index}`,
name: item.name,
style: {
html: `
<div class="div-marker">
<div class="marker-name">${item.name}</div>
<div class="marker-icon"></div>
<div class="marker-name ${item.type == 'school' ? 'color-school' : item.type == 'park' ? 'color-park' :'color-uav' } ">${item.name}</div>
<img class="marker-icon" src="${item.type == 'school' ? imageUrls[5] : item.type == 'park' ? imageUrls[4] :imageUrls[6] }" />
</div>
`,
offsetY: -73,
clampToGround:true,
horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
distanceDisplayCondition: true, // 按视距距离显示
@ -325,13 +331,13 @@ const lablePoint = (item, index) => {
*/
const circlePoint = (item, index) => {
const graphic = new mars3d.graphic.CircleEntity({
position: item.point,
position: item.wz,
style: {
radius: 50,
height: 0,
materialType: mars3d.MaterialType.CircleWave,
materialOptions: {
color: "#59F9FF",
color: item.type == 'school' ? '#59F9FF' : item.type == 'park' ? '#33E064' : '#22E8AE',
count: 2,
speed: 6,
},

470
src/views/components/map/point.json
Unescape View File

@ -1,211 +1,261 @@
[
{
"name": "云航低空研训基地",
"wz": "120.657967,31.048193"
},
{
"name": "吴江公园",
"wz": "120.634741,31.155611"
},
{
"name": "江苏同里国家湿地公园",
"wz": "120.806956,31.157053"
},
{
"name": "胜地生态公园",
"wz": "120.650494,31.082684"
},
{
"name": "新湖郁金香公园",
"wz": "120.634291,31.183498"
},
{
"name": "潜龙渠公园",
"wz": "120.612246,30.909961"
},
{
"name": "芦墟大渠荡生态公园",
"wz": "120.852208,31.028415"
},
{
"name": "镜湖公园",
"wz": "120.675721,30.919475"
},
{
"name": "七都湿地公园",
"wz": "120.384969,30.953492"
},
{
"name": "芦荡湖湿地公园",
"wz": "120.640464,31.117824"
},
{
"name": "苏州湾体育公园",
"wz": "120.601284,31.115582"
},
{
"name": "震泽公园",
"wz": "120.500364,30.913989"
},
{
"name": "东太湖生态园",
"wz": "120.598503,31.148862"
},
{
"name": "汾湖公园",
"wz": "120.833018,31.009082"
},
{
"name": "黎里古镇公园",
"wz": "120.711281,30.988861"
},
{
"name": "平望文体活动中心",
"wz": "120.624934,30.972651"
},
{
"name": "同里古镇公园",
"wz": "120.723765,31.154999"
},
{
"name": "吴江实验小学教育集团太湖校区",
"wz": "120.629232,31.138336"
},
{
"name": "吴江实验小学教育集团爱德校区",
"wz": "120.63353,31.149451"
},
{
"name": "吴江实验小学教育集团城中校区",
"wz": "120.641363,31.163391"
},
{
"name": "吴江实验小学教育集团长安实验小学",
"wz": "120.65505,31.125751"
},
{
"name": "鲈乡实验小学教育集团仲英校区",
"wz": "120.631532,31.164911"
},
{
"name": "鲈乡实验小学教育集团越秀校区",
"wz": "120.628219,31.170382"
},
{
"name": "鲈乡实验小学教育集团流虹校区",
"wz": "120.635097,31.161342"
},
{
"name": "思贤实验小学",
"wz": "120.636957,31.127222"
},
{
"name": "苏大附属吴江学校",
"wz": "120.642029,31.092945"
},
{
"name": "松陵小学",
"wz": "120.644365,31.155881"
},
{
"name": "北门小学",
"wz": "120.648293,31.164774"
},
{
"name": "绣湖东路小学",
"wz": "120.696411,31.155009"
},
{
"name": "淞南路小学",
"wz": "120.666246,31.187018"
},
{
"name": "三淞路小学",
"wz": "120.665384,31.184736"
},
{
"name": "吉市路小学",
"wz": "120.671435,31.175657"
},
{
"name": "云龙实验学校",
"wz": "120.668912,31.148545"
},
{
"name": "苏州湾外国语学校",
"wz": "120.615709,31.113141"
},
{
"name": "实验初级中学",
"wz": "120.632518,31.14779"
},
{
"name": "青云实验中学",
"wz": "120.502819,30.827075"
},
{
"name": "苏州湾实验初级中学",
"wz": "120.60238,31.142594"
},
{
"name": "松陵第一中学",
"wz": "120.630625,31.167276"
},
{
"name": "金家坝中学",
"wz": "120.783595,31.089252"
},
{
"name": "平望中学",
"wz": "120.646572,30.981293"
},
{
"name": "桃源中学",
"wz": "120.48338,30.794556"
},
{
"name": "震泽中学",
"wz": "120.638371,31.124036"
},
{
"name": "吴江中学",
"wz": "120.606418,31.14296"
},
{
"name": "吴江盛泽中学",
"wz": "120.681466,30.891258"
},
{
"name": "吴江汾湖高级中学",
"wz": "120.850662,31.009218"
},
{
"name": "震泽中学育英学校",
"wz": "120.496718,30.909832"
},
{
"name": "苏州枫华学校",
"wz": "120.882975,31.052381"
},
{
"name": "苏州中学苏州湾学校",
"wz": "120.645367,31.076471"
},
{
"name": "吴江新教育学校",
"wz": "120.693969,31.157251"
},
{
"name": "苏州大学未来校区",
"wz": "120.666188,31.068729"
},
{
"name": "苏州信息职业技术学院",
"wz": "120.632702,31.135007"
},
{
"name": "吴江高级中学",
"wz": "120.645829,31.175176"
}
]
{
"name": "云航低空研训基地",
"wz":[120.657967,31.048193,100]
},
{
"name": "吴江公园",
"wz":[120.634741,31.155611,100] ,
"type": "park"
},
{
"name": "江苏同里国家湿地公园",
"wz":[120.806956,31.157053,100] ,
"type": "park"
},
{
"name": "胜地生态公园",
"wz":[120.650494,31.082684,100] ,
"type": "park"
},
{
"name": "新湖郁金香公园",
"wz":[120.634291,31.183498,100] ,
"type": "park"
},
{
"name": "潜龙渠公园",
"wz":[120.612246,30.909961,100] ,
"type": "park"
},
{
"name": "芦墟大渠荡生态公园",
"wz":[120.852208,31.028415,100] ,
"type": "park"
},
{
"name": "镜湖公园",
"wz":[120.675721,30.919475,100] ,
"type": "park"
},
{
"name": "七都湿地公园",
"wz":[120.384969,30.953492,100] ,
"type": "park"
},
{
"name": "芦荡湖湿地公园",
"wz":[120.640464,31.117824,100] ,
"type": "park"
},
{
"name": "苏州湾体育公园",
"wz":[120.601284,31.115582,100] ,
"type": "park"
},
{
"name": "震泽公园",
"wz":[120.500364,30.913989,100] ,
"type": "park"
},
{
"name": "东太湖生态园",
"wz":[120.598503,31.148862,100] ,
"type": "park"
},
{
"name": "汾湖公园",
"wz":[120.833018,31.009082,100] ,
"type": "park"
},
{
"name": "黎里古镇公园",
"wz":[120.711281,30.988861,100] ,
"type": "park"
},
{
"name": "平望文体活动中心",
"wz":[120.624934,30.972651,100] ,
"type": "park"
},
{
"name": "同里古镇公园",
"wz":[120.723765,31.154999,100] ,
"type": "park"
},
{
"name": "吴江实验小学教育集团太湖校区",
"wz":[120.629232,31.138336,100] ,
"type": "school"
},
{
"name": "吴江实验小学教育集团爱德校区",
"wz":[120.63353,31.149451,100] ,
"type": "school"
},
{
"name": "吴江实验小学教育集团城中校区",
"wz":[120.641363,31.163391,100] ,
"type": "school"
},
{
"name": "吴江实验小学教育集团长安实验小学",
"wz":[120.65505,31.125751,100] ,
"type": "school"
},
{
"name": "鲈乡实验小学教育集团仲英校区",
"wz":[120.631532,31.164911,100] ,
"type": "school"
},
{
"name": "鲈乡实验小学教育集团越秀校区",
"wz":[120.628219,31.170382,100] ,
"type": "school"
},
{
"name": "鲈乡实验小学教育集团流虹校区",
"wz":[120.635097,31.161342,100] ,
"type": "school"
},
{
"name": "思贤实验小学",
"wz":[120.636957,31.127222,100] ,
"type": "school"
},
{
"name": "苏大附属吴江学校",
"wz":[120.642029,31.092945,100] ,
"type": "school"
},
{
"name": "松陵小学",
"wz":[120.644365,31.155881,100] ,
"type": "school"
},
{
"name": "北门小学",
"wz":[120.648293,31.164774,100] ,
"type": "school"
},
{
"name": "绣湖东路小学",
"wz":[120.696411,31.155009,100] ,
"type": "school"
},
{
"name": "淞南路小学",
"wz":[120.666246,31.187018,100] ,
"type": "school"
},
{
"name": "三淞路小学",
"wz":[120.665384,31.184736,100] ,
"type": "school"
},
{
"name": "吉市路小学",
"wz":[120.671435,31.175657,100] ,
"type": "school"
},
{
"name": "云龙实验学校",
"wz":[120.668912,31.148545,100] ,
"type": "school"
},
{
"name": "苏州湾外国语学校",
"wz":[120.615709,31.113141,100] ,
"type": "school"
},
{
"name": "实验初级中学",
"wz":[120.632518,31.14779,100] ,
"type": "school"
},
{
"name": "青云实验中学",
"wz":[120.502819,30.827075,100] ,
"type": "school"
},
{
"name": "苏州湾实验初级中学",
"wz":[120.60238,31.142594,100] ,
"type": "school"
},
{
"name": "松陵第一中学",
"wz":[120.630625,31.167276,100] ,
"type": "school"
},
{
"name": "金家坝中学",
"wz":[120.783595,31.089252,100] ,
"type": "school"
},
{
"name": "平望中学",
"wz":[120.646572,30.981293,100] ,
"type": "school"
},
{
"name": "桃源中学",
"wz":[120.48338,30.794556,100] ,
"type": "school"
},
{
"name": "震泽中学",
"wz":[120.638371,31.124036,100] ,
"type": "school"
},
{
"name": "吴江中学",
"wz":[120.606418,31.14296,100] ,
"type": "school"
},
{
"name": "吴江盛泽中学",
"wz":[120.681466,30.891258,100] ,
"type": "school"
},
{
"name": "吴江汾湖高级中学",
"wz":[120.850662,31.009218,100] ,
"type": "school"
},
{
"name": "震泽中学育英学校",
"wz":[120.496718,30.909832,100] ,
"type": "school"
},
{
"name": "苏州枫华学校",
"wz":[120.882975,31.052381,100] ,
"type": "school"
},
{
"name": "苏州中学苏州湾学校",
"wz":[120.645367,31.076471,100] ,
"type": "school"
},
{
"name": "吴江新教育学校",
"wz":[120.693969,31.157251,100] ,
"type": "school"
},
{
"name": "苏州大学未来校区",
"wz":[120.666188,31.068729,100] ,
"type": "school"
},
{
"name": "苏州信息职业技术学院",
"wz":[120.632702,31.135007,100] ,
"type": "school"
},
{
"name": "吴江高级中学",
"wz":[120.645829,31.175176,100] ,
"type": "school"
}
]
Write Preview
Loading…
Cancel
Save