pointPositionOperate(e, 'color')" />
+
+ 经度:
+ pointPositionOperate(e, 'lng')"
+ />
+
+
+ 纬度:
+ pointPositionOperate(e, 'lat')"
+ />
+
+
半径:{{ formData.radius ? formData.radius : 0 }}米
({
scene: {
- center: { lat: 14.029537, lng: 105.94238, alt: 4879779, heading: 0, pitch: -66 }
+ center: { lat: 26.502888, lng: 106.174716, alt: 1961.1, heading: 25.1, pitch: -50 }
},
control: {
baseLayerPicker: false, // basemaps底图切换按钮
@@ -342,6 +363,7 @@ const pointPositionOperate = (e: any, label: any) => {
},
clampToGround: true // 是否贴地
};
+ graphic.position = new mars3d.LngLatPoint(formData.value.lng, formData.value.lat, formData.value.alt);
graphic.setStyle(loadJson);
}
console.log(777);
@@ -563,13 +585,13 @@ const initMars3d = async (option: any) => {
formData.value.lat = event.target.point.lat;
formData.value.alt = event.target.point.alt;
formData.value.radius = event.target.radius;
- let loadJson = {
- position: new mars3d.LngLatPoint(formData.value.lng, formData.value.lat, formData.value.alt),
- style: {
- radius: formData.value.radius
- }
- };
- graphic.setStyle(loadJson);
+ // let loadJson = {
+ // position: new mars3d.LngLatPoint(formData.value.lng, formData.value.lat, formData.value.alt),
+ // style: {
+ // radius: formData.value.radius
+ // }
+ // };
+ // graphic.setStyle(loadJson);
});
// 开启编辑状态
graphic.startEditing();
@@ -650,7 +672,7 @@ const initMars3d = async (option: any) => {
});
console.log(graphic);
graphicLayer.addGraphic(graphic);
- graphic.flyTo();
+ graphic.flyTo({ minHeight: 2000 });
}, 200);
}
if (props.type == "模型") {
diff --git a/src/views/goverment/frontLargeScreen/index.vue b/src/views/goverment/frontLargeScreen/index.vue
index 1d5b36b..3678fe8 100644
--- a/src/views/goverment/frontLargeScreen/index.vue
+++ b/src/views/goverment/frontLargeScreen/index.vue
@@ -529,6 +529,7 @@ const loadModel = async () => {
map.setCameraViewList(viewPoints, {
complete: () => {
flyOperateShow.value = false;
+ // map.setCameraViewList(viewPoints)
}
});
flyOperateShow.value = true;
diff --git a/src/views/goverment/largeScreen/components/flyViewBookmark.vue b/src/views/goverment/largeScreen/components/flyViewBookmark.vue
index dd37cc3..7df8db5 100644
--- a/src/views/goverment/largeScreen/components/flyViewBookmark.vue
+++ b/src/views/goverment/largeScreen/components/flyViewBookmark.vue
@@ -51,20 +51,23 @@ const getConfig = async () => {
const { result } = await getSystemConfig(requestData);
console.log(result, "6666666");
if (result) {
- bookMarkId.value = result.configId;
- let arr = JSON.parse(result.configValue);
- if (arr && arr.length > 0) {
- console.log("历史数据", arr);
- for (let i = 0; i < arr.length; i++) {
- const item = arr[i];
- // 删除未匹配项
- // if (listArr.value[0].img === "") {
- // formState.imgObject.splice(0, 1)
- // formState.found = true
- // }
- listArr.value.push(item);
+ if (listArr.value.length == 0 && !bookMarkId.value) {
+ // 处理特殊情况,当没数据时再进行赋值,有数据时只取Id
+ let arr = JSON.parse(result.configValue);
+ if (arr && arr.length > 0) {
+ console.log("历史数据", arr);
+ for (let i = 0; i < arr.length; i++) {
+ const item = arr[i];
+ // 删除未匹配项
+ // if (listArr.value[0].img === "") {
+ // formState.imgObject.splice(0, 1)
+ // formState.found = true
+ // }
+ listArr.value.push(item);
+ }
}
}
+ bookMarkId.value = result.configId;
}
};
// 飞到对应视角
@@ -72,10 +75,18 @@ const flytoView = (item: any) => {
map.setCameraView(item.center);
};
// 删除视角书签
-const delteMark = (index: number) => {
+const delteMark = async (index: number) => {
listArr.value.splice(index, 1);
- // 记录到历史数据
- globalStore.viewBookmarkArr = JSON.stringify(listArr.value);
+ // 记录到接口
+ console.log(listArr.value);
+ let requestData: any = { configKey: "flyViewConfig", configValue: JSON.stringify(listArr.value) };
+ await getConfig();
+ requestData.configId = bookMarkId.value;
+ const res = await updateSystemConfig(requestData);
+ console.log(res);
+ if (res.code == 200) {
+ ElMessage.success("操作成功");
+ }
};
// 添加视角书签
const addView = () => {
@@ -105,20 +116,17 @@ const addView = () => {
// });
item.img = response.image;
listArr.value.unshift(item);
- console.log(listArr.value);
- console.log(bookMarkId.value);
- // 记录到历史数据
+ // 记录到接口
let requestData: any = { configKey: "flyViewConfig", configValue: JSON.stringify(listArr.value) };
- if (listArr.value.length > 0 && !bookMarkId.value) {
- await getConfig();
- requestData.configId = bookMarkId.value;
- } else if (listArr.value.length > 0 && bookMarkId.value) {
- requestData.configId = bookMarkId.value;
- }
+ await getConfig();
+ requestData.configId = bookMarkId.value;
const res = await updateSystemConfig(requestData);
console.log(res);
if (res.code == 200) {
ElMessage.success("操作成功");
+ } else {
+ // 当添加不成功时需要重新删除
+ listArr.value.splice(listArr.value.length - 1, 1);
}
textVal.value = "";
});
diff --git a/src/views/goverment/largeScreen/components/mapMeasurement.vue b/src/views/goverment/largeScreen/components/mapMeasurement.vue
index 5a18768..b100180 100644
--- a/src/views/goverment/largeScreen/components/mapMeasurement.vue
+++ b/src/views/goverment/largeScreen/components/mapMeasurement.vue
@@ -5,7 +5,7 @@
@@ -71,6 +71,8 @@ let mapGraphic: any;
let routeLayer: any;
let gaodeRoute: any; // 高德路径规划
let startGraphic: any, endGraphic: any;
+let routeLineData: any = null; // 初始标记路线
+let initRoutePath: any = null;
onMounted(() => {
map.scene.globe.depthTestAgainstTerrain = false; // 不投射到地形上
routeLayer = new mars3d.layer.GraphicLayer();
@@ -80,52 +82,11 @@ onMounted(() => {
gaodeRoute = new mars3d.query.GaodeRoute({
key: ["ad31e514e7e740179d6d8f182720bcf5"]
});
-});
-// 模型路线是否跟随视角
-const checkChange = (row: any, index: number) => {
- let routeData = routeLayer.getGraphicById(row.id + "-" + index);
- console.log(routeData);
- routeData &&
- routeData.setCameraOptions({
- type: row.isFollow ? "gs" : ""
- });
-};
-// 模型路线停止漫游
-const stopFly = (row: any, index: number) => {
- let routeData = routeLayer.getGraphicById(row.id + "-" + index);
- row.isStart = false;
- routeData && routeData.stop();
-};
-// 模型路线漫游
-const startFly = (row: any, index: number) => {
- // 加载完成在加载小车,否则地形未加载完成,小车会处于地下
- let routeData = routeLayer.getGraphicById(row.id + "-" + index);
- if (routeData) {
- // 启动漫游
- routeData.flyTo();
- routeData.start();
- } else {
- productRoute(row, index);
- }
- row.isStart = true;
-};
-// 生成路线
-const productRoute = (obj: any, index: number) => {
- console.log(obj);
- console.log(startGraphic);
- console.log(endGraphic);
- const graphic = routeLayer.getGraphicById(obj.id);
- console.log(graphic);
- let pointsArr = [] as any;
- obj.points.map((item: any) => {
- pointsArr.push(mars3d.LngLatPoint.fromArray(item));
- });
- console.log(pointsArr);
- const newRoutePath = new mars3d.graphic.FixedRoute({
- id: obj.id + "-" + index,
- name: "路线-" + index,
+ initRoutePath = new mars3d.graphic.FixedRoute({
+ id: "route-id",
+ name: "路线-0",
speed: 200,
- positions: pointsArr,
+ positions: [[106.204963, 26.510103]],
clockLoop: false, // 是否循环播放
model: {
url: "//data.mars3d.cn/gltf/mars/jingche/jingche.gltf",
@@ -143,17 +104,87 @@ const productRoute = (obj: any, index: number) => {
width: 3
}
});
- console.log(newRoutePath);
- console.log(newRoutePath.info);
- routeLayer.addGraphic(newRoutePath);
+ mapGraphic && mapGraphic.addGraphic(initRoutePath);
// 绑定popup
- bindPopup(newRoutePath);
- newRoutePath.autoSurfaceHeight().then(function (e: any) {
+ bindPopup(initRoutePath);
+});
+// 速度切换
+const speedChange = () => {
+ console.log(111);
+ console.log(mapPosition.value.speed);
+ initRoutePath.multiplier = mapPosition.value.speed / 200;
+};
+// 模型路线是否跟随视角
+const checkChange = (row: any, index: number) => {
+ initRoutePath &&
+ initRoutePath.setCameraOptions({
+ type: row.isFollow ? "gs" : ""
+ });
+};
+// 模型路线停止漫游
+const stopFly = (row: any, index: number) => {
+ tableData.value.map((item: any, index2: any) => {
+ if (index2 != index) {
+ let rowGraphic = routeLayer.getGraphicById(item.id);
+ rowGraphic.entityGraphic.width = 5;
+ rowGraphic.entityGraphic.material = {};
+ rowGraphic.show = true;
+ item.isStart = false;
+ item.isFollow = false;
+ }
+ });
+ if (!initRoutePath || !routeLineData) return;
+ routeLineData.show = true;
+ row.isStart = false;
+ initRoutePath && initRoutePath.stop();
+};
+// 模型路线漫游
+const startFly = (row: any, index: number) => {
+ // 加载完成在加载小车,否则地形未加载完成,小车会处于地下
+ routeLineData = routeLayer.getGraphicById(row.id); // 初始标记路线
+ tableData.value.map((item: any, index2: any) => {
+ if (index2 != index) {
+ let rowGraphic = routeLayer.getGraphicById(item.id);
+ rowGraphic.entityGraphic.width = 5;
+ rowGraphic.entityGraphic.material = {};
+ rowGraphic.show = true;
+ item.isStart = false;
+ item.isFollow = false;
+ }
+ });
+ // if (newRoutePath) {
+ // // 启动漫游
+ // newRoutePath.flyTo();
+ // newRoutePath.start();
+ // } else {
+ // }
+ initRoutePath.show = true;
+ mapPosition.value.speed = 200;
+ initRoutePath.speed = mapPosition.value.speed;
+ routeLineData.show = false;
+ productRoute(row, index);
+ row.isStart = true;
+};
+// 生成路线
+const productRoute = (obj: any, index: number) => {
+ console.log(obj);
+ console.log(startGraphic);
+ console.log(endGraphic);
+ const graphic = routeLayer.getGraphicById(obj.id);
+ graphic.show = false;
+ console.log(graphic);
+ let pointsArr = [...mars3d.PolyUtil.simplifyPositions(obj.points)] as any; // 坐标点简化
+ pointsArr.splice(pointsArr.length - 1, 1); // 删除简化后生成的最后一个点,应该最后一个点是起点,为了避免回到起点
+ // obj.points.map((item: any) => {
+ // pointsArr.push(mars3d.LngLatPoint.fromArray(item));
+ // });
+ initRoutePath.positions = pointsArr;
+ initRoutePath.autoSurfaceHeight().then(function (e: any) {
// 启动漫游
- newRoutePath.flyTo();
- newRoutePath.start();
+ initRoutePath.flyTo();
+ initRoutePath.start();
- addParticleSystem(newRoutePath.property);
+ addParticleSystem(initRoutePath.property);
});
};
const bindPopup = (fixedRoute: any) => {
@@ -226,15 +257,20 @@ function addParticleSystem(property: any) {
});
routeLayer.addGraphic(particleSystem);
}
-let lastRoute: any;
// 高亮路线
-const highLightRoute = (row: any) => {
+const highLightRoute = (row: any, index: any) => {
const graphic = routeLayer.getGraphicById(row.id);
-
- if (lastRoute) {
- lastRoute.entityGraphic.material = lastRoute.entityGraphic.material_old;
- lastRoute.entityGraphic.width = lastRoute.entityGraphic.width_old;
- }
+ tableData.value.map((item: any, index2: any) => {
+ let rowGraphic = routeLayer.getGraphicById(item.id);
+ if (index2 != index) {
+ rowGraphic.entityGraphic.width = 5;
+ rowGraphic.entityGraphic.material = {};
+ }
+ rowGraphic.show = true;
+ item.isStart = false;
+ item.isFollow = false;
+ });
+ initRoutePath.show = false;
// 动画线材质
graphic.entityGraphic.width = 5;
@@ -243,10 +279,7 @@ const highLightRoute = (row: any) => {
image: new URL("@/assets/images/Mars3DImg/textures/line-color-yellow.png", import.meta.url).href,
speed: 20
});
-
- map.flyToGraphic(graphic);
-
- lastRoute = graphic;
+ // map.flyToGraphic(graphic);
};
// html格式处理
const htmlDeal = (row: any) => {
@@ -357,7 +390,7 @@ const startPicking = () => {
startGraphic = graphic;
const point = graphic.point;
point.format();
- queryRoute();
+ // queryRoute();
mapPosition.value.startPosition = point.lng + "," + point.lat;
return point.lng + "," + point.lat;
});
@@ -382,6 +415,7 @@ const endPicking = () => {
const point = graphic.point;
point.format();
queryRoute();
+ initRoutePath.show = false;
mapPosition.value.endPosition = point.lng + "," + point.lat;
return point.lng + "," + point.lat;
});
@@ -524,7 +558,6 @@ onUnmounted(() => {
> div:nth-child(1) {
display: flex;
align-items: center;
- justify-content: space-between;
border-bottom: 2px solid white;
padding: 5px;
:deep() {
@@ -536,6 +569,7 @@ onUnmounted(() => {
}
.el-button {
margin-left: 0px !important;
+ margin-right: 5px;
}
}
}
diff --git a/src/views/goverment/largeScreen/components/spaceAnalysis.vue b/src/views/goverment/largeScreen/components/spaceAnalysis.vue
index 4b88dda..bb71bd3 100644
--- a/src/views/goverment/largeScreen/components/spaceAnalysis.vue
+++ b/src/views/goverment/largeScreen/components/spaceAnalysis.vue
@@ -5,7 +5,7 @@
-
@@ -1131,6 +1135,9 @@ onUnmounted(() => {
.volumeAnalysis {
width: 400px;
}
+ .viewShed {
+ width: 350px;
+ }
}
}
// element 组件样式
diff --git a/src/views/goverment/largeScreen/components/viewBookmark.vue b/src/views/goverment/largeScreen/components/viewBookmark.vue
index 411175a..04d8e9b 100644
--- a/src/views/goverment/largeScreen/components/viewBookmark.vue
+++ b/src/views/goverment/largeScreen/components/viewBookmark.vue
@@ -51,20 +51,23 @@ const getConfig = async () => {
const { result } = await getSystemConfig(requestData);
console.log(result, "6666666");
if (result) {
- bookMarkId.value = result.configId;
- let arr = JSON.parse(result.configValue);
- if (arr && arr.length > 0) {
- console.log("历史数据", arr);
- for (let i = 0; i < arr.length; i++) {
- const item = arr[i];
- // 删除未匹配项
- // if (listArr.value[0].img === "") {
- // formState.imgObject.splice(0, 1)
- // formState.found = true
- // }
- listArr.value.push(item);
+ if (listArr.value.length == 0 && !bookMarkId.value) {
+ // 处理特殊情况,当没数据时再进行赋值,有数据时只取Id
+ let arr = JSON.parse(result.configValue);
+ if (arr && arr.length > 0) {
+ console.log("历史数据", arr);
+ for (let i = 0; i < arr.length; i++) {
+ const item = arr[i];
+ // 删除未匹配项
+ // if (listArr.value[0].img === "") {
+ // formState.imgObject.splice(0, 1)
+ // formState.found = true
+ // }
+ listArr.value.push(item);
+ }
}
}
+ bookMarkId.value = result.configId;
}
};
// 飞到对应视角
@@ -72,10 +75,18 @@ const flytoView = (item: any) => {
map.setCameraView(item.center);
};
// 删除视角书签
-const delteMark = (index: number) => {
+const delteMark = async (index: number) => {
listArr.value.splice(index, 1);
- // 记录到历史数据
- globalStore.viewBookmarkArr = JSON.stringify(listArr.value);
+ // 记录到接口
+ console.log(listArr.value);
+ let requestData: any = { configKey: "bookMarkConfig", configValue: JSON.stringify(listArr.value) };
+ await getConfig();
+ requestData.configId = bookMarkId.value;
+ const res = await updateSystemConfig(requestData);
+ console.log(res);
+ if (res.code == 200) {
+ ElMessage.success("操作成功");
+ }
};
// 添加视角书签
const addView = () => {
@@ -105,19 +116,17 @@ const addView = () => {
// });
item.img = response.image;
listArr.value.unshift(item);
- console.log(listArr.value);
- // 记录到历史数据
+ // 记录到接口
let requestData: any = { configKey: "bookMarkConfig", configValue: JSON.stringify(listArr.value) };
- if (listArr.value.length > 0 && !bookMarkId.value) {
- await getConfig();
- requestData.configId = bookMarkId.value;
- } else if (listArr.value.length > 0 && bookMarkId.value) {
- requestData.configId = bookMarkId.value;
- }
+ await getConfig();
+ requestData.configId = bookMarkId.value;
const res = await updateSystemConfig(requestData);
console.log(res);
if (res.code == 200) {
ElMessage.success("操作成功");
+ } else {
+ // 当添加不成功时需要重新删除
+ listArr.value.splice(listArr.value.length - 1, 1);
}
textVal.value = "";
});
diff --git a/src/views/goverment/largeScreen/index.vue b/src/views/goverment/largeScreen/index.vue
index b7bc90c..bdc2a8f 100644
--- a/src/views/goverment/largeScreen/index.vue
+++ b/src/views/goverment/largeScreen/index.vue
@@ -55,7 +55,7 @@
-
+
左侧图层:
@@ -659,14 +659,14 @@ const lantianSkybox = new mars3d.GroundSkyBox({
}
});
const data = [
- // {
- // name: "物联网设备",
- // icon: new URL("@/assets/images/Mars3DIcon/gj.png", import.meta.url).href,
- // children: [
- // { name: "视频", icon: new URL("@/assets/images/Mars3DIcon/tsls.png", import.meta.url).href },
- // { name: "扬尘", icon: new URL("@/assets/images/Mars3DIcon/kjfx.png", import.meta.url).href }
- // ]
- // },
+ {
+ name: "物联网设备",
+ icon: new URL("@/assets/images/Mars3DIcon/gj.png", import.meta.url).href,
+ children: [
+ { name: "视频", icon: new URL("@/assets/images/Mars3DIcon/tsls.png", import.meta.url).href },
+ { name: "扬尘", icon: new URL("@/assets/images/Mars3DIcon/kjfx.png", import.meta.url).href }
+ ]
+ },
{ name: "底图", icon: new URL("@/assets/images/Mars3DIcon/dt.png", import.meta.url).href },
{ name: "图层", icon: new URL("@/assets/images/Mars3DIcon/tc.png", import.meta.url).href },
{
@@ -733,14 +733,22 @@ const screenComparison = () => {
insertBefore: mapOld
});
map.addControl(mapScreenSplit);
+ // 修改对比地图
+ // mapScreenSplit.mapEx.basemap = "高德电子";
};
// 修改卷帘右侧图层
const changeRight = (e: any) => {
- console.log(mapSplit);
mapSplit.rightLayer = [layersObj[e]];
leftRollerList.value = baseMaps.value.filter((item: any) => {
return item.id != rollerVal.value.rightRollerVal;
});
+ console.log(mapSplit.rightLayer);
+ console.log(layersObj);
+ console.log(e);
+ // mapSplit.setOptions({
+ // rightLayer: [layersObj[rollerVal.value.rightRollerVal]],
+ // leftLayer: [layersObj[rollerVal.value.leftRollerVal]]
+ // });
};
// 修改卷帘左侧图层
const changeLeft = (e: any) => {
@@ -748,6 +756,10 @@ const changeLeft = (e: any) => {
rightRollerList.value = baseMaps.value.filter((item: any) => {
return item.id != rollerVal.value.leftRollerVal;
});
+ // mapSplit.setOptions({
+ // rightLayer: [layersObj[rollerVal.value.rightRollerVal]],
+ // leftLayer: [layersObj[rollerVal.value.leftRollerVal]]
+ // });
};
// 清除卷帘对比
const clearRollerComparison = () => {
@@ -769,7 +781,7 @@ const rollerComparison = () => {
leftLayer: [layersObj[rollerVal.value.leftRollerVal]]
});
map.addControl(mapSplit);
-
+ // map.control.baseLayerPicker = false; // basemaps底图切换按钮
// mapSplit.on(mars3d.EventType.mouseMove, function (event: any) {
// console.log("拖动了mapSplit控件", event);
// });
@@ -1152,7 +1164,7 @@ const getLineEffect = async () => {
});
console.log(graphic);
graphicLayer.addGraphic(graphic);
- graphic.flyTo();
+ graphic.flyTo({ minHeight: 3000 });
}, 100);
}
});
diff --git a/src/views/jxjview/layerManagement/components/operateDialog.vue b/src/views/jxjview/layerManagement/components/operateDialog.vue
index 3998d0d..7c4e266 100644
--- a/src/views/jxjview/layerManagement/components/operateDialog.vue
+++ b/src/views/jxjview/layerManagement/components/operateDialog.vue
@@ -303,7 +303,7 @@ const layerTypeJson = ref([
name: "单张图片 (本地离线)",
icon: new URL("@/assets/images/Mars3DImg/basemaps/offline.png", import.meta.url).href,
type: "image",
- url: "//data.mars3d.cn/filesrc/assets/images/Mars3DImg/world/world.jpg"
+ url: new URL("@/assets/images/Mars3DImg/basemaps/offline.png", import.meta.url).href
},
{
name: "无底图",