From 1b65bf157e9d1852bf819bcebcdbf596b77ae6b9 Mon Sep 17 00:00:00 2001
From: liuyg <376836862@qq.com>
Date: Tue, 18 Jan 2022 14:11:36 +0800
Subject: [PATCH] +点击建筑弹窗加绿布
---
src/components/mobileWindow/index.vue | 7 -
src/components/mobilemap/index.vue | 107 ++++++++++++++++++++++++++
src/store/getters.js | 117 ++++++++++++++--------------
src/store/modules/mobile.js | 8 +
4 files changed, 175 insertions(+), 64 deletions(-)
diff --git a/src/components/mobileWindow/index.vue b/src/components/mobileWindow/index.vue
index 29bb797..a6c91b2 100644
--- a/src/components/mobileWindow/index.vue
+++ b/src/components/mobileWindow/index.vue
@@ -250,6 +250,7 @@
that.routerS = [];
let once = true;
let query = this.query.query;
+ // console.log(query);
if (val == "去这") {
//定位
// console.log(this.query.query);
@@ -257,11 +258,7 @@
let ints = {
// start: [114.039946, 27.628475],
// end: that.query.query.lntLat,
- start: [
- +that.query.query.lntLat[0],
- +that.query.query.lntLat[1],
- 360,
- ],
+ start: [+query.lntLat[0], +query.lntLat[1], 360],
end: [114.031946, 27.621475],
type: "driving",
fn: function (datas) {
diff --git a/src/components/mobilemap/index.vue b/src/components/mobilemap/index.vue
index c15d548..99a655e 100644
--- a/src/components/mobilemap/index.vue
+++ b/src/components/mobilemap/index.vue
@@ -33,6 +33,7 @@
</div>
</template>
<script>
+import axios from "axios";
import { mapGetters } from "vuex";
export default {
name: "mobilemapBox",
@@ -79,6 +80,7 @@
[116.39585177, 27.93945304, 100],
[116.41526036, 27.95352217, 100],
],
+ areaLayer: null,
};
},
computed: {
@@ -92,6 +94,7 @@
"MobileWindowsHideFixed",
"dimension",
"dimensionData",
+ "areaLayer", //绿布
]),
},
watch: {
@@ -480,6 +483,110 @@
};
const newLayer = usetowpointfive();
+ //2.5d贴图事件
+ const layerGroup = new that.DC.LayerGroup("modelBox");
+ viewer.addLayerGroup(layerGroup);
+
+ let areaLayer = new that.DC.VectorLayer("areaLayer");
+ layerGroup.addLayer(areaLayer);
+ axios
+ .get(
+ "http://arcgis.jxpskj.com:6080/arcgis/rest/services/lxxqwxq/MapServer/0/query?where=1%3D1&text=&objectIds=&time=&geometry=&geometryType=esriGeometryEnvelope&inSR=&spatialRel=esriSpatialRelIntersects&relationParam=&outFields=*&returnGeometry=true&maxAllowableOffset=&geometryPrecision=&outSR=&returnIdsOnly=false&returnCountOnly=false&orderByFields=&groupByFieldsForStatistics=&outStatistics=&returnZ=false&returnM=false&gdbVersion=&returnDistinctValues=false&returnTrueCurves=false&resultOffset=&resultRecordCount=&f=pjson"
+ )
+ .then((resultData) => {
+ resultData.data.features.forEach((item) => {
+ item.geometry.rings[0].forEach((it) => {
+ it = it.join(",");
+ });
+
+ item.geometry.rings[0] = item.geometry.rings[0].join(";");
+
+ const polygon = new that.DC.Polygon(item.geometry.rings[0]);
+ polygon.attr = item.attributes;
+
+ polygon.setStyle({
+ material: that.DC.Namespace.Cesium.Color.fromBytes(
+ 255,
+ 255,
+ 255,
+ 1
+ ),
+ });
+
+ areaLayer.addOverlay(polygon);
+ });
+
+ areaLayer.show = true;
+ });
+ that.$store.commit("MSET_areaLayer", areaLayer);
+ var select = {
+ overlay: undefined,
+ color: undefined,
+ };
+ viewer.on(that.DC.MouseEventType.CLICK, (e) => {
+ // console.log(e);
+ if (e.overlay != undefined && e.layer.id == "areaLayer") {
+ if (select.overlay != undefined) {
+ if (e.overlay != select.overlay) {
+ select.overlay.setStyle({
+ material: select.color,
+ outline: false,
+ });
+
+ select.overlay = undefined;
+ select.color = undefined;
+ }
+ }
+
+ if (select.overlay == undefined) {
+ select.overlay = e.overlay;
+
+ select.color = e.overlay._style.material;
+ select.overlay.setStyle({
+ outline: true,
+ outlineColor: that.DC.Namespace.Cesium.Color.fromBytes(
+ 3,
+ 255,
+ 13,
+ 255
+ ), // 边框颜色
+ outlineWidth: 10, // 边框大小，
+ height: 0.01,
+ material: that.DC.Namespace.Cesium.Color.fromBytes(
+ 108,
+ 245,
+ 113,
+ 158
+ ),
+ });
+ }
+ // 定制化窗体
+ that.openPopupS(
+ {},
+ [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
+ {
+ name: "楼栋号:" + e.overlay.attr["楼栋号"],
+ bgImg:
+ "http://223.82.109.183:2081/zhxy/upload/20220105/3c05dd70a9eac17b7e49afbfc7b1b68e.png",
+ address: "",
+ introduce: "",
+ data: e,
+ lntLat: [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat],
+ }
+ );
+ } else {
+ if (select.overlay != undefined) {
+ select.overlay.setStyle({
+ material: select.color,
+ outline: false,
+ });
+
+ select.overlay = undefined;
+ select.color = undefined;
+ }
+ }
+ });
+
// 2.5D贴图↑
let startPoint;
if (true) {
diff --git a/src/store/getters.js b/src/store/getters.js
index 8e9568c..1604896 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -1,26 +1,27 @@
// 手机端
const mobile = {
- mviewer: (state) => state.mobile.mviewer,
- mBigPopup: (state) => state.mobile.mBigPopup,
- popupOurOpenData: (state) => state.mobile.popupOurOpenData,
- popupTableName: (state) => state.mobile.popupTableName,
- mBigPopupAfter: (state) => state.mobile.mBigPopupAfter,
- iconHide: (state) => state.mobile.iconHide,
- MobileWindowsHide: (state) => state.mobile.MobileWindowsHide, // 随地图移动窗口
- MobileWindowChangeData: (state) => state.mobile.MobileWindowChangeData, // 随地图移动窗口
- popupsDom: (state) => state.mobile.popupsDom,
- query: (state) => state.mobile.query,
- openmobileGoTo: (state) => state.mobile.openmobileGoTo, // 测试
- ccDataState: (state) => state.mobile.ccDataState, // 测试
- openmobilePanorama: (state) => state.mobile.openmobilePanorama,
- MobileWindowsHideFixed: (state) => state.mobile.MobileWindowsHideFixed, // 固定窗口
- MobileWindowChangeDataFixed: (state) =>
- state.mobile.MobileWindowChangeDataFixed, // 固定窗口
- startPointFn: (state) => state.mobile.startPointFn, // 默认起始点位置
- dimension: (state) => state.mobile.dimension, // 维度
- dimensionData: (state) => state.mobile.dimensionData, // 维度镜头数据
- perspectiveControl: (state) => state.mobile.perspectiveControl, /// 视角控制：高度、角度 ()=>{}
- audioState: (state) => state.mobile.audioState, // 文字转语音状态
+ mviewer: (state) => state.mobile.mviewer,
+ mBigPopup: (state) => state.mobile.mBigPopup,
+ popupOurOpenData: (state) => state.mobile.popupOurOpenData,
+ popupTableName: (state) => state.mobile.popupTableName,
+ mBigPopupAfter: (state) => state.mobile.mBigPopupAfter,
+ iconHide: (state) => state.mobile.iconHide,
+ MobileWindowsHide: (state) => state.mobile.MobileWindowsHide, // 随地图移动窗口
+ MobileWindowChangeData: (state) => state.mobile.MobileWindowChangeData, // 随地图移动窗口
+ popupsDom: (state) => state.mobile.popupsDom,
+ query: (state) => state.mobile.query,
+ openmobileGoTo: (state) => state.mobile.openmobileGoTo, // 测试
+ ccDataState: (state) => state.mobile.ccDataState, // 测试
+ openmobilePanorama: (state) => state.mobile.openmobilePanorama,
+ MobileWindowsHideFixed: (state) => state.mobile.MobileWindowsHideFixed, // 固定窗口
+ MobileWindowChangeDataFixed: (state) =>
+ state.mobile.MobileWindowChangeDataFixed, // 固定窗口
+ startPointFn: (state) => state.mobile.startPointFn, // 默认起始点位置
+ dimension: (state) => state.mobile.dimension, // 维度
+ dimensionData: (state) => state.mobile.dimensionData, // 维度镜头数据
+ perspectiveControl: (state) => state.mobile.perspectiveControl, /// 视角控制：高度、角度 ()=>{}
+ audioState: (state) => state.mobile.audioState, // 文字转语音状态
+ areaLayer: (state) => state.mobile.areaLayer, // 文字转语音状态
isOpenDrawALine: (state) => state.mobile.isOpenDrawALine, // 是否开启路线
isendPosition: (state) => state.mobile.isendPosition, // 路线导航终点数据改变
@@ -29,46 +30,46 @@
choiceRouterS: (state) => state.mobile.choiceRouterS, // 当前选择路径
showActivity: (state) => state.mobile.showActivity, // 显影活动弹窗
- isOpenDrawALineMany: (state) => state.mobile.isOpenDrawALineMany // 显影活动弹窗
-}
+ isOpenDrawALineMany: (state) => state.mobile.isOpenDrawALineMany, // 显影活动弹窗
+};
const navigation = {
- campusNavFlag: (state) => state.navigation.campusNavFlag,
- comeName: (state) => state.navigation.comeName,
- getToName: (state) => state.navigation.getToName
-}
+ campusNavFlag: (state) => state.navigation.campusNavFlag,
+ comeName: (state) => state.navigation.comeName,
+ getToName: (state) => state.navigation.getToName,
+};
const search = {
- orgNavBarFlag: (state) => state.search.orgNavBarFlag,
- orgNavBarTitle: (state) => state.search.orgNavBarTitle,
- orgNavBarList: (state) => state.search.orgNavBarList,
- arcNavBarFlag: (state) => state.search.arcNavBarFlag,
- arcNavBarTitle: (state) => state.search.arcNavBarTitle,
- arcNavBarCode: (state) => state.search.arcNavBarCode
-}
+ orgNavBarFlag: (state) => state.search.orgNavBarFlag,
+ orgNavBarTitle: (state) => state.search.orgNavBarTitle,
+ orgNavBarList: (state) => state.search.orgNavBarList,
+ arcNavBarFlag: (state) => state.search.arcNavBarFlag,
+ arcNavBarTitle: (state) => state.search.arcNavBarTitle,
+ arcNavBarCode: (state) => state.search.arcNavBarCode,
+};
const getters = {
- ...mobile,
- ...navigation,
- ...search,
- viewer: (state) => state.viewer.viewer,
- twoOrThree: (state) => state.viewer.twoOrThree,
- popupBgUrl: (state) => state.popupParams.popupBgUrl,
- pupupQRUrl: (state) => state.popupParams.pupupQRUrl,
- pointPosition: (state) => state.popupParams.pointPosition,
- terminus: (state) => state.popupParams.terminus,
- startingPoint: (state) => state.popupParams.startingPoint,
- stateName: (state) => state.popupParams.stateName,
- siteName: (state) => state.popupParams.siteName,
- telephone: (state) => state.popupParams.telephone,
- introduceText: (state) => state.popupParams.introduceText,
- panoramaUrl: (state) => state.popupParams.panoramaUrl,
- panoramaPopup: (state) => state.popupParams.panoramaPopup,
- monitorUrl: (state) => state.popupParams.monitorUrl,
- monitorPopup: (state) => state.popupParams.monitorPopup,
- detailsPopup: (state) => state.popupParams.detailsPopup,
- popupImgAtlas: (state) => state.popupParams.popupImgAtlas,
- teachList: (state) => state.popupParams.teachList,
- liveList: (state) => state.popupParams.liveList
-}
-export default getters
+ ...mobile,
+ ...navigation,
+ ...search,
+ viewer: (state) => state.viewer.viewer,
+ twoOrThree: (state) => state.viewer.twoOrThree,
+ popupBgUrl: (state) => state.popupParams.popupBgUrl,
+ pupupQRUrl: (state) => state.popupParams.pupupQRUrl,
+ pointPosition: (state) => state.popupParams.pointPosition,
+ terminus: (state) => state.popupParams.terminus,
+ startingPoint: (state) => state.popupParams.startingPoint,
+ stateName: (state) => state.popupParams.stateName,
+ siteName: (state) => state.popupParams.siteName,
+ telephone: (state) => state.popupParams.telephone,
+ introduceText: (state) => state.popupParams.introduceText,
+ panoramaUrl: (state) => state.popupParams.panoramaUrl,
+ panoramaPopup: (state) => state.popupParams.panoramaPopup,
+ monitorUrl: (state) => state.popupParams.monitorUrl,
+ monitorPopup: (state) => state.popupParams.monitorPopup,
+ detailsPopup: (state) => state.popupParams.detailsPopup,
+ popupImgAtlas: (state) => state.popupParams.popupImgAtlas,
+ teachList: (state) => state.popupParams.teachList,
+ liveList: (state) => state.popupParams.liveList,
+};
+export default getters;
diff --git a/src/store/modules/mobile.js b/src/store/modules/mobile.js
index 117f84b..88bf5b0 100644
--- a/src/store/modules/mobile.js
+++ b/src/store/modules/mobile.js
@@ -46,6 +46,7 @@
tilesetLayer: null, //2.5d模型
usetowpointfive: null,
tilesetLayer: null, //瀑布流
+ areaLayer: null, //2.5d事件--绿色图层
vecLayer: null, //3D底图
cvaLayer: null, //3D底图
@@ -177,6 +178,7 @@
state.tilesetLayer.show = true; //显示3d图形
state.startPointFn(); //移动默认视角
// state.mviewer.flyTo(state.tileset);
+ state.areaLayer.show = false; //绿布
//3D视角不限制
state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80;
@@ -208,7 +210,7 @@
state.newLayer = state.usetowpointfive(); //添加2.5d图形贴片
state.wallLayer.show = false; //打开瀑布
state.startPointFn(); //移动默认视角
-
+ state.areaLayer.show = true; //绿布
//2.5D视角限制
state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 0;
// 最大
@@ -225,6 +227,10 @@
state.mviewer.scene.screenSpaceCameraController.enableTilt = false;
}
},
+ //绿布
+ MSET_areaLayer(state, data) {
+ state.areaLayer = data;
+ },
//切换控制
MSET_PERSPECTIVECONTROL(state, data) {
state.perspectiveControl = data;
--
Gitblit v1.9.3