From e7c6c4eecddae9515b0cd1be68335690843df3d1 Mon Sep 17 00:00:00 2001
From: liuyg <liuyg@qq.com>
Date: Wed, 02 Mar 2022 15:19:23 +0800
Subject: [PATCH] +自定义标签的添加和删除
---
src/store/modules/mobile.js | 229 +++++++++++++++++++++++++++++++++++++++++----------------
1 files changed, 164 insertions(+), 65 deletions(-)
diff --git a/src/store/modules/mobile.js b/src/store/modules/mobile.js
index d747e5a..831c8f3 100644
--- a/src/store/modules/mobile.js
+++ b/src/store/modules/mobile.js
@@ -46,6 +46,12 @@
tilesetLayer: null, //2.5d模型
usetowpointfive: null,
tilesetLayer: null, //瀑布流
+ areaLayer: null, //2.5d事件--绿色图层
+ select: {
+ //绿色图层控制显示
+ overlay: undefined,
+ color: undefined,
+ },
vecLayer: null, //3D底图
cvaLayer: null, //3D底图
@@ -62,10 +68,14 @@
isendPosition: false, //传送终点经纬度--感应数据
routerS: [], //所有路径
choiceRouterS: 0, //当前选择路径
+
showActivity: false, //是否显示活动弹窗
+ showActivityData: {}, //活动内容
drawALineLayerMany: null, //活动路线图层
+ drawAPointLayerMany: null, //活动点图层
isOpenDrawALineMany: null, //是否开启活动
+ seeRight: true, //右侧控制栏显影
},
mutations: {
MSET_VIEWER(state, viewer) {
@@ -177,6 +187,7 @@
state.tilesetLayer.show = true; //显示3d图形
state.startPointFn(); //移动默认视角
// state.mviewer.flyTo(state.tileset);
+ state.areaLayer.show = false; //绿布
//3D视角不限制
state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80;
@@ -193,11 +204,15 @@
// 视角旋转
state.mviewer.scene.screenSpaceCameraController.enableTilt = true;
} else if (data == "2.5D") {
+ console.log("2.5");
state.dimensionData = {
// 维度镜头数据
heading: 0,
pitch: -90,
roll: 0,
+ // heading: global.DC.Namespace.Cesium.Math.toRadians(-9),
+ // pitch: global.DC.Namespace.Cesium.Math.toRadians(-34.54),
+ // roll: 0,
};
//取消3D底图
state.mviewer.imageryLayers.remove(state.vecLayer);
@@ -208,13 +223,13 @@
state.newLayer = state.usetowpointfive(); //添加2.5d图形贴片
state.wallLayer.show = false; //打开瀑布
state.startPointFn(); //移动默认视角
-
+ state.areaLayer.show = true; //绿布
//2.5D视角限制
- state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 0;
+ state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80;
// 最大
- state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = 4000;
+ state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = 200;
// 设置相机缩小时的速率
- // state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 30000;
+ state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 2000;
// 设置相机放大时的速率
state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000;
// 视角平移
@@ -224,6 +239,10 @@
// 视角旋转
state.mviewer.scene.screenSpaceCameraController.enableTilt = false;
}
+ },
+ //绿布
+ MSET_areaLayer(state, data) {
+ state.areaLayer = data;
},
//切换控制
MSET_PERSPECTIVECONTROL(state, data) {
@@ -283,6 +302,15 @@
state.drawALineLayerMany = null;
state.isOpenDrawALineMany = false;
}
+ if (state.drawAPointLayerMany) {
+ state.drawAPointLayerMany.remove();
+ state.drawAPointLayerMany = null;
+ state.isOpenDrawALineMany = false;
+ }
+ },
+ //显影线路或者点
+ showLineOrPoint(state, val) {
+ state[val.layer].show = val.flag;
},
//传送终点数据
set_endPosition(state, data) {
@@ -296,6 +324,20 @@
//活动窗口是否显示
set_showActivity(state, data) {
state.showActivity = data;
+ if (data.state) {
+ state.showActivityData = data.value;
+ state.showActivity = data.state;
+ } else {
+ state.showActivityData = {};
+ state.showActivity = data.state;
+ }
+ },
+ mset_changeSelect(state, data) {
+ state.select.overlay = data[0];
+ state.select.color = data[1];
+ },
+ SET_SeeAndNotSee(state, data) {
+ state.seeRight = data;
},
},
actions: {
@@ -396,8 +438,24 @@
0,
state.dimensionData.pitch
);
+ if (!state.MobileWindowsHide) {
+ //关闭弹窗
+ commit("MSET_MOBILEWINDOWSHIDE", true);
+ }
+ if (
+ state.select.overlay != undefined &&
+ data.query.fromTo != "mapClick"
+ ) {
+ //关闭绿色边框
+ state.select.overlay.setStyle({
+ material: state.select.color,
+ outline: false,
+ });
+ commit("mset_changeSelect", [undefined, undefined]);
+ }
// console.log(state.dimension);
if (state.dimension != "2.5D") {
+ // if (true) {
// if (true) {
dispatch("mapFlyTo", {
//飞入
@@ -407,33 +465,41 @@
roll: Position.roll,
});
} else {
- state.mviewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- // 114.0351,
- // 27.6314,
- // 200.0
- Position.lng - 0.012,
- Position.lat,
- Position.alt || 15000.0
- ),
- orientation: {
- heading: global.DC.Namespace.Cesium.Math.toRadians(
- Position.heading
- ),
- pitch: global.DC.Namespace.Cesium.Math.toRadians(Position.pitch),
- // heading: data.heading,
- // pitch: data.pitch,
- roll: Position.roll,
- },
+ dispatch("mapFlyTo", {
+ //飞入
+ lntLat: [Position.lng, +Position.lat - 0.0003, 160],
+ heading: Position.heading,
+ pitch: Position.pitch,
+ roll: Position.roll,
});
- commit("MSET_MOBILEWINDOWSHIDE", false); // 显示弹窗
+ // state.mviewer.camera.setView({
+ // // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ // destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ // // 114.0351,
+ // // 27.6314,
+ // // 200.0
+ // Position.lng - 0.012,
+ // Position.lat - 0.0003,
+ // Position.alt || 15000.0
+ // ),
+ // orientation: {
+ // heading: global.DC.Namespace.Cesium.Math.toRadians(
+ // Position.heading
+ // ),
+ // pitch: global.DC.Namespace.Cesium.Math.toRadians(Position.pitch),
+ // // heading: data.heading,
+ // // pitch: data.pitch,
+ // roll: Position.roll,
+ // },
+ // });
+ // commit("MSET_MOBILEWINDOWSHIDE", false); // 显示弹窗
}
// })
commit("MSET_POPUPDOM", popupsDom);
},
closeMobileWindowsDom({ state, commit, dispatch }) {
+ commit("CLOSE_NOWPOSITION"); //中断定位获取
if (!state.MobileWindowsHide && state.popupsDom) {
state.popupsDom.closeOur();
commit("MSET_MOBILEWINDOWSHIDE", true);
@@ -501,7 +567,7 @@
// 自定义回调
setTimeout(() => {
data.fn();
- }, 500);
+ }, 200);
}
if (!data.noOpen) {
setTimeout(() => {
@@ -759,7 +825,8 @@
commit("removerPolyLineIcon");
state.drawALineLayerIcon = new global.DC.VectorLayer("pointLayer");
state.mviewer.addLayer(state.drawALineLayerIcon);
- let post = Str.split(";")[0].split(",");
+ let useStr = Str.split(";");
+ let post = useStr[useStr.length - 1].split(",");
let position = new global.DC.Position(post[0], post[1]);
let billboard = new global.DC.Billboard(
position,
@@ -778,7 +845,12 @@
let windowData = {
position,
lntLat,
- query: { ...(value[1] || {}), position, lntLat },
+ query: {
+ ...(value[1] || {}),
+ position,
+ lntLat,
+ notAddGoOn: "notAddGoOn",
+ },
useJWD: true, //仅使用经纬度
};
dispatch("setMobileWindows", windowData);
@@ -801,6 +873,7 @@
//检查是否存在路线
commit("removePolylineMany");
commit("removePolyline");
+ commit("removerPolyLineIcon");
let Strs = value[0];
let red = global.DC.Namespace.Cesium.Color.fromCssColorString("#FF0000");
let white = global.DC.Namespace.Cesium.Color.fromCssColorString("#fff");
@@ -810,18 +883,20 @@
speed: 10,
});
let material1 = new global.DC.PolylineImageTrailMaterialProperty({
- color: global.DC.Color(255, 0, 0),
+ color: red,
speed: 60,
image: "img/icon/right.png",
repeat: { x: 320, y: 1 },
});
let drawALineLayerMany = new global.DC.VectorLayer("manyLinePointLayer");
state.mviewer.addLayer(drawALineLayerMany);
+ let drawAPointLayerMany = new global.DC.HtmlLayer("manyPointPointLayer");
+ state.mviewer.addLayer(drawAPointLayerMany);
//多条线
for (let k in Strs) {
let polyline = new global.DC.Polyline(Strs[k].value); //加入绘画点
polyline.setStyle({
- width: 3,
+ width: 6,
material: material1,
clampToGround: true,
});
@@ -846,44 +921,67 @@
let post = point[k].value;
let position = new global.DC.Position(post[0], post[1]);
- let billboard = new global.DC.Billboard(
+ // let billboard = new global.DC.Billboard(
+ // position,
+ // // "img/dingwei/dingwei1.png"
+ // "img/icon/activity.png"
+ // ); //加入绘画点
+ // billboard.setStyle({
+ // pixelOffset: { x: 0, y: -17 }, //偏移像素
+ // });
+ // //订阅事件
+ // billboard.on(global.DC.MouseEventType.CLICK, (e) => {
+ // // console.log(e);
+ // // return;
+ // // 定制化窗体
+ // let position = e.position,
+ // lntLat = [e.overlay._position._lng, e.overlay._position._lat];
+ // let windowData = {
+ // position,
+ // lntLat,
+ // query: {
+ // ...(value[2] || {}),
+ // position,
+ // lntLat,
+ // notAddGoOn: "notAddGoOn",
+ // },
+ // useJWD: true, //仅使用经纬度
+ // };
+ // dispatch("setMobileWindows", windowData);
+ // });
+ // drawALineLayerMany.addOverlay(billboard);
+ // let Labels = new global.DC.Label(position, point[k].name);
+ // Labels.setStyle({
+ // font: "16px sans-serif", // CSS 字体设置
+ // scale: 1, //比例
+ // fillColor: white, //文字颜色
+ // showBackground: true, //是否显示背景
+ // backgroundColor: blue, //背景颜色
+ // // outlineColor: white, //边框颜色
+ // // outlineWidth: 1, //边框大小，
+ // pixelOffset: { x: 0, y: -47 }, //偏移像素
+ // });
+ let Labels = new global.DC.DivIcon(
+ // new this.DC.Position(Number(item[0]), Number(item[1]), 0),
position,
- "img/dingwei/dingwei1.png"
- ); //加入绘画点
- billboard.setStyle({
- pixelOffset: { x: 0, y: -17 }, //偏移像素
- });
- //订阅事件
- billboard.on(global.DC.MouseEventType.CLICK, (e) => {
- // console.log(e);
- // return;
- // 定制化窗体
- let position = e.position,
- lntLat = [e.overlay._position._lng, e.overlay._position._lat];
- let windowData = {
- position,
- lntLat,
- query: { ...(value[2] || {}), position, lntLat },
- useJWD: true, //仅使用经纬度
- };
- dispatch("setMobileWindows", windowData);
- });
- drawALineLayerMany.addOverlay(billboard);
- let Labels = new global.DC.Label(position, point[k].name);
- Labels.setStyle({
- font: "16px sans-serif", // CSS 字体设置
- scale: 1, //比例
- fillColor: white, //文字颜色
- showBackground: true, //是否显示背景
- backgroundColor: blue, //背景颜色
- // outlineColor: white, //边框颜色
- // outlineWidth: 1, //边框大小，
- pixelOffset: { x: 0, y: -47 }, //偏移像素
- });
+ `
+ <div class="point-entitys-box">
+ <div class="point-logo">
+ <img src="/img/icon/activity.png">
+ </div>
+ <div class="point-title">
+ ${point[k].name}
+ </div>
+ </div>
+ `
+ );
//订阅事件
Labels.on(global.DC.MouseEventType.CLICK, (e) => {
// console.log(e);
// return;
+ if (value[3]) {
+ value[3]();
+ }
// 定制化窗体
let position = e.position,
lntLat = [e.overlay._position._lng, e.overlay._position._lat];
@@ -895,11 +993,12 @@
};
dispatch("setMobileWindows", windowData);
});
- drawALineLayerMany.addOverlay(Labels);
+ drawAPointLayerMany.addOverlay(Labels);
// console.log(point[k]);
}
state.drawALineLayerMany = drawALineLayerMany;
- state.isOpenDrawALineMany = value[2].name ? value[2].name : true;
+ state.drawAPointLayerMany = drawAPointLayerMany;
+ // state.isOpenDrawALineMany = value[2].name ? value[2].name : true;
// commit("cameraSetView", state.navigationStartLngLat); //移动
},
},
--
Gitblit v1.9.3