From c9570001ad913c37e161618c99ce2f194298ae3a Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Mon, 07 Mar 2022 10:15:11 +0800
Subject: [PATCH] 删除注释
---
src/components/campusNav/index.vue | 1209 ++++----
src/store/modules/popupParams.js | 180
src/components/mobileActivity/index.vue | 954 +++---
src/components/leftNav/index.vue | 902 +++---
src/components/map/components/mapPopup copy.vue | 1
src/components/map/index.vue | 1
src/store/modules/mobile.js | 2202 +++++++-------
src/components/map/components/mapPopup.vue | 2149 +++++++-------
src/App.vue | 299 +-
src/pcviews/tool/sign.vue | 352 +-
src/store/modules/pc/leftNavsData.js | 109
11 files changed, 4,152 insertions(+), 4,206 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index 3b2336b..53c0a08 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,169 +1,168 @@
<template>
- <div id="app" :class="{ cantdoit: cantdoits }">
- <router-view></router-view>
- </div>
+ <div id="app" :class="{ cantdoit: cantdoits }">
+ <router-view></router-view>
+ </div>
</template>
<script>
-import AMapLoader from "@amap/amap-jsapi-loader";
+import AMapLoader from '@amap/amap-jsapi-loader'
export default {
- name: "App",
- data() {
- return {
- // consoles: 1,
- // consoles1: 1,
- cantdoits: false,
- };
- },
- mounted() {
- let that = this;
-
- // console.log(frames, 789456);
- // setInterval(function () {
- // check();
- // }, 4000);
- // var check = function () {
- // function doCheck(a) {
- // if (("" + a / a)["length"] !== 1 || a % 20 === 0) {
- // // (function () {}["constructor"]("debugger")());
- // console.log("已打开控制台1");
- // that.consoles++;
- // return;
- // } else {
- // // (function () {}["constructor"]("debugger")());
- // // console.log("已打开控制台2");
- // // return;
- // that.consoles++;
- // }
- // doCheck(++a);
- // }
- // try {
- // doCheck(0);
- // } catch (err) {}
- // };
- // check();
- // console.log(this.getQueryString("data"), "window.location");
- // var reg = new RegExp("(^|&)" + "data" + "=([^&]*)(&|$)");
- let data = this.getQueryString("data");
- // console.log(data);
- try {
- data = JSON.parse(data);
- } catch (error) {}
-
- this.$store.commit("set_urlParameterData", data); //传入数据
-
- let d = {
- methods: "goto",
- jd: 125.11111,
- wd: 25.555555,
- };
- // console.log(
- // "http://192.168.0.222:8080/#/mobileLayout/default?data=" +
- // JSON.stringify(d)
- // );
- if (this._isMobile()) {
- this.cantdoits = true;
- // 手机端
- this.$router.replace("/mobileLayout");
-
- AMapLoader.load({
- key: "9c4b1a0ce88821775605e726073c52b5", // 申请好的Web端开发者Key，首次调用 load 时必填
- version: "2.0", // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
- plugins: [], //插件列表
- })
- .then((AMap) => {
- console.log(AMap);
- window.AMap = AMap;
- // that.map = new AMap.Map("mymap", {
- // center: [115.84414205551147, 28.678983439095823],
- // zoom: 14,
- // });
-
- // this.map.on('touchmove', (e) => {
- // console.log(e)
- // })
-
- // that.getLocationInfor(AMap, 115.84414205551147, 28.678983439095823);
- // that.map.on("mapmove", () => {
- // that.mouseMoveFlag = false;
- // that.mouseMoveFlag = true;
- // var currentCenter = that.map.getCenter();
- // if (that.setime) {
- // clearTimeout(that.setime);
- // }
- // that.setime = setTimeout(() => {
- // that.getLocationInfor(AMap, currentCenter.lng, currentCenter.lat);
- // clearTimeout(that.setime);
- // that.setime = null;
- // }, 200);
- // });
-
- // this.map.on('mousemove', (e) => {
- // console.log(e)
- // })
- })
- .catch((e) => {
- console.log(e);
- });
- } else {
- // pc端
- this.$router.replace("/pcLayout");
- }
- },
- methods: {
- getQueryString(name) {
- let inlength =
- window.location.href.indexOf("?" + name + "=") + name.length + 2;
- // console.log(inlength);
- // console.log(window.location.href);
- var r = window.location.href.slice(inlength);
- if (r != null) return decodeURIComponent(r);
- return null;
- },
- getQueryVariable(variable) {
- var query = window.location.search.substring(1);
- var vars = query.split("&");
- for (var i = 0; i < vars.length; i++) {
- var pair = vars[i].split("=");
- if (pair[0] == variable) {
- return pair[1];
+ name: 'App',
+ data () {
+ return {
+ // consoles: 1,
+ // consoles1: 1,
+ cantdoits: false
}
- }
- return false;
},
- _isMobile() {
- const flag = navigator.userAgent.match(
- /(phone|pad|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows phone)/i
- );
- return flag;
+ mounted () {
+ const that = this
+
+ // console.log(frames, 789456);
+ // setInterval(function () {
+ // check();
+ // }, 4000);
+ // var check = function () {
+ // function doCheck(a) {
+ // if (("" + a / a)["length"] !== 1 || a % 20 === 0) {
+ // // (function () {}["constructor"]("debugger")());
+ // console.log("已打开控制台1");
+ // that.consoles++;
+ // return;
+ // } else {
+ // // (function () {}["constructor"]("debugger")());
+ // // console.log("已打开控制台2");
+ // // return;
+ // that.consoles++;
+ // }
+ // doCheck(++a);
+ // }
+ // try {
+ // doCheck(0);
+ // } catch (err) {}
+ // };
+ // check();
+ // console.log(this.getQueryString("data"), "window.location");
+ // var reg = new RegExp("(^|&)" + "data" + "=([^&]*)(&|$)");
+ let data = this.getQueryString('data')
+ // console.log(data);
+ try {
+ data = JSON.parse(data)
+ } catch (error) { }
+
+ this.$store.commit('set_urlParameterData', data) // 传入数据
+
+ const d = {
+ methods: 'goto',
+ jd: 125.11111,
+ wd: 25.555555
+ }
+ // console.log(
+ // "http://192.168.0.222:8080/#/mobileLayout/default?data=" +
+ // JSON.stringify(d)
+ // );
+ if (this._isMobile()) {
+ this.cantdoits = true
+ // 手机端
+ this.$router.replace('/mobileLayout')
+
+ AMapLoader.load({
+ key: '9c4b1a0ce88821775605e726073c52b5', // 申请好的Web端开发者Key，首次调用 load 时必填
+ version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+ plugins: [] // 插件列表
+ })
+ .then((AMap) => {
+ window.AMap = AMap
+ // that.map = new AMap.Map("mymap", {
+ // center: [115.84414205551147, 28.678983439095823],
+ // zoom: 14,
+ // });
+
+ // this.map.on('touchmove', (e) => {
+ // console.log(e)
+ // })
+
+ // that.getLocationInfor(AMap, 115.84414205551147, 28.678983439095823);
+ // that.map.on("mapmove", () => {
+ // that.mouseMoveFlag = false;
+ // that.mouseMoveFlag = true;
+ // var currentCenter = that.map.getCenter();
+ // if (that.setime) {
+ // clearTimeout(that.setime);
+ // }
+ // that.setime = setTimeout(() => {
+ // that.getLocationInfor(AMap, currentCenter.lng, currentCenter.lat);
+ // clearTimeout(that.setime);
+ // that.setime = null;
+ // }, 200);
+ // });
+
+ // this.map.on('mousemove', (e) => {
+ // console.log(e)
+ // })
+ })
+ .catch((e) => {
+ console.log(e)
+ })
+ } else {
+ // pc端
+ this.$router.replace('/pcLayout')
+ }
},
- },
-};
+ methods: {
+ getQueryString (name) {
+ const inlength =
+ window.location.href.indexOf('?' + name + '=') + name.length + 2
+ // console.log(inlength);
+ // console.log(window.location.href);
+ var r = window.location.href.slice(inlength)
+ if (r != null) return decodeURIComponent(r)
+ return null
+ },
+ getQueryVariable (variable) {
+ var query = window.location.search.substring(1)
+ var vars = query.split('&')
+ for (var i = 0; i < vars.length; i++) {
+ var pair = vars[i].split('=')
+ if (pair[0] == variable) {
+ return pair[1]
+ }
+ }
+ return false
+ },
+ _isMobile () {
+ const flag = navigator.userAgent.match(
+ /(phone|pad|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows phone)/i
+ )
+ return flag
+ }
+ }
+}
</script>
<style>
html,
body {
- width: 100%;
- height: 100%;
- margin: 0;
- padding: 0;
- overflow: hidden;
+ width: 100%;
+ height: 100%;
+ margin: 0;
+ padding: 0;
+ overflow: hidden;
}
#app {
- font-family: "Avenir", Helvetica, Arial, sans-serif;
- -webkit-font-smoothing: antialiased;
- -moz-osx-font-smoothing: grayscale;
- color: #2c3e50;
- width: 100%;
- height: 100%;
+ font-family: 'Avenir', Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ color: #2c3e50;
+ width: 100%;
+ height: 100%;
}
.cantdoit * {
- -webkit-touch-callout: none !important; /*系统默认菜单被禁用*/
- -webkit-user-select: none !important; /*webkit浏览器*/
- -khtml-user-select: none !important; /*早期浏览器*/
- -moz-user-select: none !important; /*火狐*/
- -ms-user-select: none !important; /*IE10*/
- user-select: none !important;
+ -webkit-touch-callout: none !important; /*系统默认菜单被禁用*/
+ -webkit-user-select: none !important; /*webkit浏览器*/
+ -khtml-user-select: none !important; /*早期浏览器*/
+ -moz-user-select: none !important; /*火狐*/
+ -ms-user-select: none !important; /*IE10*/
+ user-select: none !important;
}
</style>
diff --git a/src/components/campusNav/index.vue b/src/components/campusNav/index.vue
index cacac45..154acd8 100644
--- a/src/components/campusNav/index.vue
+++ b/src/components/campusNav/index.vue
@@ -1,654 +1,637 @@
<template>
- <public-box class="campus-nav-box">
- <template slot="public-box-header">
- <div class="title">
- <img class="icon deblurring" src="/img/icon/xndh.png" alt />
- <span>校区内导航</span>
- </div>
- <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
- </template>
- <template slot="public-box-content">
- <div class="tab">
- <ul>
- <li @click="tabClick('步行')" :class="{ on: tabOneFlag }">
- <i></i>
- 步行
- </li>
- <li @click="tabClick('驾车')" :class="{ on: tabTwoFlag }">
- <i></i>
- 驾车
- </li>
- </ul>
- </div>
- <div class="container">
- <div>
- <div id="ToNameContainer">
- <el-input
- v-model="toNameText"
- @input="toNameChange"
- placeholder="起点……"
- >
- <template slot="prepend">
- <i class="el-icon-location mydingwei" style="color: green"></i>
- </template>
- </el-input>
- <div v-show="toNameShow" class="toname-value-box">
- <ul>
- <li
- v-for="(item, index) in toNameList"
- :key="index"
- @click="originChange(item)"
- >
- {{ item.mechanismname }}
- </li>
- </ul>
+ <public-box class="campus-nav-box">
+ <template slot="public-box-header">
+ <div class="title">
+ <img class="icon deblurring" src="/img/icon/xndh.png" alt />
+ <span>校区内导航</span>
</div>
- </div>
- <div id="ComeNameContainer">
- <el-input
- v-model="comeNameText"
- @input="comeNameChange"
- placeholder="终点……"
- >
- <template slot="prepend">
- <i class="el-icon-location mydingwei" style="color: red"></i>
- </template>
- </el-input>
- <div v-show="comeNameShow" class="comename-value-box">
- <ul>
- <li
- v-for="(item, index) in comeNameList"
- :key="index"
- @click="terminusChange(item)"
- >
- {{ item.mechanismname }}
- </li>
- </ul>
+ <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
+ </template>
+ <template slot="public-box-content">
+ <div class="tab">
+ <ul>
+ <li @click="tabClick('步行')" :class="{ on: tabOneFlag }">
+ <i></i>
+ 步行
+ </li>
+ <li @click="tabClick('驾车')" :class="{ on: tabTwoFlag }">
+ <i></i>
+ 驾车
+ </li>
+ </ul>
</div>
- </div>
- </div>
- <div>
- <el-button @click="startNavigation" type="primary">导航</el-button>
- </div>
- </div>
- </template>
- </public-box>
+ <div class="container">
+ <div>
+ <div id="ToNameContainer">
+ <el-input v-model="toNameText" @input="toNameChange" placeholder="起点……">
+ <template slot="prepend">
+ <i class="el-icon-location mydingwei" style="color: green"></i>
+ </template>
+ </el-input>
+ <div v-show="toNameShow" class="toname-value-box">
+ <ul>
+ <li
+ v-for="(item, index) in toNameList"
+ :key="index"
+ @click="originChange(item)"
+ >{{ item.mechanismname }}</li>
+ </ul>
+ </div>
+ </div>
+ <div id="ComeNameContainer">
+ <el-input v-model="comeNameText" @input="comeNameChange" placeholder="终点……">
+ <template slot="prepend">
+ <i class="el-icon-location mydingwei" style="color: red"></i>
+ </template>
+ </el-input>
+ <div v-show="comeNameShow" class="comename-value-box">
+ <ul>
+ <li
+ v-for="(item, index) in comeNameList"
+ :key="index"
+ @click="terminusChange(item)"
+ >{{ item.mechanismname }}</li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div>
+ <el-button @click="startNavigation" type="primary">导航</el-button>
+ </div>
+ </div>
+ </template>
+ </public-box>
</template>
<script>
-import { mapGetters } from "vuex";
-import { getSearchList } from "@/api/pc/public/search";
-import axios from "axios";
+import { mapGetters } from 'vuex'
+import { getSearchList } from '@/api/pc/public/search'
+import axios from 'axios'
export default {
- name: "campusNav",
- data() {
- return {
- tabOneFlag: true,
- tabTwoFlag: false,
- DC: null,
- navigationWay: "步行",
- routeLayer: null,
- toNameText: "",
- comeNameText: "",
- toNameList: [],
- comeNameList: [],
- toNameShow: false,
- comeNameShow: false,
+ name: 'campusNav',
+ data () {
+ return {
+ tabOneFlag: true,
+ tabTwoFlag: false,
+ DC: null,
+ navigationWay: '步行',
+ routeLayer: null,
+ toNameText: '',
+ comeNameText: '',
+ toNameList: [],
+ comeNameList: [],
+ toNameShow: false,
+ comeNameShow: false,
- overChouse: false,
- butChouse: "",
- startLayer: null,
- endLayer: null,
+ overChouse: false,
+ butChouse: '',
+ startLayer: null,
+ endLayer: null,
- isOverRouter: false, //是否启用了导航
- };
- },
- computed: {
- ...mapGetters([
- "viewer",
- "twoOrThree",
- // 起点
- "startingPoint",
- // 终点
- "terminus",
- // 出发名称
- "getToName",
- // 到达名称
- "comeName",
- // 点信息
- "pointPosition",
- "campusNavFlag",
- ]),
- },
- watch: {
- getToName: {
- immediate: true,
- handler(newCode, oldCode) {
- this.toNameText = newCode;
- console.log(newCode, "see");
- },
+ isOverRouter: false // 是否启用了导航
+ }
},
- comeName: {
- immediate: true,
- handler(newCode, oldCode) {
- this.comeNameText = newCode;
- console.log(newCode, "see");
- },
+ computed: {
+ ...mapGetters([
+ 'viewer',
+ 'twoOrThree',
+ // 起点
+ 'startingPoint',
+ // 终点
+ 'terminus',
+ // 出发名称
+ 'getToName',
+ // 到达名称
+ 'comeName',
+ // 点信息
+ 'pointPosition',
+ 'campusNavFlag'
+ ])
},
- campusNavFlag: {
- immediate: true,
- handler(newCode, oldCode) {
- if (newCode == false) {
- this.navigationWay = "步行";
- this.tabOneFlag = true;
- this.tabTwoFlag = false;
+ watch: {
+ getToName: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ this.toNameText = newCode
+ }
+ },
+ comeName: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ this.comeNameText = newCode
+ }
+ },
+ campusNavFlag: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ if (newCode == false) {
+ this.navigationWay = '步行'
+ this.tabOneFlag = true
+ this.tabTwoFlag = false
+ }
+ }
}
- },
},
- },
- created() {
- this.DC = global.DC;
- },
- mounted() {
- let leftBut = document.querySelectorAll(".el-input-group__prepend");
- leftBut[0].onclick = () => {
- this.chouseDian("start");
- };
- leftBut[1].onclick = () => {
- this.chouseDian("end");
- };
- },
- methods: {
- chouseDian(val) {
- let that = this;
-
- that.clearLayer(); //清除完成的导航
- if (that.isOverRouter) {
- //若是已经有导航，恢复未点击图标
- if (val == "start") {
- //初始化图标图层
- if (this.endLayer == null) {
- this.endLayer = new this.DC.VectorLayer("endLayer");
- this.viewer.addLayer(this.endLayer);
- } else {
- this.endLayer.clear();
- }
- // console.log("baoliuend", "see");
- that.$store.commit("SET_STARTINGPOINT", []);
- const endEntity = new that.DC.Billboard(
- new that.DC.Position(
- Number(this.terminus[0]),
- Number(this.terminus[1]),
- Number(this.terminus[2])
- ),
- "/img/navicon/end.png"
- );
- that.endLayer.addOverlay(endEntity);
- } else if (val == "end") {
- //初始化图标图层
- if (this.startLayer == null) {
- this.startLayer = new this.DC.VectorLayer("startLayer");
- this.viewer.addLayer(this.startLayer);
- } else {
- this.startLayer.clear();
- }
- // console.log("baoliustart", "see");
- that.$store.commit("SET_TERMINUS", []);
- const startEntity = new that.DC.Billboard(
- new that.DC.Position(
- Number(this.startingPoint[0]),
- Number(this.startingPoint[1]),
- Number(this.startingPoint[2])
- ),
- "/img/navicon/start.png"
- );
- that.startLayer.addOverlay(startEntity);
- }
- }
-
- // console.log(val, "see1");
- this.butChouse = val;
- //关闭其他地图事件
- that.$store.commit("set_closeMapClick", true);
- //添加标记
- let tooltip = that.viewer.tooltip;
- tooltip.enable = true;
- let title = "";
- if (val == "start") {
- title = "点击放置起点";
- //初始化图标图层
- if (this.startLayer == null) {
- this.startLayer = new this.DC.VectorLayer("startLayer");
- this.viewer.addLayer(this.startLayer);
- } else {
- this.startLayer.clear();
- }
- } else if (val == "end") {
- title = "点击放置终点";
- //初始化图标图层
- if (this.endLayer == null) {
- this.endLayer = new this.DC.VectorLayer("endLayer");
- this.viewer.addLayer(this.endLayer);
- } else {
- this.endLayer.clear();
- }
- }
- that.overChouse = false; //开启事件
- // 地图选点
- that.clicks = that.viewer.on(that.DC.MouseEventType.CLICK, (e) => {
- if (that.overChouse) {
- return;
- }
- let lnglat = [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat];
- // console.log(lnglat, "see11");
- // console.log(that.butChouse, "see11");
- //应用数据
- if (that.butChouse == "start") {
- that.toNameText = "自定义起点";
- //传输坐标数据
- that.$store.commit("SET_STARTINGPOINT", [...lnglat, 0]);
- //起点
- const startEntity = new that.DC.Billboard(
- new that.DC.Position(
- Number(lnglat[0]),
- Number(lnglat[1]),
- Number(0)
- ),
- "/img/navicon/start.png"
- );
- that.startLayer.addOverlay(startEntity);
- } else if (that.butChouse == "end") {
- that.comeNameText = "自定义终点";
- //传输坐标数据
- that.$store.commit("SET_TERMINUS", [...lnglat, 0]);
- //终点
- const endEntity = new that.DC.Billboard(
- new that.DC.Position(
- Number(lnglat[0]),
- Number(lnglat[1]),
- Number(0)
- ),
- "/img/navicon/end.png"
- );
- that.endLayer.addOverlay(endEntity);
- }
- title = "";
- tooltip.enable = false;
- that.overChouse = true; //关闭事件
- //开启其他地图事件
- that.$store.commit("set_closeMapClick", false);
- });
- that.moves = that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => {
- if (that.overChouse) {
- return;
- }
- // let lnglat = [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat];
- tooltip.showAt(e.windowPosition, title);
- });
+ created () {
+ this.DC = global.DC
},
- closeModel() {
- if (this.$route.path.indexOf("/campusnavi") != -1) {
- this.$store.dispatch("delVisitedViews", this.$route);
- this.$router.push("/pcLayout/default");
- }
-
- this.toNameText = "";
- this.toNameList = [];
- this.toNameShow = false;
- this.comeNameText = "";
- this.comeNameList = [];
- this.comeNameShow = false;
- if (this.routeLayer != null) {
- this.routeLayer.clear();
- this.isOverRouter = false;
- }
- //清除自定义位置
- if (this.startLayer != null) {
- this.startLayer.clear();
- // this.startLayer = null;
- }
- if (this.endLayer != null) {
- this.endLayer.clear();
- // this.endLayer = null;
- }
- this.$store.commit("SET_COMENAME", "");
- this.$store.commit("SET_TERMINUS", null);
- this.$store.commit("SET_GETTONAME", "");
- this.$store.commit("SET_STARTINGPOINT", null);
- this.$store.commit("SET_CAMPUSNAVFLAG", false);
+ mounted () {
+ const leftBut = document.querySelectorAll('.el-input-group__prepend')
+ leftBut[0].onclick = () => {
+ this.chouseDian('start')
+ }
+ leftBut[1].onclick = () => {
+ this.chouseDian('end')
+ }
},
+ methods: {
+ chouseDian (val) {
+ const that = this
- tabClick(param) {
- this.navigationWay = param;
- this.tabOneFlag = !this.tabOneFlag;
- this.tabTwoFlag = !this.tabTwoFlag;
- },
-
- startNavigation() {
- let that = this;
- //清除自定义位置
- if (this.startLayer != null) {
- this.startLayer.clear();
- // this.startLayer = null;
- }
- if (this.endLayer != null) {
- this.endLayer.clear();
- // this.endLayer = null;
- }
-
- if (this.routeLayer == null) {
- this.routeLayer = new this.DC.VectorLayer("navigation");
- this.viewer.addLayer(this.routeLayer);
- } else {
- this.routeLayer.clear();
- }
- if (this.startingPoint == null) {
- this.$message("请输入起点！！！");
- }
- if (this.terminus == null) {
- this.$message("请输入终点！！！");
- }
-
- // var start = this.DC.Transform.transformWGS84ToCartesian()
- const startEntity = new this.DC.Billboard(
- new this.DC.Position(
- Number(this.startingPoint[0]),
- Number(this.startingPoint[1]),
- Number(this.startingPoint[2])
- ),
- "/img/navicon/start.png"
- );
- this.routeLayer.addOverlay(startEntity);
- // var end = this.DC.Transform.transformWGS84ToCartesian()
- const endEntity = new this.DC.Billboard(
- new this.DC.Position(
- Number(this.terminus[0]),
- Number(this.terminus[1]),
- Number(this.terminus[2])
- ),
- "/img/navicon/end.png"
- );
- this.routeLayer.addOverlay(endEntity);
-
- var routes = "";
-
- var startLog = Number(this.startingPoint[0]).toFixed(6);
- var startLat = Number(this.startingPoint[1]).toFixed(6);
- var endLog = Number(this.terminus[0]).toFixed(6);
- var endLat = Number(this.terminus[1]).toFixed(6);
-
- var origin = this.DC.CoordTransform.WGS84ToGCJ02(startLog, startLat);
- var destination = this.DC.CoordTransform.WGS84ToGCJ02(endLog, endLat);
-
- if (this.navigationWay == "步行") {
- axios
- .get("https://restapi.amap.com/v3/direction/walking", {
- params: {
- origin: `${origin[0].toFixed(6) + "," + origin[1].toFixed(6)}`,
- destination: `${
- destination[0].toFixed(6) + "," + destination[1].toFixed(6)
- }`,
- key: "4b3e1db3211054ce5b466407cbb9d221",
- output: "json",
- },
- })
- .then((res) => {
- if (res.data.info == "OVER_DIRECTION_RANGE") {
- this.$message({
- message: "超出步行范围！",
- type: "warning",
- duration: 3000,
- });
+ that.clearLayer() // 清除完成的导航
+ if (that.isOverRouter) {
+ // 若是已经有导航，恢复未点击图标
+ if (val == 'start') {
+ // 初始化图标图层
+ if (this.endLayer == null) {
+ this.endLayer = new this.DC.VectorLayer('endLayer')
+ this.viewer.addLayer(this.endLayer)
+ } else {
+ this.endLayer.clear()
+ }
+ // console.log("baoliuend", "see");
+ that.$store.commit('SET_STARTINGPOINT', [])
+ const endEntity = new that.DC.Billboard(
+ new that.DC.Position(
+ Number(this.terminus[0]),
+ Number(this.terminus[1]),
+ Number(this.terminus[2])
+ ),
+ '/img/navicon/end.png'
+ )
+ that.endLayer.addOverlay(endEntity)
+ } else if (val == 'end') {
+ // 初始化图标图层
+ if (this.startLayer == null) {
+ this.startLayer = new this.DC.VectorLayer('startLayer')
+ this.viewer.addLayer(this.startLayer)
+ } else {
+ this.startLayer.clear()
+ }
+ // console.log("baoliustart", "see");
+ that.$store.commit('SET_TERMINUS', [])
+ const startEntity = new that.DC.Billboard(
+ new that.DC.Position(
+ Number(this.startingPoint[0]),
+ Number(this.startingPoint[1]),
+ Number(this.startingPoint[2])
+ ),
+ '/img/navicon/start.png'
+ )
+ that.startLayer.addOverlay(startEntity)
+ }
}
- res.data.route.paths[0].steps.forEach((item) => {
- item.polyline = item.polyline.split(";");
+ // console.log(val, "see1");
+ this.butChouse = val
+ // 关闭其他地图事件
+ that.$store.commit('set_closeMapClick', true)
+ // 添加标记
+ const tooltip = that.viewer.tooltip
+ tooltip.enable = true
+ let title = ''
+ if (val == 'start') {
+ title = '点击放置起点'
+ // 初始化图标图层
+ if (this.startLayer == null) {
+ this.startLayer = new this.DC.VectorLayer('startLayer')
+ this.viewer.addLayer(this.startLayer)
+ } else {
+ this.startLayer.clear()
+ }
+ } else if (val == 'end') {
+ title = '点击放置终点'
+ // 初始化图标图层
+ if (this.endLayer == null) {
+ this.endLayer = new this.DC.VectorLayer('endLayer')
+ this.viewer.addLayer(this.endLayer)
+ } else {
+ this.endLayer.clear()
+ }
+ }
+ that.overChouse = false // 开启事件
+ // 地图选点
+ that.clicks = that.viewer.on(that.DC.MouseEventType.CLICK, (e) => {
+ if (that.overChouse) {
+ return
+ }
+ const lnglat = [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat]
+ // console.log(lnglat, "see11");
+ // console.log(that.butChouse, "see11");
+ // 应用数据
+ if (that.butChouse == 'start') {
+ that.toNameText = '自定义起点'
+ // 传输坐标数据
+ that.$store.commit('SET_STARTINGPOINT', [...lnglat, 0])
+ // 起点
+ const startEntity = new that.DC.Billboard(
+ new that.DC.Position(
+ Number(lnglat[0]),
+ Number(lnglat[1]),
+ Number(0)
+ ),
+ '/img/navicon/start.png'
+ )
+ that.startLayer.addOverlay(startEntity)
+ } else if (that.butChouse == 'end') {
+ that.comeNameText = '自定义终点'
+ // 传输坐标数据
+ that.$store.commit('SET_TERMINUS', [...lnglat, 0])
+ // 终点
+ const endEntity = new that.DC.Billboard(
+ new that.DC.Position(
+ Number(lnglat[0]),
+ Number(lnglat[1]),
+ Number(0)
+ ),
+ '/img/navicon/end.png'
+ )
+ that.endLayer.addOverlay(endEntity)
+ }
+ title = ''
+ tooltip.enable = false
+ that.overChouse = true // 关闭事件
+ // 开启其他地图事件
+ that.$store.commit('set_closeMapClick', false)
+ })
+ that.moves = that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) => {
+ if (that.overChouse) {
+ return
+ }
+ // let lnglat = [e.wgs84SurfacePosition.lng, e.wgs84SurfacePosition.lat];
+ tooltip.showAt(e.windowPosition, title)
+ })
+ },
+ closeModel () {
+ if (this.$route.path.indexOf('/campusnavi') != -1) {
+ this.$store.dispatch('delVisitedViews', this.$route)
+ this.$router.push('/pcLayout/default')
+ }
- var lineArr = [];
+ this.toNameText = ''
+ this.toNameList = []
+ this.toNameShow = false
+ this.comeNameText = ''
+ this.comeNameList = []
+ this.comeNameShow = false
+ if (this.routeLayer != null) {
+ this.routeLayer.clear()
+ this.isOverRouter = false
+ }
+ // 清除自定义位置
+ if (this.startLayer != null) {
+ this.startLayer.clear()
+ // this.startLayer = null;
+ }
+ if (this.endLayer != null) {
+ this.endLayer.clear()
+ // this.endLayer = null;
+ }
+ this.$store.commit('SET_COMENAME', '')
+ this.$store.commit('SET_TERMINUS', null)
+ this.$store.commit('SET_GETTONAME', '')
+ this.$store.commit('SET_STARTINGPOINT', null)
+ this.$store.commit('SET_CAMPUSNAVFLAG', false)
+ },
- item.polyline.forEach((it) => {
- it = it.split(",");
- lineArr.push(
- this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(",")
- );
- });
+ tabClick (param) {
+ this.navigationWay = param
+ this.tabOneFlag = !this.tabOneFlag
+ this.tabTwoFlag = !this.tabTwoFlag
+ },
- lineArr = lineArr.join(";");
+ startNavigation () {
+ const that = this
+ // 清除自定义位置
+ if (this.startLayer != null) {
+ this.startLayer.clear()
+ // this.startLayer = null;
+ }
+ if (this.endLayer != null) {
+ this.endLayer.clear()
+ // this.endLayer = null;
+ }
- lineArr += ";";
-
- routes += lineArr;
- });
-
- routes =
- startLog + "," + startLat + ";" + routes + endLog + "," + endLat;
-
- const polyline = new this.DC.Polyline(routes);
- polyline.setStyle({
- width: 3,
- material: new this.DC.PolylineTrailMaterialProperty({
- color: this.DC.Color.RED,
- speed: 10,
- }),
- clampToGround: true,
- });
- this.routeLayer.addOverlay(polyline);
- if (this.twoOrThree == "真三维") {
- this.viewer.flyTo(this.routeLayer);
+ if (this.routeLayer == null) {
+ this.routeLayer = new this.DC.VectorLayer('navigation')
+ this.viewer.addLayer(this.routeLayer)
} else {
- var longitude = null;
- var latitude = null;
- startLog = Number(startLog);
- endLog = Number(endLog);
- if (startLog > endLog) {
- longitude = (startLog - endLog) / 2 + endLog;
- } else {
- longitude = (endLog - startLog) / 2 + startLog;
- }
- startLat = Number(startLat);
- endLat = Number(endLat);
- if (startLat > endLat) {
- latitude = (startLat - endLat) / 2 + endLat;
- } else {
- latitude = (endLat - startLat) / 2 + startLat;
- }
- that.isOverRouter = true;
- this.viewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- longitude,
- latitude,
- 600
- ),
- orientation: {
- // 指向
- heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
- // 视角
- pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0,
- },
- });
+ this.routeLayer.clear()
}
- });
- } else {
- axios
- .get("https://restapi.amap.com/v3/direction/driving", {
- params: {
- origin: `${origin[0].toFixed(6) + "," + origin[1].toFixed(6)}`,
- destination: `${
- destination[0].toFixed(6) + "," + destination[1].toFixed(6)
- }`,
- key: "4b3e1db3211054ce5b466407cbb9d221",
- strategy: 2,
- extensions: "all",
- output: "json",
- },
- })
- .then((res) => {
- res.data.route.paths[0].steps.forEach((item) => {
- item.polyline = item.polyline.split(";");
+ if (this.startingPoint == null) {
+ this.$message('请输入起点！！！')
+ }
+ if (this.terminus == null) {
+ this.$message('请输入终点！！！')
+ }
- var lineArr = [];
+ // var start = this.DC.Transform.transformWGS84ToCartesian()
+ const startEntity = new this.DC.Billboard(
+ new this.DC.Position(
+ Number(this.startingPoint[0]),
+ Number(this.startingPoint[1]),
+ Number(this.startingPoint[2])
+ ),
+ '/img/navicon/start.png'
+ )
+ this.routeLayer.addOverlay(startEntity)
+ // var end = this.DC.Transform.transformWGS84ToCartesian()
+ const endEntity = new this.DC.Billboard(
+ new this.DC.Position(
+ Number(this.terminus[0]),
+ Number(this.terminus[1]),
+ Number(this.terminus[2])
+ ),
+ '/img/navicon/end.png'
+ )
+ this.routeLayer.addOverlay(endEntity)
- item.polyline.forEach((it) => {
- it = it.split(",");
- lineArr.push(
- this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(",")
- );
- });
+ var routes = ''
- lineArr = lineArr.join(";");
+ var startLog = Number(this.startingPoint[0]).toFixed(6)
+ var startLat = Number(this.startingPoint[1]).toFixed(6)
+ var endLog = Number(this.terminus[0]).toFixed(6)
+ var endLat = Number(this.terminus[1]).toFixed(6)
- lineArr += ";";
+ var origin = this.DC.CoordTransform.WGS84ToGCJ02(startLog, startLat)
+ var destination = this.DC.CoordTransform.WGS84ToGCJ02(endLog, endLat)
- routes += lineArr;
- });
+ if (this.navigationWay == '步行') {
+ axios
+ .get('https://restapi.amap.com/v3/direction/walking', {
+ params: {
+ origin: `${origin[0].toFixed(6) + ',' + origin[1].toFixed(6)}`,
+ destination: `${destination[0].toFixed(6) + ',' + destination[1].toFixed(6)
+ }`,
+ key: '4b3e1db3211054ce5b466407cbb9d221',
+ output: 'json'
+ }
+ })
+ .then((res) => {
+ if (res.data.info == 'OVER_DIRECTION_RANGE') {
+ this.$message({
+ message: '超出步行范围！',
+ type: 'warning',
+ duration: 3000
+ })
+ }
- routes =
- startLog + "," + startLat + ";" + routes + endLog + "," + endLat;
+ res.data.route.paths[0].steps.forEach((item) => {
+ item.polyline = item.polyline.split(';')
- const polyline = new this.DC.Polyline(routes);
- polyline.setStyle({
- width: 3,
- material: new this.DC.PolylineTrailMaterialProperty({
- color: this.DC.Color.RED,
- speed: 10,
- }),
- clampToGround: true,
- });
- this.routeLayer.addOverlay(polyline);
+ var lineArr = []
- if (this.twoOrThree == "真三维") {
- this.viewer.flyTo(this.routeLayer);
+ item.polyline.forEach((it) => {
+ it = it.split(',')
+ lineArr.push(
+ this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
+ )
+ })
+
+ lineArr = lineArr.join(';')
+
+ lineArr += ';'
+
+ routes += lineArr
+ })
+
+ routes =
+ startLog + ',' + startLat + ';' + routes + endLog + ',' + endLat
+
+ const polyline = new this.DC.Polyline(routes)
+ polyline.setStyle({
+ width: 3,
+ material: new this.DC.PolylineTrailMaterialProperty({
+ color: this.DC.Color.RED,
+ speed: 10
+ }),
+ clampToGround: true
+ })
+ this.routeLayer.addOverlay(polyline)
+ if (this.twoOrThree == '真三维') {
+ this.viewer.flyTo(this.routeLayer)
+ } else {
+ var longitude = null
+ var latitude = null
+ startLog = Number(startLog)
+ endLog = Number(endLog)
+ if (startLog > endLog) {
+ longitude = (startLog - endLog) / 2 + endLog
+ } else {
+ longitude = (endLog - startLog) / 2 + startLog
+ }
+ startLat = Number(startLat)
+ endLat = Number(endLat)
+ if (startLat > endLat) {
+ latitude = (startLat - endLat) / 2 + endLat
+ } else {
+ latitude = (endLat - startLat) / 2 + startLat
+ }
+ that.isOverRouter = true
+ this.viewer.camera.setView({
+ // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ longitude,
+ latitude,
+ 600
+ ),
+ orientation: {
+ // 指向
+ heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
+ // 视角
+ pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
+ roll: 0.0
+ }
+ })
+ }
+ })
} else {
- var longitude = null;
- var latitude = null;
- startLog = Number(startLog);
- endLog = Number(endLog);
- if (startLog > endLog) {
- longitude = (startLog - endLog) / 2 + endLog;
- } else {
- longitude = (endLog - startLog) / 2 + startLog;
- }
- startLat = Number(startLat);
- endLat = Number(endLat);
- if (startLat > endLat) {
- latitude = (startLat - endLat) / 2 + endLat;
- } else {
- latitude = (endLat - startLat) / 2 + startLat;
- }
- that.isOverRouter = true;
- this.viewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- longitude,
- latitude,
- 600
- ),
- orientation: {
- // 指向
- heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
- // 视角
- pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0,
- },
- });
+ axios
+ .get('https://restapi.amap.com/v3/direction/driving', {
+ params: {
+ origin: `${origin[0].toFixed(6) + ',' + origin[1].toFixed(6)}`,
+ destination: `${destination[0].toFixed(6) + ',' + destination[1].toFixed(6)
+ }`,
+ key: '4b3e1db3211054ce5b466407cbb9d221',
+ strategy: 2,
+ extensions: 'all',
+ output: 'json'
+ }
+ })
+ .then((res) => {
+ res.data.route.paths[0].steps.forEach((item) => {
+ item.polyline = item.polyline.split(';')
+
+ var lineArr = []
+
+ item.polyline.forEach((it) => {
+ it = it.split(',')
+ lineArr.push(
+ this.DC.CoordTransform.GCJ02ToWGS84(it[0], it[1]).join(',')
+ )
+ })
+
+ lineArr = lineArr.join(';')
+
+ lineArr += ';'
+
+ routes += lineArr
+ })
+
+ routes =
+ startLog + ',' + startLat + ';' + routes + endLog + ',' + endLat
+
+ const polyline = new this.DC.Polyline(routes)
+ polyline.setStyle({
+ width: 3,
+ material: new this.DC.PolylineTrailMaterialProperty({
+ color: this.DC.Color.RED,
+ speed: 10
+ }),
+ clampToGround: true
+ })
+ this.routeLayer.addOverlay(polyline)
+
+ if (this.twoOrThree == '真三维') {
+ this.viewer.flyTo(this.routeLayer)
+ } else {
+ var longitude = null
+ var latitude = null
+ startLog = Number(startLog)
+ endLog = Number(endLog)
+ if (startLog > endLog) {
+ longitude = (startLog - endLog) / 2 + endLog
+ } else {
+ longitude = (endLog - startLog) / 2 + startLog
+ }
+ startLat = Number(startLat)
+ endLat = Number(endLat)
+ if (startLat > endLat) {
+ latitude = (startLat - endLat) / 2 + endLat
+ } else {
+ latitude = (endLat - startLat) / 2 + startLat
+ }
+ that.isOverRouter = true
+ this.viewer.camera.setView({
+ // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ destination: this.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ longitude,
+ latitude,
+ 600
+ ),
+ orientation: {
+ // 指向
+ heading: this.DC.Namespace.Cesium.Math.toRadians(0, 0),
+ // 视角
+ pitch: this.DC.Namespace.Cesium.Math.toRadians(-90),
+ roll: 0.0
+ }
+ })
+ }
+ })
}
- });
- }
- },
+ },
- clearLayer() {
- if (this.routeLayer != null) {
- this.routeLayer.clear();
- }
- },
+ clearLayer () {
+ if (this.routeLayer != null) {
+ this.routeLayer.clear()
+ }
+ },
- toNameChange() {
- if (this.toNameText == "") {
- this.toNameList = [];
- this.toNameShow = false;
- return;
- }
- getSearchList({ mechanismName: this.toNameText }).then((res) => {
- if (res.data.data.length > 0) {
- this.toNameList = res.data.data;
- this.toNameShow = true;
+ toNameChange () {
+ if (this.toNameText == '') {
+ this.toNameList = []
+ this.toNameShow = false
+ return
+ }
+ getSearchList({ mechanismName: this.toNameText }).then((res) => {
+ if (res.data.data.length > 0) {
+ this.toNameList = res.data.data
+ this.toNameShow = true
+ }
+ })
+ },
+
+ comeNameChange () {
+ if (this.comeNameText == '') {
+ this.comeNameList = []
+ this.comeNameShow = false
+ return
+ }
+ getSearchList({ mechanismName: this.comeNameText }).then((res) => {
+ if (res.data.data.length > 0) {
+ this.comeNameList = res.data.data
+ this.comeNameShow = true
+ }
+ })
+ },
+
+ shortcutShow (event) {
+ var toBox = document.getElementById('ToNameContainer')
+
+ if (toBox) {
+ if (!toBox.contains(event.target)) {
+ // 这句是说如果我们点击到了id为myPanel以外的区域
+ this.toNameShow = false
+ }
+ }
+
+ var comeBox = document.getElementById('ComeNameContainer')
+
+ if (comeBox) {
+ if (!comeBox.contains(event.target)) {
+ // 这句是说如果我们点击到了id为myPanel以外的区域
+ this.comeNameShow = false
+ }
+ }
+ },
+
+ originChange (param) {
+ this.$store.commit('SET_POINTPOSITION', [
+ Number(param.jd),
+ Number(param.wd),
+ Number(param.gd),
+ Number(param.heading),
+ Number(param.pitch),
+ Number(param.roll)
+ ])
+ this.$store.commit('SET_GETTONAME', param.mechanismname)
+ this.$store.commit('SET_STARTINGPOINT', this.pointPosition)
+ this.toNameShow = false
+ this.toNameList = []
+ },
+
+ terminusChange (param) {
+ this.$store.commit('SET_POINTPOSITION', [
+ Number(param.jd),
+ Number(param.wd),
+ Number(param.gd),
+ Number(param.heading),
+ Number(param.pitch),
+ Number(param.roll)
+ ])
+ this.$store.commit('SET_COMENAME', param.mechanismname)
+ this.$store.commit('SET_TERMINUS', this.pointPosition)
+ this.comeNameShow = false
+ this.comeNameList = []
}
- });
},
-
- comeNameChange() {
- if (this.comeNameText == "") {
- this.comeNameList = [];
- this.comeNameShow = false;
- return;
- }
- getSearchList({ mechanismName: this.comeNameText }).then((res) => {
- if (res.data.data.length > 0) {
- this.comeNameList = res.data.data;
- this.comeNameShow = true;
- }
- });
- },
-
- shortcutShow(event) {
- var toBox = document.getElementById("ToNameContainer");
-
- if (toBox) {
- if (!toBox.contains(event.target)) {
- // 这句是说如果我们点击到了id为myPanel以外的区域
- this.toNameShow = false;
- }
- }
-
- var comeBox = document.getElementById("ComeNameContainer");
-
- if (comeBox) {
- if (!comeBox.contains(event.target)) {
- // 这句是说如果我们点击到了id为myPanel以外的区域
- this.comeNameShow = false;
- }
- }
- },
-
- originChange(param) {
- this.$store.commit("SET_POINTPOSITION", [
- Number(param.jd),
- Number(param.wd),
- Number(param.gd),
- Number(param.heading),
- Number(param.pitch),
- Number(param.roll),
- ]);
- this.$store.commit("SET_GETTONAME", param.mechanismname);
- this.$store.commit("SET_STARTINGPOINT", this.pointPosition);
- this.toNameShow = false;
- this.toNameList = [];
- },
-
- terminusChange(param) {
- this.$store.commit("SET_POINTPOSITION", [
- Number(param.jd),
- Number(param.wd),
- Number(param.gd),
- Number(param.heading),
- Number(param.pitch),
- Number(param.roll),
- ]);
- this.$store.commit("SET_COMENAME", param.mechanismname);
- this.$store.commit("SET_TERMINUS", this.pointPosition);
- this.comeNameShow = false;
- this.comeNameList = [];
- },
- },
- destroyed() {
- console.log("endssss", "see");
- // this.closeModel();
- },
-};
+ destroyed () {
+ // this.closeModel();
+ }
+}
</script>
<style lang="scss" scope></style>
diff --git a/src/components/leftNav/index.vue b/src/components/leftNav/index.vue
index 15ff06e..ea64c3c 100644
--- a/src/components/leftNav/index.vue
+++ b/src/components/leftNav/index.vue
@@ -1,145 +1,141 @@
<template>
- <div class="left-nav">
- <ul>
- <li
- v-for="(item, index) in leftNavData"
- :key="index"
- @click="leftNavClick(item)"
- >
- <img :src="item.img" alt="" />
- <span>{{ item.label }}</span>
- </li>
- <li class="addIcons" @click="addIcons">
- <!-- <img :style="[imgStyle]" :src="item.img" alt="" /> -->
- <span>+</span>
- </li>
- </ul>
- </div>
+ <div class="left-nav">
+ <ul>
+ <li v-for="(item, index) in leftNavData" :key="index" @click="leftNavClick(item)">
+ <img :src="item.img" alt />
+ <span>{{ item.label }}</span>
+ </li>
+ <li class="addIcons" @click="addIcons">
+ <!-- <img :style="[imgStyle]" :src="item.img" alt="" /> -->
+ <span>+</span>
+ </li>
+ </ul>
+ </div>
</template>
<script>
import {
- getLifeList,
- getMonitorList,
- getSceneList,
- getWayList,
- getTagList,
-} from "@/api/pc/leftNav/index";
-import { mapGetters } from "vuex";
+ getLifeList,
+ getMonitorList,
+ getSceneList,
+ getWayList,
+ getTagList
+} from '@/api/pc/leftNav/index'
+import { mapGetters } from 'vuex'
export default {
- name: "leftNav",
- computed: {
- ...mapGetters([
- "viewer",
- "closeMapClick", // 关闭地图点击，防止新增标签误触
- "addIconsLayerIconPopup", //传送关闭编辑窗口，刷新标签数据
- ]),
- },
- data() {
- return {
- leftNavData: [
- {
- flag: true,
- label: "标签",
- img: "/img/leftnav/tag-checked.png",
- normal: "/img/leftnav/tag.png",
- checked: "/img/leftnav/tag-checked.png",
- layer: "tagLayer",
- },
- {
- flag: false,
- label: "道路",
- img: "/img/leftnav/way.png",
- normal: "/img/leftnav/way.png",
- checked: "/img/leftnav/way-checked.png",
- layer: "wayLayer",
- },
- {
- flag: false,
- label: "实景",
- img: "/img/leftnav/scene.png",
- normal: "/img/leftnav/scene.png",
- checked: "/img/leftnav/scene-checked.png",
- layer: "sceneLayer",
- },
- {
- flag: false,
- label: "监控",
- img: "/img/leftnav/monitor.png",
- normal: "/img/leftnav/monitor.png",
- checked: "/img/leftnav/monitor-checked.png",
- layer: "monitorLayer",
- },
- // {
- // flag: false,
- // label: '活动',
- // img: '/img/leftnav/activity.png',
- // normal: '/img/leftnav/activity.png',
- // checked: '/img/leftnav/activity-checked.png',
- // layer: 'activityLayer'
- // },
- // {
- // flag: false,
- // label: 'AED',
- // img: '/img/leftnav/aed.png',
- // normal: '/img/leftnav/aed.png',
- // checked: '/img/leftnav/aed-checked.png',
- // layer: 'aedLayer'
- // },
- {
- flag: false,
- label: "停车",
- img: "/img/leftnav/park.png",
- normal: "/img/leftnav/park.png",
- checked: "/img/leftnav/park-checked.png",
- layer: "parkLayer",
- },
- {
- flag: false,
- label: "出入",
- img: "/img/leftnav/come.png",
- normal: "/img/leftnav/come.png",
- checked: "/img/leftnav/come-checked.png",
- layer: "comeLayer",
- },
- ],
- viewer: null,
- DC: null,
- tagLayer: null,
- wayLayer: null,
- sceneLayer: null,
- monitorLayer: null,
- activityLayer: null,
- aedLayer: null,
- parkLayer: null,
- comeLayer: null,
- };
- },
- created() {
- this.DC = global.DC;
- },
- mounted() {
- //初始化新增标签图层
- // this.$store.commit("createAddIconsLayerIconLayer", { viewer: this.viewer });
- },
- watch: {
- addIconsLayerIconPopup() {
- if (!this.addIconsLayerIconPopup) {
- this.reself();
- }
+ name: 'leftNav',
+ computed: {
+ ...mapGetters([
+ 'viewer',
+ 'closeMapClick', // 关闭地图点击，防止新增标签误触
+ 'addIconsLayerIconPopup' // 传送关闭编辑窗口，刷新标签数据
+ ])
},
- },
- methods: {
- reself() {
- let that = this;
- if (this.tagLayer) {
- this.tagLayer.clear();
- }
- getTagList().then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ data () {
+ return {
+ leftNavData: [
+ {
+ flag: true,
+ label: '标签',
+ img: '/img/leftnav/tag-checked.png',
+ normal: '/img/leftnav/tag.png',
+ checked: '/img/leftnav/tag-checked.png',
+ layer: 'tagLayer'
+ },
+ {
+ flag: false,
+ label: '道路',
+ img: '/img/leftnav/way.png',
+ normal: '/img/leftnav/way.png',
+ checked: '/img/leftnav/way-checked.png',
+ layer: 'wayLayer'
+ },
+ {
+ flag: false,
+ label: '实景',
+ img: '/img/leftnav/scene.png',
+ normal: '/img/leftnav/scene.png',
+ checked: '/img/leftnav/scene-checked.png',
+ layer: 'sceneLayer'
+ },
+ {
+ flag: false,
+ label: '监控',
+ img: '/img/leftnav/monitor.png',
+ normal: '/img/leftnav/monitor.png',
+ checked: '/img/leftnav/monitor-checked.png',
+ layer: 'monitorLayer'
+ },
+ // {
+ // flag: false,
+ // label: '活动',
+ // img: '/img/leftnav/activity.png',
+ // normal: '/img/leftnav/activity.png',
+ // checked: '/img/leftnav/activity-checked.png',
+ // layer: 'activityLayer'
+ // },
+ // {
+ // flag: false,
+ // label: 'AED',
+ // img: '/img/leftnav/aed.png',
+ // normal: '/img/leftnav/aed.png',
+ // checked: '/img/leftnav/aed-checked.png',
+ // layer: 'aedLayer'
+ // },
+ {
+ flag: false,
+ label: '停车',
+ img: '/img/leftnav/park.png',
+ normal: '/img/leftnav/park.png',
+ checked: '/img/leftnav/park-checked.png',
+ layer: 'parkLayer'
+ },
+ {
+ flag: false,
+ label: '出入',
+ img: '/img/leftnav/come.png',
+ normal: '/img/leftnav/come.png',
+ checked: '/img/leftnav/come-checked.png',
+ layer: 'comeLayer'
+ }
+ ],
+ viewer: null,
+ DC: null,
+ tagLayer: null,
+ wayLayer: null,
+ sceneLayer: null,
+ monitorLayer: null,
+ activityLayer: null,
+ aedLayer: null,
+ parkLayer: null,
+ comeLayer: null
+ }
+ },
+ created () {
+ this.DC = global.DC
+ },
+ mounted () {
+ // 初始化新增标签图层
+ // this.$store.commit("createAddIconsLayerIconLayer", { viewer: this.viewer });
+ },
+ watch: {
+ addIconsLayerIconPopup () {
+ if (!this.addIconsLayerIconPopup) {
+ this.reself()
+ }
+ }
+ },
+ methods: {
+ reself () {
+ const that = this
+ if (this.tagLayer) {
+ this.tagLayer.clear()
+ }
+ getTagList().then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="tag-entitys-box">
<div class="tag-content">
${item.mechanismname}
@@ -149,89 +145,87 @@
</div>
</div>
`
- );
- //订阅事件
- divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
- if (that.closeMapClick) {
- return;
- }
- that.openPopups({
- lng: e.overlay.position.lng,
- lat: e.overlay.position.lat,
- item: item,
- });
- });
- this.tagLayer.addOverlay(divIcon);
- if (!this.leftNavData[0].flag) {
- this.tagLayer.show = false;
- }
- });
- });
- },
- addIcons() {
- if (this.closeMapClick) {
- //若正在加标签，退出
- return;
- }
- //加标签
- console.log("addIcons", "see");
- this.$store.dispatch("chouseAddIconsLayerIcon", {
- //新增标签 选定位置
- viewer: this.viewer,
- fn: (lnglat) => {
- //返回选定坐标
- console.log(lnglat, "see");
- //添加空白标签
- this.$store.dispatch("addIconsLayerIcon", {
- lnglat: lnglat,
- viewer: this.viewer,
- });
+ )
+ // 订阅事件
+ divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
+ if (that.closeMapClick) {
+ return
+ }
+ that.openPopups({
+ lng: e.overlay.position.lng,
+ lat: e.overlay.position.lat,
+ item: item
+ })
+ })
+ this.tagLayer.addOverlay(divIcon)
+ if (!this.leftNavData[0].flag) {
+ this.tagLayer.show = false
+ }
+ })
+ })
},
- });
- },
- generatePosition(num) {
- const list = [];
- for (let i = 0; i < num; i++) {
- const lng = 115.86271917 + Math.random() * 0.01;
- const lat = 28.73615593 + Math.random() * 0.02;
- list.push(new this.DC.Position(lng, lat, 0));
- }
- return list;
- },
- leftNavClick(item) {
- item.flag = !item.flag;
- if (item.flag == true) {
- item.img = item.checked;
- this[item.layer].show = true;
- } else {
- item.img = item.normal;
- this[item.layer].show = false;
- }
- },
- initialize(viewer) {
- var that = this;
- viewer.scene.globe.depthTestAgainstTerrain = false;
- this.viewer = viewer;
- this.tagLayer = new this.DC.HtmlLayer("tagLayer");
- viewer.addLayer(this.tagLayer);
- this.wayLayer = new this.DC.HtmlLayer("wayLayer");
- viewer.addLayer(this.wayLayer);
- this.sceneLayer = new this.DC.HtmlLayer("sceneLayer");
- viewer.addLayer(this.sceneLayer);
- this.monitorLayer = new this.DC.HtmlLayer("monitorLayer");
- viewer.addLayer(this.monitorLayer);
- this.aedLayer = new this.DC.VectorLayer("aedLayer");
- viewer.addLayer(this.aedLayer);
- this.parkLayer = new this.DC.HtmlLayer("parkLayer");
- viewer.addLayer(this.parkLayer);
- this.comeLayer = new this.DC.VectorLayer("comeLayer");
- viewer.addLayer(this.comeLayer);
+ addIcons () {
+ if (this.closeMapClick) {
+ // 若正在加标签，退出
+ return
+ }
+ // 加标签
+ this.$store.dispatch('chouseAddIconsLayerIcon', {
+ // 新增标签 选定位置
+ viewer: this.viewer,
+ fn: (lnglat) => {
+ // 返回选定坐标
+ // 添加空白标签
+ this.$store.dispatch('addIconsLayerIcon', {
+ lnglat: lnglat,
+ viewer: this.viewer
+ })
+ }
+ })
+ },
+ generatePosition (num) {
+ const list = []
+ for (let i = 0; i < num; i++) {
+ const lng = 115.86271917 + Math.random() * 0.01
+ const lat = 28.73615593 + Math.random() * 0.02
+ list.push(new this.DC.Position(lng, lat, 0))
+ }
+ return list
+ },
+ leftNavClick (item) {
+ item.flag = !item.flag
+ if (item.flag == true) {
+ item.img = item.checked
+ this[item.layer].show = true
+ } else {
+ item.img = item.normal
+ this[item.layer].show = false
+ }
+ },
+ initialize (viewer) {
+ var that = this
+ viewer.scene.globe.depthTestAgainstTerrain = false
+ this.viewer = viewer
+ this.tagLayer = new this.DC.HtmlLayer('tagLayer')
+ viewer.addLayer(this.tagLayer)
+ this.wayLayer = new this.DC.HtmlLayer('wayLayer')
+ viewer.addLayer(this.wayLayer)
+ this.sceneLayer = new this.DC.HtmlLayer('sceneLayer')
+ viewer.addLayer(this.sceneLayer)
+ this.monitorLayer = new this.DC.HtmlLayer('monitorLayer')
+ viewer.addLayer(this.monitorLayer)
+ this.aedLayer = new this.DC.VectorLayer('aedLayer')
+ viewer.addLayer(this.aedLayer)
+ this.parkLayer = new this.DC.HtmlLayer('parkLayer')
+ viewer.addLayer(this.parkLayer)
+ this.comeLayer = new this.DC.VectorLayer('comeLayer')
+ viewer.addLayer(this.comeLayer)
- getTagList().then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ getTagList().then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="tag-entitys-box">
<div class="tag-content">
${item.mechanismname}
@@ -241,29 +235,29 @@
</div>
</div>
`
- );
- //订阅事件
- divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
- if (that.closeMapClick) {
- return;
- }
- // console.log(item, "see11111");
- that.openPopups({
- lng: e.overlay.position.lng,
- lat: e.overlay.position.lat,
- item: item,
- });
- });
- this.tagLayer.addOverlay(divIcon);
- });
- // this.tagLayer.show = false
- });
+ )
+ // 订阅事件
+ divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
+ if (that.closeMapClick) {
+ return
+ }
+ // console.log(item, "see11111");
+ that.openPopups({
+ lng: e.overlay.position.lng,
+ lat: e.overlay.position.lat,
+ item: item
+ })
+ })
+ this.tagLayer.addOverlay(divIcon)
+ })
+ // this.tagLayer.show = false
+ })
- getWayList().then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ getWayList().then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="way-entitys-box">
<div class="way-title" style="border: white 1px solid; font-size: 0.875rem; background: #0066ff; width: 18px; line-height: 14px; padding: 6px 2px 6px 2px; color: white; text-align: center;">
${item.roadname}
@@ -273,141 +267,141 @@
</div>
</div>
`
- );
- this.wayLayer.addOverlay(divIcon);
- });
- this.wayLayer.show = false;
- });
+ )
+ this.wayLayer.addOverlay(divIcon)
+ })
+ this.wayLayer.show = false
+ })
- getMonitorList().then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ getMonitorList().then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="monitor-entitys-box">
<div>${item.mechanismname}</div>
<img class="monitor-entitys-box" src="/img/leftnav/map-monitor.png" alt="">
</div>
`
- );
- divIcon.attrParams = item;
- this.monitorLayer.addOverlay(divIcon);
+ )
+ divIcon.attrParams = item
+ this.monitorLayer.addOverlay(divIcon)
- divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
- this.$store.commit("SET_PANORAMAPOPUP", false);
- this.$store.commit("SET_DETAILSPOPUP", false);
- this.$store.commit(
- "SET_STATENAME",
- e.overlay.attrParams.mechanismname
- );
- this.$store.commit("SET_MONITORURL", e.overlay.attrParams.videourl);
- // eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
- new this.DC.Position.fromArray([
- Number(item.jd),
- Number(item.wd),
- 0,
- 0,
- -90,
- 0,
- ])
- );
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
- // eslint-disable-next-line no-unused-vars
- var monitor = new this.DC.PanoramaBox(this.viewer, {
- domId: "MonitorBox",
- position: [positions],
- });
+ divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
+ this.$store.commit('SET_PANORAMAPOPUP', false)
+ this.$store.commit('SET_DETAILSPOPUP', false)
+ this.$store.commit(
+ 'SET_STATENAME',
+ e.overlay.attrParams.mechanismname
+ )
+ this.$store.commit('SET_MONITORURL', e.overlay.attrParams.videourl)
+ // eslint-disable-next-line new-cap
+ var positions = this.DC.Transform.transformWGS84ToCartesian(
+ new this.DC.Position.fromArray([
+ Number(item.jd),
+ Number(item.wd),
+ 0,
+ 0,
+ -90,
+ 0
+ ])
+ )
+ this.viewer.scene.globe.depthTestAgainstTerrain = false
+ // eslint-disable-next-line no-unused-vars
+ var monitor = new this.DC.PanoramaBox(this.viewer, {
+ domId: 'MonitorBox',
+ position: [positions]
+ })
- this.$store.commit("SET_MONITORPOPUP", true);
- });
- });
+ this.$store.commit('SET_MONITORPOPUP', true)
+ })
+ })
- this.monitorLayer.show = false;
- });
+ this.monitorLayer.show = false
+ })
- getSceneList().then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ getSceneList().then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="scene-entitys-box">
<div>${item.mechanismname}</div>
<img src="/img/leftnav/map-panorama.png" alt="">
</div>
`
- );
- divIcon.attrParams = item;
- this.sceneLayer.addOverlay(divIcon);
+ )
+ divIcon.attrParams = item
+ this.sceneLayer.addOverlay(divIcon)
- divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
- this.$store.commit("SET_DETAILSPOPUP", false);
- this.$store.commit("SET_MONITORPOPUP", false);
- this.$store.commit(
- "SET_STATENAME",
- e.overlay.attrParams.mechanismname
- );
- this.$store.commit(
- "SET_PANORAMAURL",
- e.overlay.attrParams.panoramaurl
- );
- // eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
- new this.DC.Position.fromArray([
- Number(item.jd),
- Number(item.wd),
- 0,
- 0,
- -90,
- 0,
- ])
- );
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
- // eslint-disable-next-line no-unused-vars
- var panorama = new this.DC.PanoramaBox(this.viewer, {
- domId: "PanoramaBox",
- position: [positions],
- });
+ divIcon.on(that.DC.MouseEventType.CLICK, (e) => {
+ this.$store.commit('SET_DETAILSPOPUP', false)
+ this.$store.commit('SET_MONITORPOPUP', false)
+ this.$store.commit(
+ 'SET_STATENAME',
+ e.overlay.attrParams.mechanismname
+ )
+ this.$store.commit(
+ 'SET_PANORAMAURL',
+ e.overlay.attrParams.panoramaurl
+ )
+ // eslint-disable-next-line new-cap
+ var positions = this.DC.Transform.transformWGS84ToCartesian(
+ new this.DC.Position.fromArray([
+ Number(item.jd),
+ Number(item.wd),
+ 0,
+ 0,
+ -90,
+ 0
+ ])
+ )
+ this.viewer.scene.globe.depthTestAgainstTerrain = false
+ // eslint-disable-next-line no-unused-vars
+ var panorama = new this.DC.PanoramaBox(this.viewer, {
+ domId: 'PanoramaBox',
+ position: [positions]
+ })
- this.$store.commit("SET_PANORAMAPOPUP", true);
- });
- });
+ this.$store.commit('SET_PANORAMAPOPUP', true)
+ })
+ })
- this.sceneLayer.show = false;
- });
+ this.sceneLayer.show = false
+ })
- getLifeList({ lifetype: 9 }).then((res) => {
- res.data.data.forEach((item) => {
- const label = new this.DC.Label(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- item.mechanismname
- );
- label.setStyle({
- fillColor: this.DC.Color.CRIMSON,
- style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
- outlineColor: that.DC.Color.WHITE, // 边框颜色
- outlineWidth: 8, // 边框大小，
- font: "14px sans-serif",
- pixelOffset: { x: 0, y: -24 },
- });
- this.aedLayer.addOverlay(label);
+ getLifeList({ lifetype: 9 }).then((res) => {
+ res.data.data.forEach((item) => {
+ const label = new this.DC.Label(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ item.mechanismname
+ )
+ label.setStyle({
+ fillColor: this.DC.Color.CRIMSON,
+ style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
+ outlineColor: that.DC.Color.WHITE, // 边框颜色
+ outlineWidth: 8, // 边框大小，
+ font: '14px sans-serif',
+ pixelOffset: { x: 0, y: -24 }
+ })
+ this.aedLayer.addOverlay(label)
- const billboard = new this.DC.Billboard(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- "/img/leftnav/map-aed.png"
- );
- billboard.size = [20, 20];
+ const billboard = new this.DC.Billboard(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ '/img/leftnav/map-aed.png'
+ )
+ billboard.size = [20, 20]
- this.aedLayer.addOverlay(billboard);
- });
- this.aedLayer.show = false;
- });
+ this.aedLayer.addOverlay(billboard)
+ })
+ this.aedLayer.show = false
+ })
- getLifeList({ lifetype: 11 }).then((res) => {
- res.data.data.forEach((item) => {
- const divIcon = new this.DC.DivIcon(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- `
+ getLifeList({ lifetype: 11 }).then((res) => {
+ res.data.data.forEach((item) => {
+ const divIcon = new this.DC.DivIcon(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ `
<div class="park-entitys-box">
<div class="park-title" alt="${item.mechanismname}">
</div>
@@ -421,122 +415,122 @@
</div>
</div>
`
- );
- this.parkLayer.addOverlay(divIcon);
- });
- this.parkLayer.show = false;
- });
+ )
+ this.parkLayer.addOverlay(divIcon)
+ })
+ this.parkLayer.show = false
+ })
- getLifeList({ lifetype: 12 }).then((res) => {
- res.data.data.forEach((item) => {
- const label = new that.DC.Label(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- item.mechanismname
- );
- label.setStyle({
- fillColor: that.DC.Color.FUCHSIA,
- style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
- outlineColor: that.DC.Color.WHITE, // 边框颜色
- outlineWidth: 8, // 边框大小，
- font: "14px sans-serif",
- pixelOffset: { x: 0, y: -40 },
- });
- that.comeLayer.addOverlay(label);
+ getLifeList({ lifetype: 12 }).then((res) => {
+ res.data.data.forEach((item) => {
+ const label = new that.DC.Label(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ item.mechanismname
+ )
+ label.setStyle({
+ fillColor: that.DC.Color.FUCHSIA,
+ style: that.DC.Namespace.Cesium.LabelStyle.FILL_AND_OUTLINE,
+ outlineColor: that.DC.Color.WHITE, // 边框颜色
+ outlineWidth: 8, // 边框大小，
+ font: '14px sans-serif',
+ pixelOffset: { x: 0, y: -40 }
+ })
+ that.comeLayer.addOverlay(label)
- const billboard = new that.DC.Billboard(
- new that.DC.Position(Number(item.jd), Number(item.wd), 0),
- "/img/leftnav/map-activity.png"
- );
- billboard.size = [20, 20];
- billboard.setStyle({
- pixelOffset: { x: 0, y: -16 },
- });
+ const billboard = new that.DC.Billboard(
+ new that.DC.Position(Number(item.jd), Number(item.wd), 0),
+ '/img/leftnav/map-activity.png'
+ )
+ billboard.size = [20, 20]
+ billboard.setStyle({
+ pixelOffset: { x: 0, y: -16 }
+ })
- that.comeLayer.addOverlay(billboard);
- });
- this.comeLayer.show = false;
- });
- },
- openPopups(value) {
- var popup = new this.DC.DivForms(this.viewer, {
- domId: "divFormsDomBox",
- position: [
- this.DC.Transform.transformWGS84ToCartesian(
- new this.DC.Position(
- Number(value.lng),
- Number(value.lat),
- Number(value.alt || 0)
- )
- ),
- ],
- });
- // console.log(value, "see");
- this.$store.dispatch("setOurDataInPoput", value);
- this.$store.dispatch("pcFlyView", {
- jd: value.lng,
- wd: value.lat,
- viewer: this.viewer,
- });
- },
- },
-};
+ that.comeLayer.addOverlay(billboard)
+ })
+ this.comeLayer.show = false
+ })
+ },
+ openPopups (value) {
+ var popup = new this.DC.DivForms(this.viewer, {
+ domId: 'divFormsDomBox',
+ position: [
+ this.DC.Transform.transformWGS84ToCartesian(
+ new this.DC.Position(
+ Number(value.lng),
+ Number(value.lat),
+ Number(value.alt || 0)
+ )
+ )
+ ]
+ })
+ // console.log(value, "see");
+ this.$store.dispatch('setOurDataInPoput', value)
+ this.$store.dispatch('pcFlyView', {
+ jd: value.lng,
+ wd: value.lat,
+ viewer: this.viewer
+ })
+ }
+ }
+}
</script>
<style scoped lang="scss">
.left-nav {
- position: fixed;
- top: 160px;
- right: 30px;
- // bottom: 20px;
- // left: 0;
- z-index: 1;
- ul {
- // display: flex;
- li {
- // margin: 0 8px;
- margin-bottom: 12px;
- font-weight: 400;
- display: block;
- width: 98px;
- height: 33px;
- line-height: 33px;
- background-color: #fff;
- border-radius: 17px;
- text-align: center;
- font-size: 0;
- cursor: pointer;
+ position: fixed;
+ top: 160px;
+ right: 30px;
+ // bottom: 20px;
+ // left: 0;
+ z-index: 1;
+ ul {
+ // display: flex;
+ li {
+ // margin: 0 8px;
+ margin-bottom: 12px;
+ font-weight: 400;
+ display: block;
+ width: 98px;
+ height: 33px;
+ line-height: 33px;
+ background-color: #fff;
+ border-radius: 17px;
+ text-align: center;
+ font-size: 0;
+ cursor: pointer;
- img {
- width: 24px;
- height: 24px;
- vertical-align: middle;
- margin-right: 10px;
- image-rendering: -moz-crisp-edges;
- image-rendering: -o-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: crisp-edges;
- -ms-interpolation-mode: nearest-neighbor;
- }
+ img {
+ width: 24px;
+ height: 24px;
+ vertical-align: middle;
+ margin-right: 10px;
+ image-rendering: -moz-crisp-edges;
+ image-rendering: -o-crisp-edges;
+ image-rendering: -webkit-optimize-contrast;
+ image-rendering: crisp-edges;
+ -ms-interpolation-mode: nearest-neighbor;
+ }
- span {
- display: inline-block;
- vertical-align: middle;
- font-size: 14px;
- color: #2f2f2f;
- }
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ color: #2f2f2f;
+ }
+ }
}
- }
}
.addIcons {
- position: absolute;
- top: 0;
- left: -60px;
- width: 50px !important;
- span {
- font-size: 25px !important;
- }
+ position: absolute;
+ top: 0;
+ left: -60px;
+ width: 50px !important;
+ span {
+ font-size: 25px !important;
+ }
}
.avtiveAddIcons {
- background-color: aqua;
+ background-color: aqua;
}
</style>
diff --git a/src/components/map/components/mapPopup copy.vue b/src/components/map/components/mapPopup copy.vue
index fbb356b..ff63074 100644
--- a/src/components/map/components/mapPopup copy.vue
+++ b/src/components/map/components/mapPopup copy.vue
@@ -1166,7 +1166,6 @@
}
// console.log(data);
setlabel(data).then((res) => {
- console.log(res)
if (res.data.code == 200) {
doit()
that.$message({
diff --git a/src/components/map/components/mapPopup.vue b/src/components/map/components/mapPopup.vue
index 4f05464..a9c7f5f 100644
--- a/src/components/map/components/mapPopup.vue
+++ b/src/components/map/components/mapPopup.vue
@@ -1,433 +1,423 @@
<template>
- <div>
- <div id="map_popup_content">
- <div v-if="detailsPopup" class="divForms-dom" id="divFormsDomBox">
- <div style="width: 100%; height: 100%">
- <div class="divForms divForms-theme">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- {{ stateName }}
- <img
- v-show="introduceText != null && introduceText != ''"
- @click="audioPlay"
- class="audio-control"
- src="/img/navicon/audio.png"
- alt
- />
- <img
- @click="closeMapPopupBox"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="label-content">
- <div class="arc-bcg">
- <img :src="popupBgUrl" alt />
- </div>
- <div
- v-show="siteName != null && siteName != ''"
- class="site"
- >
- <strong>地址：</strong>
- {{ siteName }}
- </div>
- <div
- v-show="telephone != null && telephone != ''"
- class="phone"
- >
- <strong>电话：</strong>
- {{ telephone }}
- </div>
- <div
- v-show="introduceText != null && introduceText != ''"
- class="introduce"
- >
- <p ref="DomIntroduceText">
- <strong>介绍：</strong>
- <span v-html="introduceText"></span>
- </p>
- </div>
- <div class="popup-nav">
- <ul>
- <li @click="comeHereClick">
- <i class="popup-icon come-nav deblurring"></i>
- 到这
- </li>
- <li @click="getToHereClick">
- <i class="popup-icon start-nav deblurring"></i>
- 出发
- </li>
- <li v-show="false" @click="qrCodeClick">
- <i class="popup-icon qr-code-nav deblurring"></i>
- 二维码
- </li>
- <li @click="imgsClick">
- <i class="popup-icon atlas-nav deblurring"></i>
- 图集
- </li>
- <li
- v-show="panoramaUrl != null && panoramaUrl != ''"
- @click="panoramaClick"
- >
- <i class="popup-icon live-action-nav deblurring"></i>
- 实景
- </li>
- <!-- v-show="panoramaUrl != null && panoramaUrl != ''" -->
- <li v-show="false" @click="monitorClick">
- <i class="popup-icon monitor-nav deblurring"></i>
- 监控
- </li>
- </ul>
- </div>
- <div
- v-show="teachList.length > 0 || liveList.length > 0"
- class="arc-box"
- >
- <ul class="tab-btn">
- <li
- v-show="teachList.length > 0"
- :class="{ on: tabBtnFlag == '教学科研行政' }"
- @click="tabBtnClick('教学科研行政')"
- >
- 教学科研行政
- </li>
- <li
- v-show="liveList.length > 0"
- :class="{ on: tabBtnFlag == '生活服务' }"
- @click="tabBtnClick('生活服务')"
- >
- 生活服务
- </li>
- </ul>
- <div class="btm-content">
- <div :class="{ on: tabBtnFlag == '教学科研行政' }">
- <ul>
- <li
- v-for="(item, index) in teachList"
- :key="index"
- @click="mechanismDetailPopup(0, item)"
- >
- <i
- class="popup-icon location-icon deblurring"
- ></i>
- {{ item }}
- </li>
- </ul>
+ <div>
+ <div id="map_popup_content">
+ <div v-if="detailsPopup" class="divForms-dom" id="divFormsDomBox">
+ <div style="width: 100%; height: 100%">
+ <div class="divForms divForms-theme">
+ <div class="divForms-wrap">
+ <div class="area">
+ <div class="arrow-lt"></div>
+ <div class="b-t"></div>
+ <div class="b-r"></div>
+ <div class="b-b"></div>
+ <div class="b-l"></div>
+ <div class="arrow-rb"></div>
+ <div class="label-wrap">
+ <div class="title">
+ {{ stateName }}
+ <img
+ v-show="introduceText != null && introduceText != ''"
+ @click="audioPlay"
+ class="audio-control"
+ src="/img/navicon/audio.png"
+ alt
+ />
+ <img
+ @click="closeMapPopupBox"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="label-content">
+ <div class="arc-bcg">
+ <img :src="popupBgUrl" alt />
+ </div>
+ <div
+ v-show="siteName != null && siteName != ''"
+ class="site"
+ >
+ <strong>地址：</strong>
+ {{ siteName }}
+ </div>
+ <div
+ v-show="telephone != null && telephone != ''"
+ class="phone"
+ >
+ <strong>电话：</strong>
+ {{ telephone }}
+ </div>
+ <div
+ v-show="introduceText != null && introduceText != ''"
+ class="introduce"
+ >
+ <p ref="DomIntroduceText">
+ <strong>介绍：</strong>
+ <span v-html="introduceText"></span>
+ </p>
+ </div>
+ <div class="popup-nav">
+ <ul>
+ <li @click="comeHereClick">
+ <i class="popup-icon come-nav deblurring"></i>
+ 到这
+ </li>
+ <li @click="getToHereClick">
+ <i class="popup-icon start-nav deblurring"></i>
+ 出发
+ </li>
+ <li v-show="false" @click="qrCodeClick">
+ <i class="popup-icon qr-code-nav deblurring"></i>
+ 二维码
+ </li>
+ <li @click="imgsClick">
+ <i class="popup-icon atlas-nav deblurring"></i>
+ 图集
+ </li>
+ <li
+ v-show="panoramaUrl != null && panoramaUrl != ''"
+ @click="panoramaClick"
+ >
+ <i
+ class="popup-icon live-action-nav deblurring"
+ ></i>
+ 实景
+ </li>
+ <!-- v-show="panoramaUrl != null && panoramaUrl != ''" -->
+ <li v-show="false" @click="monitorClick">
+ <i class="popup-icon monitor-nav deblurring"></i>
+ 监控
+ </li>
+ </ul>
+ </div>
+ <div
+ v-show="teachList.length > 0 || liveList.length > 0"
+ class="arc-box"
+ >
+ <ul class="tab-btn">
+ <li
+ v-show="teachList.length > 0"
+ :class="{ on: tabBtnFlag == '教学科研行政' }"
+ @click="tabBtnClick('教学科研行政')"
+ >教学科研行政</li>
+ <li
+ v-show="liveList.length > 0"
+ :class="{ on: tabBtnFlag == '生活服务' }"
+ @click="tabBtnClick('生活服务')"
+ >生活服务</li>
+ </ul>
+ <div class="btm-content">
+ <div :class="{ on: tabBtnFlag == '教学科研行政' }">
+ <ul>
+ <li
+ v-for="(item, index) in teachList"
+ :key="index"
+ @click="mechanismDetailPopup(0, item)"
+ >
+ <i
+ class="popup-icon location-icon deblurring"
+ ></i>
+ {{ item }}
+ </li>
+ </ul>
+ </div>
+ <div :class="{ on: tabBtnFlag == '生活服务' }">
+ <ul>
+ <li
+ v-for="(item, index) in liveList"
+ :key="index"
+ @click="mechanismDetailPopup(1, item)"
+ >
+ <i
+ class="popup-icon location-icon deblurring"
+ ></i>
+ {{ item }}
+ </li>
+ </ul>
+ </div>
+ </div>
+ </div>
+ <div class="btm-box"></div>
+ </div>
+ </div>
+ </div>
+ <div class="b-t-l"></div>
+ <div class="b-b-r"></div>
</div>
- <div :class="{ on: tabBtnFlag == '生活服务' }">
- <ul>
- <li
- v-for="(item, index) in liveList"
- :key="index"
- @click="mechanismDetailPopup(1, item)"
- >
- <i
- class="popup-icon location-icon deblurring"
- ></i>
- {{ item }}
- </li>
- </ul>
- </div>
- </div>
+ <div class="arrow"></div>
</div>
- <div class="btm-box"></div>
- </div>
</div>
- </div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
</div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
- <div
- v-if="panoramaPopup"
- class="panorama-dom"
- :class="{ 'change-full': fullscreen }"
- id="PanoramaBox"
- >
- <div style="width: 100%; height: 100%">
- <div class="panorama-container">
- <div class="panorama-wrap">
- <div
- class="content-wrap"
+ <div
+ v-if="panoramaPopup"
+ class="panorama-dom"
:class="{ 'change-full': fullscreen }"
- id="FullScreenBox"
- >
- <div class="title">
- {{ stateName }}
- <img
- @click="screen"
- class="full-srceen-btn"
- :src="fullScreenUrl"
- alt
- />
- <img
- @click="closePanoramaPopupBox"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="content">
- <iframe
- allowfullscreen="true"
- :src="panoramaUrl"
- frameborder="0"
- ></iframe>
- </div>
- </div>
- </div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
-
- <div v-if="monitorPopup" class="monitor-dom" id="MonitorBox">
- <div style="width: 100%; height: 100%">
- <div class="monitor-container">
- <div class="monitor-wrap">
- <div class="content-wrap">
- <div class="title">
- {{ stateName }}
- <img
- @click="closeMonitorPopupBox"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="content">
- <video :src="monitorUrl" controls autoplay></video>
- </div>
- </div>
- </div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
-
- <div v-if="addTagPopup" class="divForms-dom" id="AddTagBox">
- <div style="width: 100%; height: 100%">
- <div class="divForms divForms-theme">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- 地图标记
- <img
- @click="closeAddTagBox"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="add-tag-content">
- <div>
- <el-input
- v-model="addTagName"
- placeholder="请输入标签名称"
- ></el-input>
+ id="PanoramaBox"
+ >
+ <div style="width: 100%; height: 100%">
+ <div class="panorama-container">
+ <div class="panorama-wrap">
+ <div
+ class="content-wrap"
+ :class="{ 'change-full': fullscreen }"
+ id="FullScreenBox"
+ >
+ <div class="title">
+ {{ stateName }}
+ <img
+ @click="screen"
+ class="full-srceen-btn"
+ :src="fullScreenUrl"
+ alt
+ />
+ <img
+ @click="closePanoramaPopupBox"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="content">
+ <iframe
+ allowfullscreen="true"
+ :src="panoramaUrl"
+ frameborder="0"
+ ></iframe>
+ </div>
+ </div>
+ </div>
+ <div class="arrow"></div>
</div>
- <div>
- <el-button type="primary" @click="createTag"
- >生成标记</el-button
- >
+ </div>
+ </div>
+
+ <div v-if="monitorPopup" class="monitor-dom" id="MonitorBox">
+ <div style="width: 100%; height: 100%">
+ <div class="monitor-container">
+ <div class="monitor-wrap">
+ <div class="content-wrap">
+ <div class="title">
+ {{ stateName }}
+ <img
+ @click="closeMonitorPopupBox"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="content">
+ <video :src="monitorUrl" controls autoplay></video>
+ </div>
+ </div>
+ </div>
+ <div class="arrow"></div>
</div>
- </div>
</div>
- </div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
</div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
- <div v-if="labelLayerDataShow" class="divForms-dom" id="labelLayerid">
- <div style="width: 100%; height: 100%">
- <div class="divForms divForms-theme">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- {{ nowlabelLayerData.name }} 二维码分享
- <img
- @click="closelabelLayerid"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
- </div>
- <div class="add-tag-content" style="height: 250px">
- <!-- data:image/png;base64, -->
- <img
- :src="nowlabelLayerData.qrcode"
- alt
- class="labelLayeridewm"
- style="width: 250px; height: 250px"
- />
- </div>
+ <div v-if="addTagPopup" class="divForms-dom" id="AddTagBox">
+ <div style="width: 100%; height: 100%">
+ <div class="divForms divForms-theme">
+ <div class="divForms-wrap">
+ <div class="area">
+ <div class="arrow-lt"></div>
+ <div class="b-t"></div>
+ <div class="b-r"></div>
+ <div class="b-b"></div>
+ <div class="b-l"></div>
+ <div class="arrow-rb"></div>
+ <div class="label-wrap">
+ <div class="title">
+ 地图标记
+ <img
+ @click="closeAddTagBox"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="add-tag-content">
+ <div>
+ <el-input v-model="addTagName" placeholder="请输入标签名称"></el-input>
+ </div>
+ <div>
+ <el-button type="primary" @click="createTag">生成标记</el-button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="b-t-l"></div>
+ <div class="b-b-r"></div>
+ </div>
+ <div class="arrow"></div>
+ </div>
</div>
- </div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
</div>
- <div class="arrow"></div>
- </div>
- </div>
- </div>
- </div>
- <!-- 新增编辑标签 -->
- <div v-if="addIconsLayerIconPopup" class="monitor-dom" id="leftNavsAdd">
- <div style="width: 100%; height: 100%">
- <div class="divForms divForms-theme">
- <div class="divForms-wrap">
- <div class="area">
- <div class="arrow-lt"></div>
- <div class="b-t"></div>
- <div class="b-r"></div>
- <div class="b-b"></div>
- <div class="b-l"></div>
- <div class="arrow-rb"></div>
- <div class="label-wrap">
- <div class="title">
- <el-input
- v-model="addIconFromcolumn[0].value"
- placeholder="请输入标签名称"
- class="addIconFromInput"
- >
- <template slot="prepend">标题:</template
- ><i
- slot="suffix"
- class="el-icon-edit el-input__icon addIconFromInputicon"
- ></i>
- </el-input>
- <img
- @click="closeaddIconsLayerIconPopup"
- class="close-box"
- src="/img/navicon/close.png"
- alt
- />
+ <div v-if="labelLayerDataShow" class="divForms-dom" id="labelLayerid">
+ <div style="width: 100%; height: 100%">
+ <div class="divForms divForms-theme">
+ <div class="divForms-wrap">
+ <div class="area">
+ <div class="arrow-lt"></div>
+ <div class="b-t"></div>
+ <div class="b-r"></div>
+ <div class="b-b"></div>
+ <div class="b-l"></div>
+ <div class="arrow-rb"></div>
+ <div class="label-wrap">
+ <div class="title">
+ {{ nowlabelLayerData.name }} 二维码分享
+ <img
+ @click="closelabelLayerid"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="add-tag-content" style="height: 250px">
+ <!-- data:image/png;base64, -->
+ <img
+ :src="nowlabelLayerData.qrcode"
+ alt
+ class="labelLayeridewm"
+ style="width: 250px; height: 250px"
+ />
+ </div>
+ </div>
+ </div>
+ <div class="b-t-l"></div>
+ <div class="b-b-r"></div>
+ </div>
+ <div class="arrow"></div>
+ </div>
</div>
- <div class="add-tag-content">
- <div class="addIconsLayer">
- <div
- :class="[
+ </div>
+ </div>
+
+ <!-- 新增编辑标签 -->
+ <div v-if="addIconsLayerIconPopup" class="monitor-dom" id="leftNavsAdd">
+ <div style="width: 100%; height: 100%">
+ <div class="divForms divForms-theme">
+ <div class="divForms-wrap">
+ <div class="area">
+ <div class="arrow-lt"></div>
+ <div class="b-t"></div>
+ <div class="b-r"></div>
+ <div class="b-b"></div>
+ <div class="b-l"></div>
+ <div class="arrow-rb"></div>
+ <div class="label-wrap">
+ <div class="title">
+ <el-input
+ v-model="addIconFromcolumn[0].value"
+ placeholder="请输入标签名称"
+ class="addIconFromInput"
+ >
+ <template slot="prepend">标题:</template>
+ <i
+ slot="suffix"
+ class="el-icon-edit el-input__icon addIconFromInputicon"
+ ></i>
+ </el-input>
+ <img
+ @click="closeaddIconsLayerIconPopup"
+ class="close-box"
+ src="/img/navicon/close.png"
+ alt
+ />
+ </div>
+ <div class="add-tag-content">
+ <div class="addIconsLayer">
+ <div
+ :class="[
'addIconsLayerinimgs',
ourImages.length > 3 ? 'isOverImgs' : '',
]"
- >
- <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
- <el-upload
- :action="
+ >
+ <!-- action="https://jsonplaceholder.typicode.com/posts/" -->
+ <el-upload
+ :action="
apiUrls +
'/blade-resource/oss/endpoint/put-files-talk'
"
- list-type="picture-card"
- :on-preview="handlePictureCardPreview"
- :on-remove="handleRemove"
- :on-success="onsuccess"
- >
- <i class="el-icon-plus"></i>
- </el-upload>
- <el-dialog
- :visible.sync="dialogVisible"
- :modal-append-to-body="false"
- :append-to-body="true"
- >
- <img width="100%" :src="dialogImageUrl" alt="" />
- </el-dialog>
- </div>
- <div
- class="addIconsLayerin"
- v-for="(item, index) in addIconFromcolumn"
- :key="index"
- v-show="index != 0"
- >
- <el-input
- v-model="item.value"
- :placeholder="'请输入' + item.label"
- class="addIconFromInput"
- :disabled="index == 2 || index == 3"
- >
- <template slot="prepend">{{ item.label }}:</template>
- </el-input>
+ list-type="picture-card"
+ :on-preview="handlePictureCardPreview"
+ :on-remove="handleRemove"
+ :on-success="onsuccess"
+ >
+ <i class="el-icon-plus"></i>
+ </el-upload>
+ <el-dialog
+ :visible.sync="dialogVisible"
+ :modal-append-to-body="false"
+ :append-to-body="true"
+ >
+ <img width="100%" :src="dialogImageUrl" alt />
+ </el-dialog>
+ </div>
+ <div
+ class="addIconsLayerin"
+ v-for="(item, index) in addIconFromcolumn"
+ :key="index"
+ v-show="index != 0"
+ >
+ <el-input
+ v-model="item.value"
+ :placeholder="'请输入' + item.label"
+ class="addIconFromInput"
+ :disabled="index == 2 || index == 3"
+ >
+ <template slot="prepend">{{ item.label }}:</template>
+ </el-input>
- <el-dropdown
- v-show="index == 2 || index == 3"
- @command="chouseAddicon"
- >
- <span class="el-dropdown-link">
- <i class="el-icon-arrow-down el-icon--right"></i>
- </span>
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item
- v-for="(itemc, indexc) in item.chouse"
- :key="indexc"
- :command="{ index: index, indexc: indexc }"
- >{{ itemc.value }}</el-dropdown-item
- >
- <!-- @click="chouseAddicon(index, indexc)" -->
- </el-dropdown-menu>
- </el-dropdown>
+ <el-dropdown
+ v-show="index == 2 || index == 3"
+ @command="chouseAddicon"
+ >
+ <span class="el-dropdown-link">
+ <i class="el-icon-arrow-down el-icon--right"></i>
+ </span>
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item
+ v-for="(itemc, indexc) in item.chouse"
+ :key="indexc"
+ :command="{ index: index, indexc: indexc }"
+ >{{ itemc.value }}</el-dropdown-item>
+ <!-- @click="chouseAddicon(index, indexc)" -->
+ </el-dropdown-menu>
+ </el-dropdown>
+ </div>
+ </div>
+ <div class="addIconsLayerBut">
+ <el-button type="primary" @click="saveIconsLayer">保存标签</el-button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="b-t-l"></div>
+ <div class="b-b-r"></div>
</div>
- </div>
- <div class="addIconsLayerBut">
- <el-button type="primary" @click="saveIconsLayer"
- >保存标签</el-button
- >
- </div>
+ <div class="arrow"></div>
</div>
- </div>
</div>
- <div class="b-t-l"></div>
- <div class="b-b-r"></div>
- </div>
- <div class="arrow"></div>
</div>
- </div>
- </div>
- <!-- 二维码弹框相关 -->
- <el-dialog
- title="场景二维码"
- :visible.sync="QRCodeFlag"
- :modal="false"
- :modal-append-to-body="false"
- width="44%"
- >
- <div style="margin: 0; position: relative; width: 100%; height: 352px">
- <img
- width="260"
- :src="pupupQRUrl"
- alt
- style="
+ <!-- 二维码弹框相关 -->
+ <el-dialog
+ title="场景二维码"
+ :visible.sync="QRCodeFlag"
+ :modal="false"
+ :modal-append-to-body="false"
+ width="44%"
+ >
+ <div style="margin: 0; position: relative; width: 100%; height: 352px">
+ <img
+ width="260"
+ :src="pupupQRUrl"
+ alt
+ style="
position: absolute;
top: 0;
left: 0;
@@ -435,731 +425,728 @@
bottom: 0;
margin: auto;
"
- />
- <div
- style="
+ />
+ <div
+ style="
position: absolute;
bottom: 0;
width: 100%;
line-height: 36px;
text-align: center;
"
- >
- (右键另存为图片)
- </div>
- </div>
- </el-dialog>
+ >(右键另存为图片)</div>
+ </div>
+ </el-dialog>
- <el-image
- v-show="false"
- style="width: 100px; height: 100px"
- :src="popupImgAtlas[0]"
- :preview-src-list="popupImgAtlas"
- ref="popupImgs"
- ></el-image>
- </div>
+ <el-image
+ v-show="false"
+ style="width: 100px; height: 100px"
+ :src="popupImgAtlas[0]"
+ :preview-src-list="popupImgAtlas"
+ ref="popupImgs"
+ ></el-image>
+ </div>
</template>
<script>
-import { mapGetters } from "vuex";
-import { getMechanismDetail } from "@/api/pc/public/arc";
-import { setlabel } from "@/api/pc/label";
-import { add } from "@/api/pc/leftNav/index";
+import { mapGetters } from 'vuex'
+import { getMechanismDetail } from '@/api/pc/public/arc'
+import { setlabel } from '@/api/pc/label'
+import { add } from '@/api/pc/leftNav/index'
export default {
- name: "mapPopup",
+ name: 'mapPopup',
- data() {
- let apiUrls = window.$apiUrls;
- return {
- ourImages: [],
- dialogImageUrl: "",
- dialogVisible: false,
- apiUrls: $apiUrls,
- DC: null,
- tabBtnFlag: "教学科研行政",
- QRCodeFlag: false,
- audioSource: "",
- audioFlag: false,
- audioCourse: false,
- audioSynth: null,
- audioMsg: null,
- fullscreen: false,
- fullScreenUrl: "/img/icon/bigScreen.png",
- addTagName: "",
- addTagLayer: null,
- addIconFromcolumn: [
- //顺序不要随便换
- {
- label: "名称",
- prop: "mechanismname",
- value: "",
- },
- {
- label: "电话",
- prop: "telephone",
- value: "",
- },
- {
- label: "所属建筑",
- prop: "type",
- dicUrl: "/api/blade-system/dict-biz/dictionary?code=building",
- props: {
- label: "dictValue",
- value: "dictKey",
- },
- value: "红旗校区",
- valueid: "1",
- chouse: [
- {
- id: "1",
- value: "红旗校区",
- },
- {
- id: "2",
- value: "黄河路",
- },
- {
- id: "3",
- value: "科学园",
- },
- {
- id: "4",
- value: "土木楼",
- },
- {
- id: "5",
- value: "三江校区",
- },
- ],
- },
- {
- label: "所属社区",
- searchLabelWidth: "110",
- value: "行政办公",
- valueid: "1",
- prop: "campus",
- dicUrl: "/api/blade-system/dict-biz/dictionary?code=campus",
- chouse: [
- {
- id: "1",
- value: "行政办公",
- },
- {
- id: "2",
- value: "教学科研",
- },
- {
- id: "3",
- value: "社区场馆",
- },
- {
- id: "4",
- value: "学生宿舍",
- },
- {
- id: "5",
- value: "文化风景",
- },
- {
- id: "6",
- value: "家属住宅",
- },
- {
- id: "7",
- value: "主要楼宇",
- },
- ],
- },
+ data () {
+ return {
+ ourImages: [],
+ dialogImageUrl: '',
+ dialogVisible: false,
+ apiUrls: null,
+ DC: null,
+ tabBtnFlag: '教学科研行政',
+ QRCodeFlag: false,
+ audioSource: '',
+ audioFlag: false,
+ audioCourse: false,
+ audioSynth: null,
+ audioMsg: null,
+ fullscreen: false,
+ fullScreenUrl: '/img/icon/bigScreen.png',
+ addTagName: '',
+ addTagLayer: null,
+ addIconFromcolumn: [
+ // 顺序不要随便换
+ {
+ label: '名称',
+ prop: 'mechanismname',
+ value: ''
+ },
+ {
+ label: '电话',
+ prop: 'telephone',
+ value: ''
+ },
+ {
+ label: '所属建筑',
+ prop: 'type',
+ dicUrl: '/api/blade-system/dict-biz/dictionary?code=building',
+ props: {
+ label: 'dictValue',
+ value: 'dictKey'
+ },
+ value: '红旗校区',
+ valueid: '1',
+ chouse: [
+ {
+ id: '1',
+ value: '红旗校区'
+ },
+ {
+ id: '2',
+ value: '黄河路'
+ },
+ {
+ id: '3',
+ value: '科学园'
+ },
+ {
+ id: '4',
+ value: '土木楼'
+ },
+ {
+ id: '5',
+ value: '三江校区'
+ }
+ ]
+ },
+ {
+ label: '所属社区',
+ searchLabelWidth: '110',
+ value: '行政办公',
+ valueid: '1',
+ prop: 'campus',
+ dicUrl: '/api/blade-system/dict-biz/dictionary?code=campus',
+ chouse: [
+ {
+ id: '1',
+ value: '行政办公'
+ },
+ {
+ id: '2',
+ value: '教学科研'
+ },
+ {
+ id: '3',
+ value: '社区场馆'
+ },
+ {
+ id: '4',
+ value: '学生宿舍'
+ },
+ {
+ id: '5',
+ value: '文化风景'
+ },
+ {
+ id: '6',
+ value: '家属住宅'
+ },
+ {
+ id: '7',
+ value: '主要楼宇'
+ }
+ ]
+ },
- {
- label: "介绍",
- prop: "introduce",
- value: "",
- component: "AvueUeditor",
- options: {
- action: "/api/blade-resource/oss/endpoint/put-file",
- props: {
- res: "data",
- url: "link",
- },
- },
- hide: true,
- minRows: 5,
- span: 24,
- },
- {
- label: "地址",
- hide: true,
- prop: "address",
- value: "",
- },
- {
- label: "全景地址",
- prop: "panoramaurl",
- value: "",
- },
- {
- label: "监控地址",
- hide: true,
- prop: "videourl",
- value: "",
- },
- {
- label: "网站地址",
- prop: "websiteurl",
- value: "",
- },
- {
- label: "经度",
- prop: "jd",
- value: "",
- rules: [
- {
- required: true,
- message: "请输入经度",
- trigger: "blur",
- },
- ],
- },
- {
- label: "纬度",
- prop: "wd",
- value: "",
- rules: [
- {
- required: true,
- message: "请输入纬度",
- trigger: "blur",
- },
- ],
- },
- {
- label: "偏航角",
- addDisplay: false,
- hide: true,
- prop: "heading",
- value: 0,
- },
- {
- label: "俯仰角",
- addDisplay: false,
- hide: true,
- prop: "pitch",
- value: -90,
- },
- {
- label: "翻转角",
- addDisplay: false,
- hide: true,
- prop: "roll",
- value: 0,
- },
+ {
+ label: '介绍',
+ prop: 'introduce',
+ value: '',
+ component: 'AvueUeditor',
+ options: {
+ action: '/api/blade-resource/oss/endpoint/put-file',
+ props: {
+ res: 'data',
+ url: 'link'
+ }
+ },
+ hide: true,
+ minRows: 5,
+ span: 24
+ },
+ {
+ label: '地址',
+ hide: true,
+ prop: 'address',
+ value: ''
+ },
+ {
+ label: '全景地址',
+ prop: 'panoramaurl',
+ value: ''
+ },
+ {
+ label: '监控地址',
+ hide: true,
+ prop: 'videourl',
+ value: ''
+ },
+ {
+ label: '网站地址',
+ prop: 'websiteurl',
+ value: ''
+ },
+ {
+ label: '经度',
+ prop: 'jd',
+ value: '',
+ rules: [
+ {
+ required: true,
+ message: '请输入经度',
+ trigger: 'blur'
+ }
+ ]
+ },
+ {
+ label: '纬度',
+ prop: 'wd',
+ value: '',
+ rules: [
+ {
+ required: true,
+ message: '请输入纬度',
+ trigger: 'blur'
+ }
+ ]
+ },
+ {
+ label: '偏航角',
+ addDisplay: false,
+ hide: true,
+ prop: 'heading',
+ value: 0
+ },
+ {
+ label: '俯仰角',
+ addDisplay: false,
+ hide: true,
+ prop: 'pitch',
+ value: -90
+ },
+ {
+ label: '翻转角',
+ addDisplay: false,
+ hide: true,
+ prop: 'roll',
+ value: 0
+ },
- {
- label: "高度",
- hide: true,
- addDisplay: false,
- prop: "gd",
- value: 0,
- },
+ {
+ label: '高度',
+ hide: true,
+ addDisplay: false,
+ prop: 'gd',
+ value: 0
+ }
- // {
- // label: "图片",
- // prop: "tpurl",
- // value: "",
- // // dataType: 'string',
- // type: "upload",
- // propsHttp: {
- // res: "data",
- // url: "link",
- // },
- // span: 10,
- // listType: "picture-card",
- // tip: "只能上传jpg/png文件，且不超过500kb",
- // action: "/api/blade-resource/oss/endpoint/put-file",
- // },
- // {
- // label: "二维码",
- // prop: "codeurl",
- // value: "",
- // type: "upload",
- // listType: "picture-card",
- // //dataType: 'string',
- // action: "/api/blade-resource/oss/endpoint/put-file",
- // propsHttp: {
- // res: "data",
- // url: "link",
- // },
- // span: 10,
- // },
- ],
- };
- },
- computed: {
- ...mapGetters([
- "viewer",
- "popupBgUrl",
- "pupupQRUrl",
- // 终点
- "terminus",
- // 起点
- "startingPoint",
- // 点信息
- "pointPosition",
- // 点名称
- "stateName",
- // 地址
- "siteName",
- // 电话
- "telephone",
- // 介绍
- "introduceText",
- // 详情弹框显示关闭
- "detailsPopup",
- // 全景地址
- "panoramaUrl",
- // 全景弹框显示关闭
- "panoramaPopup",
- // 监控地址
- "monitorUrl",
- // 监控弹框显示关闭
- "monitorPopup",
-
- "popupImgAtlas",
- // 教学
- "teachList",
- // 科研
- "liveList",
- // 校区内导航的显示关闭
- "campusNavFlag",
- "addTagPopup",
- "addTagPosition",
- //自定义标签弹窗
- "labelLayerDataShow",
- "nowlabelLayerData",
- "addIconsLayerIconPopup", //自定义标签编辑窗口
- "addIconsLayerIconPosition", //自定义标签坐标
- ]),
- },
- created() {
- this.DC = global.DC;
-
- this.audioSynth = window.speechSynthesis;
- this.audioMsg = new window.SpeechSynthesisUtterance();
-
- this.audioMsg.onend = function () {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- };
- },
- mounted() {},
- watch: {
- addIconsLayerIconPopup() {
- if (this.addIconsLayerIconPopup) {
- this.addIconFromcolumn[9].value = this.addIconsLayerIconPosition[0];
- this.addIconFromcolumn[10].value = this.addIconsLayerIconPosition[1];
- } else {
- for (let k in this.addIconFromcolumn) {
- if (k == 2) {
- this.addIconFromcolumn[k].value = "红旗校区";
- this.addIconFromcolumn[k].valueid = "1";
- continue;
- }
- if (k == 3) {
- this.addIconFromcolumn[k].value = "行政办公";
- this.addIconFromcolumn[k].valueid = "1";
- continue;
- }
- this.addIconFromcolumn[k].value = "";
+ // {
+ // label: "图片",
+ // prop: "tpurl",
+ // value: "",
+ // // dataType: 'string',
+ // type: "upload",
+ // propsHttp: {
+ // res: "data",
+ // url: "link",
+ // },
+ // span: 10,
+ // listType: "picture-card",
+ // tip: "只能上传jpg/png文件，且不超过500kb",
+ // action: "/api/blade-resource/oss/endpoint/put-file",
+ // },
+ // {
+ // label: "二维码",
+ // prop: "codeurl",
+ // value: "",
+ // type: "upload",
+ // listType: "picture-card",
+ // //dataType: 'string',
+ // action: "/api/blade-resource/oss/endpoint/put-file",
+ // propsHttp: {
+ // res: "data",
+ // url: "link",
+ // },
+ // span: 10,
+ // },
+ ]
}
- this.ourImages = [];
- this.$store.commit("set_closeMapClick", false); //开启其他操作
- }
},
- addTagPopup() {
- if (!this.addTagPopup) {
- // console.log("取消", "see");
- this.$store.commit("set_closeMapClick", false);
- }
+ computed: {
+ ...mapGetters([
+ 'viewer',
+ 'popupBgUrl',
+ 'pupupQRUrl',
+ // 终点
+ 'terminus',
+ // 起点
+ 'startingPoint',
+ // 点信息
+ 'pointPosition',
+ // 点名称
+ 'stateName',
+ // 地址
+ 'siteName',
+ // 电话
+ 'telephone',
+ // 介绍
+ 'introduceText',
+ // 详情弹框显示关闭
+ 'detailsPopup',
+ // 全景地址
+ 'panoramaUrl',
+ // 全景弹框显示关闭
+ 'panoramaPopup',
+ // 监控地址
+ 'monitorUrl',
+ // 监控弹框显示关闭
+ 'monitorPopup',
+
+ 'popupImgAtlas',
+ // 教学
+ 'teachList',
+ // 科研
+ 'liveList',
+ // 校区内导航的显示关闭
+ 'campusNavFlag',
+ 'addTagPopup',
+ 'addTagPosition',
+ // 自定义标签弹窗
+ 'labelLayerDataShow',
+ 'nowlabelLayerData',
+ 'addIconsLayerIconPopup', // 自定义标签编辑窗口
+ 'addIconsLayerIconPosition' // 自定义标签坐标
+ ])
},
- introduceText: {
- immediate: true,
- handler(newQuestion, oldQuestion) {
- this.audioSource = newQuestion;
- if (this.audioFlag == true) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
+ created () {
+ this.apiUrls = window.$apiUrls
+ this.DC = global.DC
+
+ this.audioSynth = window.speechSynthesis
+ this.audioMsg = new window.SpeechSynthesisUtterance()
+
+ this.audioMsg.onend = function () {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
}
- },
},
- teachList: {
- immediate: true,
- handler(newCode, oldCode) {
- if (newCode.length > 0) {
- this.tabBtnFlag = "教学科研行政";
- }
- },
- },
- liveList: {
- immediate: true,
- handler(newCode, oldCode) {
- if (newCode.length > 0 && this.teachList.length == 0) {
- this.tabBtnFlag = "生活服务";
- }
- },
- },
- detailsPopup: {
- immediate: true,
- handler(newCode, oldCode) {
- if (newCode == false) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- } else {
- if (this.audioFlag == true) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- }
- }
- },
- },
- },
- methods: {
- onsuccess(response, file, fileList) {
- this.ourImages = fileList;
- },
- handleRemove(file, fileList) {
- this.ourImages = fileList;
- },
- handlePictureCardPreview(file) {
- this.dialogImageUrl = file.url;
- this.dialogVisible = true;
- },
- chouseAddicon(item) {
- this.addIconFromcolumn[item.index].value =
- this.addIconFromcolumn[item.index].chouse[item.indexc].value;
- this.addIconFromcolumn[item.index].valueid =
- this.addIconFromcolumn[item.index].chouse[item.indexc].id;
- },
- closeaddIconsLayerIconPopup() {
- this.$store.commit("SET_addIconsLayerIconPopup", false);
- },
- saveIconsLayer() {
- var imgs = [];
- // console.log("see", this.ourImages);
- // return;
- for (var k in this.ourImages) {
- imgs.push(this.ourImages[k].response);
- }
- let d = {
- tpurl: imgs.join(","),
- mechanismname: this.addIconFromcolumn[0].value,
- telephone: this.addIconFromcolumn[1].value,
- type: this.addIconFromcolumn[2].valueid,
- campus: this.addIconFromcolumn[3].valueid,
- introduce: this.addIconFromcolumn[4].value,
- address: this.addIconFromcolumn[5].value,
- panoramaurl: this.addIconFromcolumn[6].value,
- videourl: this.addIconFromcolumn[7].value,
- websiteurl: this.addIconFromcolumn[8].value,
- jd: this.addIconFromcolumn[9].value,
- wd: this.addIconFromcolumn[10].value,
- heading: this.addIconFromcolumn[11].value,
- pitch: this.addIconFromcolumn[12].value,
- roll: this.addIconFromcolumn[13].value,
- gd: this.addIconFromcolumn[14].value,
- };
- // console.log(d, "see3");
- // return;
- // this.$store.commit("set_closeMapClick", false); //开启其他操作
- add(d).then(
- () => {
- this.$message({
- type: "success",
- message: "操作成功!",
- });
- this.closeaddIconsLayerIconPopup();
+ mounted () { },
+ watch: {
+ addIconsLayerIconPopup () {
+ if (this.addIconsLayerIconPopup) {
+ this.addIconFromcolumn[9].value = this.addIconsLayerIconPosition[0]
+ this.addIconFromcolumn[10].value = this.addIconsLayerIconPosition[1]
+ } else {
+ for (const k in this.addIconFromcolumn) {
+ if (k == 2) {
+ this.addIconFromcolumn[k].value = '红旗校区'
+ this.addIconFromcolumn[k].valueid = '1'
+ continue
+ }
+ if (k == 3) {
+ this.addIconFromcolumn[k].value = '行政办公'
+ this.addIconFromcolumn[k].valueid = '1'
+ continue
+ }
+ this.addIconFromcolumn[k].value = ''
+ }
+ this.ourImages = []
+ this.$store.commit('set_closeMapClick', false) // 开启其他操作
+ }
},
- (error) => {
- window.console.log(error);
+ addTagPopup () {
+ if (!this.addTagPopup) {
+ // console.log("取消", "see");
+ this.$store.commit('set_closeMapClick', false)
+ }
+ },
+ introduceText: {
+ immediate: true,
+ handler (newQuestion, oldQuestion) {
+ this.audioSource = newQuestion
+ if (this.audioFlag == true) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ }
+ }
+ },
+ teachList: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ if (newCode.length > 0) {
+ this.tabBtnFlag = '教学科研行政'
+ }
+ }
+ },
+ liveList: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ if (newCode.length > 0 && this.teachList.length == 0) {
+ this.tabBtnFlag = '生活服务'
+ }
+ }
+ },
+ detailsPopup: {
+ immediate: true,
+ handler (newCode, oldCode) {
+ if (newCode == false) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ } else {
+ if (this.audioFlag == true) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ }
+ }
+ }
}
- );
},
- screen() {
- if (this.fullscreen) {
- this.fullScreenUrl = "/img/icon/bigScreen.png";
- this.fullscreen = !this.fullscreen;
+ methods: {
+ onsuccess (response, file, fileList) {
+ this.ourImages = fileList
+ },
+ handleRemove (file, fileList) {
+ this.ourImages = fileList
+ },
+ handlePictureCardPreview (file) {
+ this.dialogImageUrl = file.url
+ this.dialogVisible = true
+ },
+ chouseAddicon (item) {
+ this.addIconFromcolumn[item.index].value =
+ this.addIconFromcolumn[item.index].chouse[item.indexc].value
+ this.addIconFromcolumn[item.index].valueid =
+ this.addIconFromcolumn[item.index].chouse[item.indexc].id
+ },
+ closeaddIconsLayerIconPopup () {
+ this.$store.commit('SET_addIconsLayerIconPopup', false)
+ },
+ saveIconsLayer () {
+ var imgs = []
+ // console.log("see", this.ourImages);
+ // return;
+ for (var k in this.ourImages) {
+ imgs.push(this.ourImages[k].response)
+ }
+ const d = {
+ tpurl: imgs.join(','),
+ mechanismname: this.addIconFromcolumn[0].value,
+ telephone: this.addIconFromcolumn[1].value,
+ type: this.addIconFromcolumn[2].valueid,
+ campus: this.addIconFromcolumn[3].valueid,
+ introduce: this.addIconFromcolumn[4].value,
+ address: this.addIconFromcolumn[5].value,
+ panoramaurl: this.addIconFromcolumn[6].value,
+ videourl: this.addIconFromcolumn[7].value,
+ websiteurl: this.addIconFromcolumn[8].value,
+ jd: this.addIconFromcolumn[9].value,
+ wd: this.addIconFromcolumn[10].value,
+ heading: this.addIconFromcolumn[11].value,
+ pitch: this.addIconFromcolumn[12].value,
+ roll: this.addIconFromcolumn[13].value,
+ gd: this.addIconFromcolumn[14].value
+ }
+ // console.log(d, "see3");
+ // return;
+ // this.$store.commit("set_closeMapClick", false); //开启其他操作
+ add(d).then(
+ () => {
+ this.$message({
+ type: 'success',
+ message: '操作成功!'
+ })
+ this.closeaddIconsLayerIconPopup()
+ },
+ (error) => {
+ window.console.log(error)
+ }
+ )
+ },
+ screen () {
+ if (this.fullscreen) {
+ this.fullScreenUrl = '/img/icon/bigScreen.png'
+ this.fullscreen = !this.fullscreen
- document.getElementById("pcElHeader").style.zIndex = 9999;
- } else {
- this.fullScreenUrl = "/img/icon/smallScreen.png";
- this.fullscreen = !this.fullscreen;
+ document.getElementById('pcElHeader').style.zIndex = 9999
+ } else {
+ this.fullScreenUrl = '/img/icon/smallScreen.png'
+ this.fullscreen = !this.fullscreen
- document.getElementById("pcElHeader").style.zIndex = 9;
- }
- },
+ document.getElementById('pcElHeader').style.zIndex = 9
+ }
+ },
- tabBtnClick(param) {
- this.tabBtnFlag = param;
- },
+ tabBtnClick (param) {
+ this.tabBtnFlag = param
+ },
- comeHereClick() {
- this.$store.commit("SET_COMENAME", this.stateName);
- this.$store.commit("SET_TERMINUS", this.pointPosition);
- if (this.campusNavFlag == false) {
- this.$store.commit("SET_CAMPUSNAVFLAG", true);
- }
- },
+ comeHereClick () {
+ this.$store.commit('SET_COMENAME', this.stateName)
+ this.$store.commit('SET_TERMINUS', this.pointPosition)
+ if (this.campusNavFlag == false) {
+ this.$store.commit('SET_CAMPUSNAVFLAG', true)
+ }
+ },
- getToHereClick() {
- this.$store.commit("SET_GETTONAME", this.stateName);
- this.$store.commit("SET_STARTINGPOINT", this.pointPosition);
- if (this.campusNavFlag == false) {
- this.$store.commit("SET_CAMPUSNAVFLAG", true);
- }
- },
+ getToHereClick () {
+ this.$store.commit('SET_GETTONAME', this.stateName)
+ this.$store.commit('SET_STARTINGPOINT', this.pointPosition)
+ if (this.campusNavFlag == false) {
+ this.$store.commit('SET_CAMPUSNAVFLAG', true)
+ }
+ },
- qrCodeClick() {
- this.QRCodeFlag = true;
- },
+ qrCodeClick () {
+ this.QRCodeFlag = true
+ },
- imgsClick() {
- this.$refs.popupImgs.clickHandler();
- },
+ imgsClick () {
+ this.$refs.popupImgs.clickHandler()
+ },
- panoramaClick() {
- if (this.audioFlag == true) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- }
+ panoramaClick () {
+ if (this.audioFlag == true) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ }
- // eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
- // eslint-disable-next-line new-cap
- new this.DC.Position.fromArray(this.pointPosition)
- );
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
- // eslint-disable-next-line no-unused-vars
- var panorama = new this.DC.PanoramaBox(this.viewer, {
- domId: "PanoramaBox",
- position: [positions],
- });
+ // eslint-disable-next-line new-cap
+ var positions = this.DC.Transform.transformWGS84ToCartesian(
+ // eslint-disable-next-line new-cap
+ new this.DC.Position.fromArray(this.pointPosition)
+ )
+ this.viewer.scene.globe.depthTestAgainstTerrain = false
+ // eslint-disable-next-line no-unused-vars
+ var panorama = new this.DC.PanoramaBox(this.viewer, {
+ domId: 'PanoramaBox',
+ position: [positions]
+ })
- this.$store.commit("SET_DETAILSPOPUP", false);
- this.$store.commit("SET_MONITORPOPUP", false);
- this.$store.commit("SET_PANORAMAPOPUP", true);
- },
+ this.$store.commit('SET_DETAILSPOPUP', false)
+ this.$store.commit('SET_MONITORPOPUP', false)
+ this.$store.commit('SET_PANORAMAPOPUP', true)
+ },
- monitorClick() {
- if (this.audioFlag == true) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- }
- // eslint-disable-next-line new-cap
- var positions = this.DC.Transform.transformWGS84ToCartesian(
- // eslint-disable-next-line new-cap
- new this.DC.Position.fromArray(this.pointPosition)
- );
- this.viewer.scene.globe.depthTestAgainstTerrain = false;
- // eslint-disable-next-line no-unused-vars
- var monitor = new this.DC.PanoramaBox(this.viewer, {
- domId: "MonitorBox",
- position: [positions],
- });
- this.$store.commit("SET_PANORAMAPOPUP", false);
- this.$store.commit("SET_DETAILSPOPUP", false);
- this.$store.commit("SET_MONITORPOPUP", true);
- },
+ monitorClick () {
+ if (this.audioFlag == true) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ }
+ // eslint-disable-next-line new-cap
+ var positions = this.DC.Transform.transformWGS84ToCartesian(
+ // eslint-disable-next-line new-cap
+ new this.DC.Position.fromArray(this.pointPosition)
+ )
+ this.viewer.scene.globe.depthTestAgainstTerrain = false
+ // eslint-disable-next-line no-unused-vars
+ var monitor = new this.DC.PanoramaBox(this.viewer, {
+ domId: 'MonitorBox',
+ position: [positions]
+ })
+ this.$store.commit('SET_PANORAMAPOPUP', false)
+ this.$store.commit('SET_DETAILSPOPUP', false)
+ this.$store.commit('SET_MONITORPOPUP', true)
+ },
- closeMapPopupBox() {
- if (this.audioFlag == true) {
- this.audioSynth.cancel();
- this.audioFlag = false;
- this.audioCourse = false;
- }
- this.$store.commit("SET_DETAILSPOPUP", false);
- },
+ closeMapPopupBox () {
+ if (this.audioFlag == true) {
+ this.audioSynth.cancel()
+ this.audioFlag = false
+ this.audioCourse = false
+ }
+ this.$store.commit('SET_DETAILSPOPUP', false)
+ },
- // 新增标记相关事件
- closeAddTagBox() {
- this.$store.commit("SET_ADDTAGPOPUP", false);
- },
- closelabelLayerid() {
- this.$store.commit("openLabelLayer", {
- show: false,
- });
- },
- createTag() {
- var that = this;
+ // 新增标记相关事件
+ closeAddTagBox () {
+ this.$store.commit('SET_ADDTAGPOPUP', false)
+ },
+ closelabelLayerid () {
+ this.$store.commit('openLabelLayer', {
+ show: false
+ })
+ },
+ createTag () {
+ var that = this
- // console.log(this.RemoveTheBlank(this.addTagName));
+ // console.log(this.RemoveTheBlank(this.addTagName));
- if (this.RemoveTheBlank(this.addTagName) == "") {
- this.$message("请输入标签名称");
- return;
- }
+ if (this.RemoveTheBlank(this.addTagName) == '') {
+ this.$message('请输入标签名称')
+ return
+ }
- this.$store.commit("SET_ADDTAGPOPUP", false);
+ this.$store.commit('SET_ADDTAGPOPUP', false)
- // if (this.addTagLayer == null) {
- // this.addTagLayer = new this.DC.HtmlLayer("addTagLayer");
- // this.viewer.addLayer(this.addTagLayer);
- // }
+ // if (this.addTagLayer == null) {
+ // this.addTagLayer = new this.DC.HtmlLayer("addTagLayer");
+ // this.viewer.addLayer(this.addTagLayer);
+ // }
- // 2022.3.2对接接口
- // 新增标签
- const data = {
- name: this.RemoveTheBlank(this.addTagName),
- jd: this.addTagPosition.lng,
- wd: this.addTagPosition.lat,
- };
- // console.log(data);
- setlabel(data).then((res) => {
- console.log(res);
- if (res.data.code == 200) {
- doit();
- that.$message({
- message: "新增标签成功",
- type: "success",
- });
- } else {
- that.$message({
- message: "新增标签失败",
- type: "warning",
- });
+ // 2022.3.2对接接口
+ // 新增标签
+ const data = {
+ name: this.RemoveTheBlank(this.addTagName),
+ jd: this.addTagPosition.lng,
+ wd: this.addTagPosition.lat
+ }
+ // console.log(data);
+ setlabel(data).then((res) => {
+ if (res.data.code == 200) {
+ doit()
+ that.$message({
+ message: '新增标签成功',
+ type: 'success'
+ })
+ } else {
+ that.$message({
+ message: '新增标签失败',
+ type: 'warning'
+ })
+ }
+ that.addTagName = ''
+ })
+ const doit = () => {
+ that.$store.dispatch('addLabelLayerIcon', {
+ // list: [data],
+ add: true
+ })
+ // const divIcon = new this.DC.DivIcon(
+ // new that.DC.Position(
+ // Number(that.addTagPosition.lng),
+ // Number(that.addTagPosition.lat),
+ // 0
+ // ),
+ // `
+ // <div class="tag-entitys-box">
+ // <div class="tag-content">
+ // ${that.addTagName}
+ // </div>
+ // <div class="tag-angle-content">
+ // <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
+ // </div>
+ // </div>
+ // `
+ // );
+ // this.addTagLayer.addOverlay(divIcon);
+ }
+ },
+
+ closePanoramaPopupBox () {
+ this.$store.commit('SET_PANORAMAURL', '')
+ this.$store.commit('SET_PANORAMAPOPUP', false)
+ },
+
+ closeMonitorPopupBox () {
+ this.$store.commit('SET_MONITORURL', '')
+ this.$store.commit('SET_MONITORPOPUP', false)
+ },
+
+ audioPlay () {
+ if (this.audioFlag == false) {
+ this.audioMsg.text = this.audioSource
+ this.audioSynth.speak(this.audioMsg)
+ this.audioFlag = true
+ this.audioCourse = true
+ } else {
+ if (this.audioCourse == true) {
+ this.audioSynth.pause()
+ this.audioCourse = false
+ } else {
+ this.audioSynth.resume()
+ this.audioCourse = true
+ }
+ }
+ },
+
+ mechanismDetailPopup (num, param) {
+ getMechanismDetail({ num: num, mechanismName: param }).then((res) => {
+ var result = res.data.data
+ this.$store.commit('CLEAR_ALL', null)
+
+ var imgArr = result.tpurl.split(',')
+
+ this.$store.commit('SET_POPUPBGURL', imgArr[0])
+ this.$store.commit('SET_POPUPQRURL', result.codeurl)
+ this.$store.commit('SET_POINTPOSITION', [
+ Number(result.jd),
+ Number(result.wd),
+ Number(result.gd),
+ Number(result.heading),
+ Number(result.pitch),
+ Number(result.roll)
+ ])
+ this.$store.commit('SET_STATENAME', result.mechanismname)
+ this.$store.commit('SET_SITENAME', result.address)
+ this.$store.commit('SET_TELEPHONE', result.telephone)
+ this.$store.commit('SET_INTRODUCETEXT', result.introduce)
+ this.$store.commit('SET_POPUPIMGATLAS', imgArr)
+
+ if (result.videourl && result.videourl != '') {
+ this.$store.commit('SET_MONITORURL', result.videourl)
+ }
+
+ this.newPopup(result)
+ this.viewer.flyToPosition(
+ new this.DC.Position(
+ Number(result.jd),
+ Number(result.wd),
+ 300,
+ Number(result.heading),
+ Number(result.pitch),
+ Number(result.roll)
+ ),
+ function () { },
+ 3
+ )
+ })
+ },
+
+ newPopup (item) {
+ const position = this.DC.Transform.transformWGS84ToCartesian(
+ new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
+ )
+ // eslint-disable-next-line no-unused-vars
+ var popup = new this.DC.DivForms(this.viewer, {
+ domId: 'divFormsDomBox',
+ position: [position]
+ })
+
+ this.$store.commit('SET_PANORAMAPOPUP', false)
+ this.$store.commit('SET_MONITORPOPUP', false)
+ this.$store.commit('SET_DETAILSPOPUP', true)
+ },
+
+ /**
+ * 删除左右两端的空格
+ */
+ RemoveTheBlank (str) {
+ return str.replace(/(^\s*)|(\s*$)/g, '')
}
- that.addTagName = "";
- });
- const doit = () => {
- that.$store.dispatch("addLabelLayerIcon", {
- // list: [data],
- add: true,
- });
- // const divIcon = new this.DC.DivIcon(
- // new that.DC.Position(
- // Number(that.addTagPosition.lng),
- // Number(that.addTagPosition.lat),
- // 0
- // ),
- // `
- // <div class="tag-entitys-box">
- // <div class="tag-content">
- // ${that.addTagName}
- // </div>
- // <div class="tag-angle-content">
- // <img src="https://map.hit.edu.cn/images/tarrow_xq.png">
- // </div>
- // </div>
- // `
- // );
- // this.addTagLayer.addOverlay(divIcon);
- };
- },
-
- closePanoramaPopupBox() {
- this.$store.commit("SET_PANORAMAURL", "");
- this.$store.commit("SET_PANORAMAPOPUP", false);
- },
-
- closeMonitorPopupBox() {
- this.$store.commit("SET_MONITORURL", "");
- this.$store.commit("SET_MONITORPOPUP", false);
- },
-
- audioPlay() {
- if (this.audioFlag == false) {
- this.audioMsg.text = this.audioSource;
- this.audioSynth.speak(this.audioMsg);
- this.audioFlag = true;
- this.audioCourse = true;
- } else {
- if (this.audioCourse == true) {
- this.audioSynth.pause();
- this.audioCourse = false;
- } else {
- this.audioSynth.resume();
- this.audioCourse = true;
- }
- }
- },
-
- mechanismDetailPopup(num, param) {
- getMechanismDetail({ num: num, mechanismName: param }).then((res) => {
- var result = res.data.data;
- this.$store.commit("CLEAR_ALL", null);
-
- var imgArr = result.tpurl.split(",");
-
- this.$store.commit("SET_POPUPBGURL", imgArr[0]);
- this.$store.commit("SET_POPUPQRURL", result.codeurl);
- this.$store.commit("SET_POINTPOSITION", [
- Number(result.jd),
- Number(result.wd),
- Number(result.gd),
- Number(result.heading),
- Number(result.pitch),
- Number(result.roll),
- ]);
- this.$store.commit("SET_STATENAME", result.mechanismname);
- this.$store.commit("SET_SITENAME", result.address);
- this.$store.commit("SET_TELEPHONE", result.telephone);
- this.$store.commit("SET_INTRODUCETEXT", result.introduce);
- this.$store.commit("SET_POPUPIMGATLAS", imgArr);
-
- if (result.videourl && result.videourl != "") {
- this.$store.commit("SET_MONITORURL", result.videourl);
- }
-
- this.newPopup(result);
- this.viewer.flyToPosition(
- new this.DC.Position(
- Number(result.jd),
- Number(result.wd),
- 300,
- Number(result.heading),
- Number(result.pitch),
- Number(result.roll)
- ),
- function () {},
- 3
- );
- });
- },
-
- newPopup(item) {
- const position = this.DC.Transform.transformWGS84ToCartesian(
- new this.DC.Position(Number(item.jd), Number(item.wd), Number(item.gd))
- );
- // eslint-disable-next-line no-unused-vars
- var popup = new this.DC.DivForms(this.viewer, {
- domId: "divFormsDomBox",
- position: [position],
- });
-
- this.$store.commit("SET_PANORAMAPOPUP", false);
- this.$store.commit("SET_MONITORPOPUP", false);
- this.$store.commit("SET_DETAILSPOPUP", true);
- },
-
- /**
- * 删除左右两端的空格
- */
- RemoveTheBlank(str) {
- return str.replace(/(^\s*)|(\s*$)/g, "");
- },
- },
-};
+ }
+}
</script>
<style>
.labelLayeridewm {
- width: 250px !important;
- height: 250px !important;
+ width: 250px !important;
+ height: 250px !important;
}
</style>
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 1a4116e..0712cea 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -305,7 +305,6 @@
var synceagleViewer = function () {
if (isRightTrigger) {
- console.log(eagleViewer.camera.heading)
viewer.camera.flyTo({
destination: eagleViewer.camera.position,
diff --git a/src/components/mobileActivity/index.vue b/src/components/mobileActivity/index.vue
index c367f2f..6a38840 100644
--- a/src/components/mobileActivity/index.vue
+++ b/src/components/mobileActivity/index.vue
@@ -1,509 +1,511 @@
<template>
- <div
- id="mobileActivity"
- :style="{ height: height + 'px' }"
- :class="[openValue ? 'isOpens' : 'notOpens']"
- v-if="showActivity"
- >
- <div class="mobileActivity_heard">
- <div class="mobileActivity_title">活动标题：{{ hdTitle }}</div>
- <div class="mobileActivity_close" @click="closeActivity">
- <i class="el-icon-close"></i>
- </div>
- </div>
- <div class="mobileActivity_in">
- <!-- <el-button type="primary" @click="init">open</el-button>
- <el-button type="success" @click="closeInit">close</el-button> -->
- <div class="mobileActivity_insmall">
- <!-- <img :src="imgs" alt="" class="mobileActivity_insmallimg" /> -->
- <el-image
- class="mobileActivity_insmallimg"
- :src="useData.url"
- :preview-src-list="useData.srcList"
- ></el-image>
- <div class="mobileActivity_insmallxiangqing">
- <div
- class="mobileActivity_insmallxiangqingIn"
- v-for="(item, index) in useData.smallData"
- :key="index"
- >
- <span class="mobileActivity_insmallxiangqingIn_s">{{
- item.lable
- }}</span
- >: {{ item.value }}
- </div>
+ <div
+ id="mobileActivity"
+ :style="{ height: height + 'px' }"
+ :class="[openValue ? 'isOpens' : 'notOpens']"
+ v-if="showActivity"
+ >
+ <div class="mobileActivity_heard">
+ <div class="mobileActivity_title">活动标题：{{ hdTitle }}</div>
+ <div class="mobileActivity_close" @click="closeActivity">
+ <i class="el-icon-close"></i>
+ </div>
</div>
- </div>
- <div class="mobileActivity_detailed">
- <div
- class="mobileActivity_detailedIn"
- v-for="(item, index) in useData.detailedData"
- :key="index"
- >
- <span class="mobileActivity_insmallxiangqingIn_s">{{
- item.lable
- }}</span
- >: {{ item.value }}
+ <div class="mobileActivity_in">
+ <!-- <el-button type="primary" @click="init">open</el-button>
+ <el-button type="success" @click="closeInit">close</el-button>-->
+ <div class="mobileActivity_insmall">
+ <!-- <img :src="imgs" alt="" class="mobileActivity_insmallimg" /> -->
+ <el-image
+ class="mobileActivity_insmallimg"
+ :src="useData.url"
+ :preview-src-list="useData.srcList"
+ ></el-image>
+ <div class="mobileActivity_insmallxiangqing">
+ <div
+ class="mobileActivity_insmallxiangqingIn"
+ v-for="(item, index) in useData.smallData"
+ :key="index"
+ >
+ <span class="mobileActivity_insmallxiangqingIn_s">
+ {{
+ item.lable
+ }}
+ </span>
+ : {{ item.value }}
+ </div>
+ </div>
+ </div>
+ <div class="mobileActivity_detailed">
+ <div
+ class="mobileActivity_detailedIn"
+ v-for="(item, index) in useData.detailedData"
+ :key="index"
+ >
+ <span class="mobileActivity_insmallxiangqingIn_s">
+ {{
+ item.lable
+ }}
+ </span>
+ : {{ item.value }}
+ </div>
+ </div>
</div>
- </div>
+ <div class="mobileActivity_coutrol" :style="{ bottom: bottom + 'px' }">
+ <ul>
+ <li
+ v-for="(item, index) in leftNavData"
+ :key="index"
+ @click="mobileActivityCoutrolClick(item)"
+ v-show="!item.notShow"
+ >
+ <img :src="item.img" alt />
+ <span>{{ item.label }}</span>
+ </li>
+ </ul>
+ </div>
</div>
- <div class="mobileActivity_coutrol" :style="{ bottom: bottom + 'px' }">
- <ul>
- <li
- v-for="(item, index) in leftNavData"
- :key="index"
- @click="mobileActivityCoutrolClick(item)"
- v-show="!item.notShow"
- >
- <img :src="item.img" alt="" />
- <span>{{ item.label }}</span>
- </li>
- </ul>
- </div>
- </div>
</template>
<script>
-import { mapGetters } from "vuex";
-import moveWindow from "./move";
+import { mapGetters } from 'vuex'
+import moveWindow from './move'
export default {
- name: "mobileActivity",
- computed: {
- ...mapGetters([
- "showActivity",
- "showActivityData",
- "drawALineLayerMany",
- "drawAPointLayerMany",
- ]),
- },
- data() {
- let heig = 135;
- let bottom = 150;
- return {
- useHeight: heig,
- height: heig,
- useBottom: bottom,
- bottom: bottom,
- openValue: false,
- domMove: null,
- start: 0,
- end: 0,
- hdTitle: "",
- // url: "",
- // srcList: [],
- useData: {},
- leftNavData: [
- {
- flag: true,
- label: "线路",
- // img: "/img/leftnav/tag.png",
- img: "/img/leftnav/tag-checked.png",
- normal: "/img/leftnav/tag.png",
- checked: "/img/leftnav/tag-checked.png",
- layer: "tagLayer",
- imgSrc: "https://map.hit.edu.cn/images/tarrow_xq.png",
- // imgSrc: "img/mobile/pink.png",
- layer: "drawALineLayerMany",
- },
- {
- flag: true,
- label: "标点",
- img: "/img/leftnav/way-checked.png",
- normal: "/img/leftnav/way.png",
- checked: "/img/leftnav/way-checked.png",
- layer: "wayLayer",
- imgSrc: "img/mobile/green.png",
- layer: "drawAPointLayerMany",
- },
- // {
- // flag: false,
- // label: "实景",
- // img: "/img/leftnav/scene.png",
- // normal: "/img/leftnav/scene.png",
- // checked: "/img/leftnav/scene-checked.png",
- // layer: "sceneLayer",
- // imgSrc: "img/leftnav/map-panorama.png",
- // // imgSrc: "img/mobile/blue.png",
- // },
- ],
- };
- },
- watch: {
- // openValue() {
- // if (this.openValue) {
- // let windowHeight = document.body.clientHeight;
- // this.height = windowHeight / 2;
- // } else {
- // this.height = this.useHeight;
- // }
- // },
- showActivity() {
- if (this.showActivity) {
- this.inToInit(); //初始化
- this.hdTitle = this.showActivityData.name;
-
- console.log(this.showActivityData);
- //new窗口对象
- let that = this;
- let windowHeight = document.body.clientHeight;
- this.doData(this.showActivityData); //使用数据
- // 获取最大高度避免数据过少，空格多
- // let heard = document.querySelector(".mobileActivity_heard");
- // let ins = document.querySelector(".mobileActivity_in");
- // console.log(heard, ins, 77777);
- this.checkDom("querySelector", ".mobileActivity_heard", (head) => {
- this.checkDom("querySelector", ".mobileActivity_in", (ins) => {
- console.log((head.offsetHeight + ins.offsetHeight) / 4);
- doit(head.offsetHeight + ins.offsetHeight);
- });
- });
- // return;
- let doit = (maxheights) => {
- this.domMove = new moveWindow({
- id: "mobileActivity",
- minHeight: that.useHeight,
- maxHeight: maxheights || windowHeight / 2,
- critical: maxheights / 4,
- fn: function (res) {
- that.height = +res.height;
- that.bottom = +res.height + 15;
- // console.log(+res.height, "=======");
- if (res.state != "on") {
- that.openValue = res.state;
- }
- },
- });
- this.domMove.init();
- // console.log(this.domMove);
- //转移···添加点和线
- let addressOur = this.changeData(
- this.useData.query,
- "addressname",
- "address"
- );
- let lxOur = this.changeData(this.useData.query, "lxname", "lx");
- // console.log(addressOur, lxOur);
- that.$store.dispatch("MSET_DRAWALINELAYERMANY", [
- lxOur,
- addressOur,
- this.useData.query,
- function () {
- that.domMove.opens(false, true);
- },
- ]);
- };
- }
+ name: 'mobileActivity',
+ computed: {
+ ...mapGetters([
+ 'showActivity',
+ 'showActivityData',
+ 'drawALineLayerMany',
+ 'drawAPointLayerMany'
+ ])
},
- },
- mounted() {},
- methods: {
- inToInit() {
- //初始化
- this.openValue = false;
- this.height = this.useHeight;
- this.bottom = this.useBottom;
- for (let k in this.leftNavData) {
- this.leftNavData[k].flag = true;
- this.leftNavData[k].img = this.leftNavData[k].checked;
- }
- },
- //处理主数据
- doData(val) {
- let srcList = val.opendata.tpurl.split(",");
- this.useData = {
- data: val,
- url: srcList[0],
- srcList: srcList,
- smallData: [
- {
- lable: "主办方",
- value: val.opendata.sponsor,
- },
- {
- lable: "承办方",
- value: val.opendata.undertake,
- },
- ],
- detailedData: [
- {
- lable: "活动时间",
- value: val.opendata.time,
- },
- {
- lable: "活动详情",
- value: val.opendata.context,
- },
- ],
- query: {
- name: val.opendata.hdname,
- bgImg: val.opendata.tpurl,
- from: "活动",
- websiteUrl: val.opendata.websiteurl,
- telePhone: val.opendata.telephone,
- introduce: val.opendata.context,
- video: val.opendata.videourl,
- // buts: ["定位"],
- //活动添加的字段
- addressname: val.opendata.addressname.split(";"),
- address: val.opendata.address.split(";"),
- lxname: val.opendata.lxname.split(";"),
- lx: val.opendata.lx.split(";"),
- lntLat: [
- val.opendata.address.split(";")[0].split(",")[0],
- val.opendata.address.split(";")[0].split(",")[1],
- ],
- panoramaurl: val.opendata.panoramaurl, //全景
- },
- };
- },
- //启动监听事件
- init() {
- this.domMove.init();
- },
- //关闭监听事件
- closeInit() {
- this.domMove.closeInit();
- },
- //控制线路和点的显影
- mobileActivityCoutrolClick(item) {
- item.flag = !item.flag;
- if (item.flag == true) {
- item.img = item.checked;
- } else {
- item.img = item.normal;
- }
- this.$store.commit("showLineOrPoint", {
- layer: item.layer,
- flag: item.flag,
- });
- },
- changeData(data, name, value) {
- let arr = [];
- for (let k in data[name]) {
- arr.push({
- name: data[name][k],
- value:
- name == "lxname"
- ? data[value][k]
- .split("(")[1]
- .split(")")[0]
- .split(",")
- .join(";")
- .split(" ")
- .join(",")
- : [+data[value][k].split(",")[0], +data[value][k].split(",")[1]],
- });
- }
- return arr;
- },
- closeActivity() {
- this.$store.commit("set_showActivity", { state: false });
- if (this.domMove) {
- this.closeInit();
- }
- //关闭路线和点的图层
- this.$store.commit("removePolylineMany");
- //关闭随地图弹窗
- this.$store.dispatch("closeMobileWindowsDom");
- //显示右侧栏
- this.$store.commit("SET_SeeAndNotSee", true);
- },
- checkDom(methods, name, fn) {
- // 声明定时器
- var timer = null;
- // 检查dom是否执行完成
- function checkDom() {
- // let dom = that.$refs[name];
- let dom = document[methods](name);
- if (dom) {
- // 执行dom加载完成后的操作
- // 清除定时器
- if (!timer) {
- clearTimeout(timer);
- }
- if (fn) {
- //回调函数
- fn(dom);
- return;
- } else {
- return dom;
- }
- } else {
- // 自我调用
- timer = setTimeout(checkDom, 100);
+ data () {
+ const heig = 135
+ const bottom = 150
+ return {
+ useHeight: heig,
+ height: heig,
+ useBottom: bottom,
+ bottom: bottom,
+ openValue: false,
+ domMove: null,
+ start: 0,
+ end: 0,
+ hdTitle: '',
+ // url: "",
+ // srcList: [],
+ useData: {},
+ leftNavData: [
+ {
+ flag: true,
+ label: '线路',
+ // img: "/img/leftnav/tag.png",
+ img: '/img/leftnav/tag-checked.png',
+ normal: '/img/leftnav/tag.png',
+ checked: '/img/leftnav/tag-checked.png',
+ layer: 'tagLayer',
+ imgSrc: 'https://map.hit.edu.cn/images/tarrow_xq.png',
+ // imgSrc: "img/mobile/pink.png",
+ layer: 'drawALineLayerMany'
+ },
+ {
+ flag: true,
+ label: '标点',
+ img: '/img/leftnav/way-checked.png',
+ normal: '/img/leftnav/way.png',
+ checked: '/img/leftnav/way-checked.png',
+ layer: 'wayLayer',
+ imgSrc: 'img/mobile/green.png',
+ layer: 'drawAPointLayerMany'
+ }
+ // {
+ // flag: false,
+ // label: "实景",
+ // img: "/img/leftnav/scene.png",
+ // normal: "/img/leftnav/scene.png",
+ // checked: "/img/leftnav/scene-checked.png",
+ // layer: "sceneLayer",
+ // imgSrc: "img/leftnav/map-panorama.png",
+ // // imgSrc: "img/mobile/blue.png",
+ // },
+ ]
}
- }
- // 首次执行
- checkDom();
},
- },
-};
+ watch: {
+ // openValue() {
+ // if (this.openValue) {
+ // let windowHeight = document.body.clientHeight;
+ // this.height = windowHeight / 2;
+ // } else {
+ // this.height = this.useHeight;
+ // }
+ // },
+ showActivity () {
+ if (this.showActivity) {
+ this.inToInit() // 初始化
+ this.hdTitle = this.showActivityData.name
+
+ // new窗口对象
+ const that = this
+ const windowHeight = document.body.clientHeight
+ this.doData(this.showActivityData) // 使用数据
+ // 获取最大高度避免数据过少，空格多
+ // let heard = document.querySelector(".mobileActivity_heard");
+ // let ins = document.querySelector(".mobileActivity_in");
+ // console.log(heard, ins, 77777);
+ this.checkDom('querySelector', '.mobileActivity_heard', (head) => {
+ this.checkDom('querySelector', '.mobileActivity_in', (ins) => {
+ console.log((head.offsetHeight + ins.offsetHeight) / 4)
+ doit(head.offsetHeight + ins.offsetHeight)
+ })
+ })
+ // return;
+ const doit = (maxheights) => {
+ this.domMove = new moveWindow({
+ id: 'mobileActivity',
+ minHeight: that.useHeight,
+ maxHeight: maxheights || windowHeight / 2,
+ critical: maxheights / 4,
+ fn: function (res) {
+ that.height = +res.height
+ that.bottom = +res.height + 15
+ // console.log(+res.height, "=======");
+ if (res.state != 'on') {
+ that.openValue = res.state
+ }
+ }
+ })
+ this.domMove.init()
+ // console.log(this.domMove);
+ // 转移···添加点和线
+ const addressOur = this.changeData(
+ this.useData.query,
+ 'addressname',
+ 'address'
+ )
+ const lxOur = this.changeData(this.useData.query, 'lxname', 'lx')
+ // console.log(addressOur, lxOur);
+ that.$store.dispatch('MSET_DRAWALINELAYERMANY', [
+ lxOur,
+ addressOur,
+ this.useData.query,
+ function () {
+ that.domMove.opens(false, true)
+ }
+ ])
+ }
+ }
+ }
+ },
+ mounted () { },
+ methods: {
+ inToInit () {
+ // 初始化
+ this.openValue = false
+ this.height = this.useHeight
+ this.bottom = this.useBottom
+ for (const k in this.leftNavData) {
+ this.leftNavData[k].flag = true
+ this.leftNavData[k].img = this.leftNavData[k].checked
+ }
+ },
+ // 处理主数据
+ doData (val) {
+ const srcList = val.opendata.tpurl.split(',')
+ this.useData = {
+ data: val,
+ url: srcList[0],
+ srcList: srcList,
+ smallData: [
+ {
+ lable: '主办方',
+ value: val.opendata.sponsor
+ },
+ {
+ lable: '承办方',
+ value: val.opendata.undertake
+ }
+ ],
+ detailedData: [
+ {
+ lable: '活动时间',
+ value: val.opendata.time
+ },
+ {
+ lable: '活动详情',
+ value: val.opendata.context
+ }
+ ],
+ query: {
+ name: val.opendata.hdname,
+ bgImg: val.opendata.tpurl,
+ from: '活动',
+ websiteUrl: val.opendata.websiteurl,
+ telePhone: val.opendata.telephone,
+ introduce: val.opendata.context,
+ video: val.opendata.videourl,
+ // buts: ["定位"],
+ // 活动添加的字段
+ addressname: val.opendata.addressname.split(';'),
+ address: val.opendata.address.split(';'),
+ lxname: val.opendata.lxname.split(';'),
+ lx: val.opendata.lx.split(';'),
+ lntLat: [
+ val.opendata.address.split(';')[0].split(',')[0],
+ val.opendata.address.split(';')[0].split(',')[1]
+ ],
+ panoramaurl: val.opendata.panoramaurl // 全景
+ }
+ }
+ },
+ // 启动监听事件
+ init () {
+ this.domMove.init()
+ },
+ // 关闭监听事件
+ closeInit () {
+ this.domMove.closeInit()
+ },
+ // 控制线路和点的显影
+ mobileActivityCoutrolClick (item) {
+ item.flag = !item.flag
+ if (item.flag == true) {
+ item.img = item.checked
+ } else {
+ item.img = item.normal
+ }
+ this.$store.commit('showLineOrPoint', {
+ layer: item.layer,
+ flag: item.flag
+ })
+ },
+ changeData (data, name, value) {
+ const arr = []
+ for (const k in data[name]) {
+ arr.push({
+ name: data[name][k],
+ value:
+ name == 'lxname'
+ ? data[value][k]
+ .split('(')[1]
+ .split(')')[0]
+ .split(',')
+ .join(';')
+ .split(' ')
+ .join(',')
+ : [+data[value][k].split(',')[0], +data[value][k].split(',')[1]]
+ })
+ }
+ return arr
+ },
+ closeActivity () {
+ this.$store.commit('set_showActivity', { state: false })
+ if (this.domMove) {
+ this.closeInit()
+ }
+ // 关闭路线和点的图层
+ this.$store.commit('removePolylineMany')
+ // 关闭随地图弹窗
+ this.$store.dispatch('closeMobileWindowsDom')
+ // 显示右侧栏
+ this.$store.commit('SET_SeeAndNotSee', true)
+ },
+ checkDom (methods, name, fn) {
+ // 声明定时器
+ var timer = null
+ // 检查dom是否执行完成
+ function checkDom () {
+ // let dom = that.$refs[name];
+ const dom = document[methods](name)
+ if (dom) {
+ // 执行dom加载完成后的操作
+ // 清除定时器
+ if (!timer) {
+ clearTimeout(timer)
+ }
+ if (fn) {
+ // 回调函数
+ fn(dom)
+ } else {
+ return dom
+ }
+ } else {
+ // 自我调用
+ timer = setTimeout(checkDom, 100)
+ }
+ }
+ // 首次执行
+ checkDom()
+ }
+ }
+}
</script>
<style lang="scss">
#mobileActivity {
- position: fixed;
- bottom: 0px;
- left: 0px;
- width: 100%;
- // height: 50px;
- background-color: #fff;
- z-index: 999;
- transition: height 0.1s;
- border-radius: 15px 15px 0 0;
- .mobileActivity_heard {
- height: 35px;
+ position: fixed;
+ bottom: 0px;
+ left: 0px;
+ width: 100%;
+ // height: 50px;
+ background-color: #fff;
+ z-index: 999;
+ transition: height 0.1s;
border-radius: 15px 15px 0 0;
- width: 100%;
- background-color: #409eff;
- color: #fff;
- border-bottom: 1px solid rgba($color: #acacac, $alpha: 0.5);
- box-shadow: 0 0px 10px -3px rgba($color: #acacac, $alpha: 0.5);
- .mobileActivity_title {
- width: 100%;
- height: 100%;
- line-height: 35px;
- text-indent: 1rem;
- }
- .mobileActivity_close {
- position: absolute;
- right: 5px;
- top: 5px;
- font-size: 25px;
- }
- }
- .mobileActivity_in {
- width: 100%;
- height: auto;
- overflow: hidden;
- padding-bottom: 5px;
- .mobileActivity_insmall {
- background-color: #fff;
- width: 100%;
- display: flex;
- align-items: center;
- justify-content: space-around;
- .mobileActivity_insmallimg {
- width: 90px;
- height: 90px;
- }
- .mobileActivity_insmallxiangqing {
- width: calc(100% - 110px);
- height: 94px;
- display: flex;
- align-items: center;
- justify-content: space-around;
- flex-direction: column;
- .mobileActivity_insmallxiangqingIn {
- width: 100%;
- }
- }
- }
- .mobileActivity_detailed {
- background-color: rgba(202, 202, 202, 0.2);
- padding: 3px 0 0 0;
- width: 100%;
- height: 100%;
- box-sizing: border-box;
- .mobileActivity_detailedIn {
- background-color: #fff;
- box-sizing: border-box;
+ .mobileActivity_heard {
+ height: 35px;
+ border-radius: 15px 15px 0 0;
width: 100%;
- padding: 5px;
- margin: 0 0 3px 0;
- }
+ background-color: #409eff;
+ color: #fff;
+ border-bottom: 1px solid rgba($color: #acacac, $alpha: 0.5);
+ box-shadow: 0 0px 10px -3px rgba($color: #acacac, $alpha: 0.5);
+ .mobileActivity_title {
+ width: 100%;
+ height: 100%;
+ line-height: 35px;
+ text-indent: 1rem;
+ }
+ .mobileActivity_close {
+ position: absolute;
+ right: 5px;
+ top: 5px;
+ font-size: 25px;
+ }
}
- .mobileActivity_insmallxiangqingIn_s {
- font-weight: 600;
+ .mobileActivity_in {
+ width: 100%;
+ height: auto;
+ overflow: hidden;
+ padding-bottom: 5px;
+ .mobileActivity_insmall {
+ background-color: #fff;
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ .mobileActivity_insmallimg {
+ width: 90px;
+ height: 90px;
+ }
+ .mobileActivity_insmallxiangqing {
+ width: calc(100% - 110px);
+ height: 94px;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ flex-direction: column;
+ .mobileActivity_insmallxiangqingIn {
+ width: 100%;
+ }
+ }
+ }
+ .mobileActivity_detailed {
+ background-color: rgba(202, 202, 202, 0.2);
+ padding: 3px 0 0 0;
+ width: 100%;
+ height: 100%;
+ box-sizing: border-box;
+ .mobileActivity_detailedIn {
+ background-color: #fff;
+ box-sizing: border-box;
+ width: 100%;
+ padding: 5px;
+ margin: 0 0 3px 0;
+ }
+ }
+ .mobileActivity_insmallxiangqingIn_s {
+ font-weight: 600;
+ }
}
- }
}
.notOpens {
- &::after {
- content: "";
- display: block;
- width: 20px;
- height: 4px;
- background-color: rgba(202, 202, 202, 1);
- position: absolute;
- top: -9px;
- left: calc(50% - 10px);
- border-radius: 5px;
- }
+ &::after {
+ content: '';
+ display: block;
+ width: 20px;
+ height: 4px;
+ background-color: rgba(202, 202, 202, 1);
+ position: absolute;
+ top: -9px;
+ left: calc(50% - 10px);
+ border-radius: 5px;
+ }
}
.isOpens {
- &::after {
- content: "";
- display: block;
- width: 13px;
- height: 4px;
- background-color: rgba(202, 202, 202, 1);
- position: absolute;
- top: -9px;
- left: calc(50% - 12px);
- border-radius: 5px;
- transform: rotate(30deg);
- }
- &::before {
- content: "";
- display: block;
- width: 13px;
- height: 4px;
- background-color: rgba(202, 202, 202, 1);
- position: absolute;
- top: -9px;
- left: calc(50% - 4px);
- border-radius: 5px;
- transform: rotate(-30deg);
- }
+ &::after {
+ content: '';
+ display: block;
+ width: 13px;
+ height: 4px;
+ background-color: rgba(202, 202, 202, 1);
+ position: absolute;
+ top: -9px;
+ left: calc(50% - 12px);
+ border-radius: 5px;
+ transform: rotate(30deg);
+ }
+ &::before {
+ content: '';
+ display: block;
+ width: 13px;
+ height: 4px;
+ background-color: rgba(202, 202, 202, 1);
+ position: absolute;
+ top: -9px;
+ left: calc(50% - 4px);
+ border-radius: 5px;
+ transform: rotate(-30deg);
+ }
}
.mobileActivity_coutrol {
- position: fixed;
- bottom: 150px;
- left: 0px;
- z-index: 200;
- background-color: #fff;
- border-radius: 0 17px 17px 0;
- transition: all 0.18s;
- ul {
- position: relative;
- top: 3px;
- }
- li {
- margin-bottom: 6px;
- font-weight: 400;
- display: block;
- width: 80px;
- height: 30px;
- line-height: 30px;
+ position: fixed;
+ bottom: 150px;
+ left: 0px;
+ z-index: 200;
background-color: #fff;
- border-radius: 15px;
- text-align: center;
- font-size: 0;
- cursor: pointer;
-
- img {
- position: relative;
- transition: all 0.5s;
- width: 24px;
- height: 24px;
- vertical-align: middle;
- margin-right: 10px;
- image-rendering: -moz-crisp-edges;
- image-rendering: -o-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: crisp-edges;
- -ms-interpolation-mode: nearest-neighbor;
+ border-radius: 0 17px 17px 0;
+ transition: all 0.18s;
+ ul {
+ position: relative;
+ top: 3px;
}
+ li {
+ margin-bottom: 6px;
+ font-weight: 400;
+ display: block;
+ width: 80px;
+ height: 30px;
+ line-height: 30px;
+ background-color: #fff;
+ border-radius: 15px;
+ text-align: center;
+ font-size: 0;
+ cursor: pointer;
- span {
- display: inline-block;
- vertical-align: middle;
- font-size: 14px;
- color: #2f2f2f;
+ img {
+ position: relative;
+ transition: all 0.5s;
+ width: 24px;
+ height: 24px;
+ vertical-align: middle;
+ margin-right: 10px;
+ image-rendering: -moz-crisp-edges;
+ image-rendering: -o-crisp-edges;
+ image-rendering: -webkit-optimize-contrast;
+ image-rendering: crisp-edges;
+ -ms-interpolation-mode: nearest-neighbor;
+ }
+
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ color: #2f2f2f;
+ }
}
- }
}
</style>
diff --git a/src/pcviews/tool/sign.vue b/src/pcviews/tool/sign.vue
index a237c9b..dbfd369 100644
--- a/src/pcviews/tool/sign.vue
+++ b/src/pcviews/tool/sign.vue
@@ -1,200 +1,192 @@
<template>
- <public-box class="tool-sign">
- <template slot="public-box-header">
- <div class="title">
- <img class="icon deblurring" src="/img/icon/tool-sign.png" alt />
- <span>地图标记</span>
- </div>
- <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
- </template>
- <template slot="public-box-content">
- <div class="list-box">
- <ul v-show="signList.length > 0">
- <li
- v-for="(item, index) in signList"
- :key="index"
- @click="dingw(item)"
- >
- <img src="/img/icon/sign-list.png" alt />
- {{ item.name }}
- <el-button
- type="danger"
- size="mini"
- icon="el-icon-delete"
- circle
- @click.stop="deleteIcon(item.id)"
- ></el-button>
- </li>
- </ul>
- <div v-show="signList.length == 0" class="no-data">
- <img src="/img/icon/no-data.png" alt />
- <div>暂无数据</div>
- </div>
- </div>
- <div class="btn-box">
- <el-button type="primary" size="mini" @click.stop="addSign"
- >新增</el-button
- >
- </div>
- <div>
- <img
- src='"/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAFeAV4DASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6er…sf2r7P5P76OTdt8zd9xjjG5evrXsFFFABXj/x08E+IvGP9g/2Bp/2z7L9o8799HHt3eXt++wzna3T0r2CigD5A/wCFJfEP/oXv/J23/wDjlfR/xS0TUfEfw41bSdJt/tF9P5Plxb1TdtmRjyxAHAJ5NdhRQB4/8C/BPiLwd/b39v6f9j+1fZ/J/fRybtvmbvuMcY3L19a5D4pfC3xl4j+I+ratpOjfaLGfyfLl+1Qpu2wop4ZwRyCORX0fRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFAH//2Q=="'
- alt=""
- />
- </div>
- </template>
- </public-box>
+ <public-box class="tool-sign">
+ <template slot="public-box-header">
+ <div class="title">
+ <img class="icon deblurring" src="/img/icon/tool-sign.png" alt />
+ <span>地图标记</span>
+ </div>
+ <img class="close" src="/img/navicon/close.png" alt @click="closeModel" />
+ </template>
+ <template slot="public-box-content">
+ <div class="list-box">
+ <ul v-show="signList.length > 0">
+ <li v-for="(item, index) in signList" :key="index" @click="dingw(item)">
+ <img src="/img/icon/sign-list.png" alt />
+ {{ item.name }}
+ <el-button
+ type="danger"
+ size="mini"
+ icon="el-icon-delete"
+ circle
+ @click.stop="deleteIcon(item.id)"
+ ></el-button>
+ </li>
+ </ul>
+ <div v-show="signList.length == 0" class="no-data">
+ <img src="/img/icon/no-data.png" alt />
+ <div>暂无数据</div>
+ </div>
+ </div>
+ <div class="btn-box">
+ <el-button type="primary" size="mini" @click.stop="addSign">新增</el-button>
+ </div>
+ <div>
+ <img
+ src=""/9j/4AAQSkZJRgABAgAAAQABAAD/2wBDAAgGBgcGBQgHBwcJCQgKDBQNDAsLDBkSEw8UHRofHh0aHBwgJC4nICIsIxwcKDcpLDAxNDQ0Hyc5PTgyPC4zNDL/2wBDAQkJCQwLDBgNDRgyIRwhMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjIyMjL/wAARCAFeAV4DASIAAhEBAxEB/8QAHwAAAQUBAQEBAQEAAAAAAAAAAAECAwQFBgcICQoL/8QAtRAAAgEDAwIEAwUFBAQAAAF9AQIDAAQRBRIhMUEGE1FhByJxFDKBkaEII0KxwRVS0fAkM2JyggkKFhcYGRolJicoKSo0NTY3ODk6Q0RFRkdISUpTVFVWV1hZWmNkZWZnaGlqc3R1dnd4eXqDhIWGh4iJipKTlJWWl5iZmqKjpKWmp6ipqrKztLW2t7i5usLDxMXGx8jJytLT1NXW19jZ2uHi4+Tl5ufo6er…sf2r7P5P76OTdt8zd9xjjG5evrXsFFFABXj/x08E+IvGP9g/2Bp/2z7L9o8799HHt3eXt++wzna3T0r2CigD5A/wCFJfEP/oXv/J23/wDjlfR/xS0TUfEfw41bSdJt/tF9P5Plxb1TdtmRjyxAHAJ5NdhRQB4/8C/BPiLwd/b39v6f9j+1fZ/J/fRybtvmbvuMcY3L19a5D4pfC3xl4j+I+ratpOjfaLGfyfLl+1Qpu2wop4ZwRyCORX0fRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFABRRRQAUUUUAFFFFAH//2Q==""
+ alt
+ />
+ </div>
+ </template>
+ </public-box>
</template>
<script>
-import { mapGetters } from "vuex";
-import { getlabel, deletelabel } from "@/api/pc/label";
+import { mapGetters } from 'vuex'
+import { getlabel, deletelabel } from '@/api/pc/label'
export default {
- data() {
- return {
- DC: null,
- signList: [],
- destroyedFlag: true,
- };
- },
- computed: {
- ...mapGetters(["viewer", "addSignList"]),
- },
- mounted() {
- this.$store.commit("initLabelLayer", this.viewer);
- this.getData();
- },
- watch: {
- addSignList() {
- this.getData();
- },
- },
- methods: {
- dingw(item) {
- let that = this;
- // console.log(item);
- // this.$store.dispatch("mapFlyTo", {
- // lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732
- // heading: 0,
- // pitch: -90,
- // roll: 0,
- // noOpen: true,
- // mviewer: that.viewer,
- // });
- that.viewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- item.jd,
- item.wd,
- 400.0
- ),
- orientation: {
- // 指向
- heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
- // 视角
- pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0,
- },
- });
- },
- deleteIcon(id) {
- let that = this;
- deletelabel(id).then((res) => {
- console.log(res);
- if (res.data.code == 200) {
- that.$message({
- message: "删除标签成功",
- type: "success",
- });
- } else {
- that.$message({
- message: "删除标签失败",
- type: "warning",
- });
+ data () {
+ return {
+ DC: null,
+ signList: [],
+ destroyedFlag: true
}
- that.getData();
- });
},
- getData() {
- let that = this;
- getlabel().then((res) => {
- console.log(res);
- const data = res.data.data.records;
- that.signList = data;
- // that.$store.commit("clearLabelLayerIcon");
- that.$store.dispatch("addLabelLayerIcon", {
- list: data,
- clear: true,
- });
- });
+ computed: {
+ ...mapGetters(['viewer', 'addSignList'])
},
- moveMessage(e, b) {
- if (b == "") {
- this.viewer.tooltip.enable = false;
- } else {
- this.viewer.tooltip.enable = true;
- this.viewer.tooltip.showAt(e.windowPosition, b);
- }
+ mounted () {
+ this.$store.commit('initLabelLayer', this.viewer)
+ this.getData()
},
-
- addSign() {
- var that = this;
- that.DC = global.DC;
- this.$store.commit("set_closeMapClick", true);
- // console.log("开始", "see");
- that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
- that.moveMessage(e, "点击确认标注位置")
- );
-
- that.viewer.once(that.DC.MouseEventType.CLICK, (e) => {
- if (that.destroyedFlag == false) return;
-
- that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
- that.moveMessage(e, "")
- );
-
- // eslint-disable-next-line no-unused-vars
- const popup = new this.DC.DivForms(this.viewer, {
- domId: "AddTagBox",
- position: [
- that.DC.Transform.transformWGS84ToCartesian(
- new that.DC.Position(
- Number(e.wgs84SurfacePosition.lng),
- Number(e.wgs84SurfacePosition.lat),
- Number(e.wgs84SurfacePosition.alt)
- )
- ),
- ],
- });
-
- that.$store.commit("SET_ADDTAGPOSITION", e.wgs84SurfacePosition);
- that.$store.commit("SET_ADDTAGPOPUP", true);
- });
+ watch: {
+ addSignList () {
+ this.getData()
+ }
},
+ methods: {
+ dingw (item) {
+ const that = this
+ // console.log(item);
+ // this.$store.dispatch("mapFlyTo", {
+ // lntLat: [item.jd, item.wd, 120], //114.04020791, 27.62934732
+ // heading: 0,
+ // pitch: -90,
+ // roll: 0,
+ // noOpen: true,
+ // mviewer: that.viewer,
+ // });
+ that.viewer.camera.setView({
+ // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ item.jd,
+ item.wd,
+ 400.0
+ ),
+ orientation: {
+ // 指向
+ heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
+ // 视角
+ pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
+ roll: 0.0
+ }
+ })
+ },
+ deleteIcon (id) {
+ const that = this
+ deletelabel(id).then((res) => {
+ if (res.data.code == 200) {
+ that.$message({
+ message: '删除标签成功',
+ type: 'success'
+ })
+ } else {
+ that.$message({
+ message: '删除标签失败',
+ type: 'warning'
+ })
+ }
+ that.getData()
+ })
+ },
+ getData () {
+ const that = this
+ getlabel().then((res) => {
+ const data = res.data.data.records
+ that.signList = data
+ // that.$store.commit("clearLabelLayerIcon");
+ that.$store.dispatch('addLabelLayerIcon', {
+ list: data,
+ clear: true
+ })
+ })
+ },
+ moveMessage (e, b) {
+ if (b == '') {
+ this.viewer.tooltip.enable = false
+ } else {
+ this.viewer.tooltip.enable = true
+ this.viewer.tooltip.showAt(e.windowPosition, b)
+ }
+ },
- closeModel() {
- this.$store.dispatch("delVisitedViews", this.$route);
- this.$router.push("/pcLayout/default");
- this.$store.commit("clearLabelLayerIcon");
+ addSign () {
+ var that = this
+ that.DC = global.DC
+ this.$store.commit('set_closeMapClick', true)
+ // console.log("开始", "see");
+ that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
+ that.moveMessage(e, '点击确认标注位置')
+ )
+
+ that.viewer.once(that.DC.MouseEventType.CLICK, (e) => {
+ if (that.destroyedFlag == false) return
+
+ that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
+ that.moveMessage(e, '')
+ )
+
+ // eslint-disable-next-line no-unused-vars
+ const popup = new this.DC.DivForms(this.viewer, {
+ domId: 'AddTagBox',
+ position: [
+ that.DC.Transform.transformWGS84ToCartesian(
+ new that.DC.Position(
+ Number(e.wgs84SurfacePosition.lng),
+ Number(e.wgs84SurfacePosition.lat),
+ Number(e.wgs84SurfacePosition.alt)
+ )
+ )
+ ]
+ })
+
+ that.$store.commit('SET_ADDTAGPOSITION', e.wgs84SurfacePosition)
+ that.$store.commit('SET_ADDTAGPOPUP', true)
+ })
+ },
+
+ closeModel () {
+ this.$store.dispatch('delVisitedViews', this.$route)
+ this.$router.push('/pcLayout/default')
+ this.$store.commit('clearLabelLayerIcon')
+ }
},
- },
- destroyed() {
- var that = this;
- that.destroyedFlag = false;
- if (that.DC) {
- that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
- that.moveMessage(e, "")
- );
+ destroyed () {
+ var that = this
+ that.destroyedFlag = false
+ if (that.DC) {
+ that.viewer.on(that.DC.MouseEventType.MOUSE_MOVE, (e) =>
+ that.moveMessage(e, '')
+ )
+ }
+ this.$store.commit('clearLabelLayerIcon')
}
- this.$store.commit("clearLabelLayerIcon");
- },
-};
+}
</script>
<style lang="scss" scoped>
.move {
- cursor: move;
+ cursor: move;
}
</style>
diff --git a/src/store/modules/mobile.js b/src/store/modules/mobile.js
index 9af0c5d..9759bd9 100644
--- a/src/store/modules/mobile.js
+++ b/src/store/modules/mobile.js
@@ -1,1089 +1,1085 @@
-import $store from "../index";
-import axios from "axios";
+import $store from '../index'
+import axios from 'axios'
import urlParameter from './mobiles/urlParameter'
const mobile = {
- state: {
- ...urlParameter.state, //url参数
- mviewer: null, // 地图实体类
- mBigPopup: false, // 全屏弹窗
- popupOurOpenData: [], // 全屏弹窗中下拉菜单数据
- popupTableName: [], // 全屏弹窗标签页数据
- mBigPopupAfter: false, /// /全屏弹窗之前的弹窗
- ips: "", // 获取的ip
- iconHide: false, // 右侧伸缩状态
- // DC: '',//DC全局保存
- MobileWindowsHide: true, // 改变点击窗口的显示状态
- MobileWindowChangeData: false, // 改变点击窗口的数据
- popupsDom: "", // mobileDivForms的实体类
- query: {}, // 传输数据
- openmobileGoTo: false, // 测试
- ccDataState: false, // 测试
- openmobilePanorama: false, // 实景显影
- MobileWindowsHideFixed: true, // 改变点击窗口的显示状态--固定窗口
- MobileWindowChangeDataFixed: false, // 改变点击窗口的数据--固定窗口
- // 在每次飞行弹窗中 加入自己的点
- pointLayer: null,
- pointLayerData: {
- flag: false,
- label: "选择点",
- img: "/img/leftnav/way.png",
- normal: "/img/leftnav/way.png",
- checked: "/img/leftnav/way-checked.png",
- layer: "pointLayer",
- },
- // 默认起始点函数
- startPointFn: "",
- dimension: "2.5D", // 维度
- dimensionData: {
- // 维度镜头数据
- heading: 0,
- pitch: -90,
- roll: 0,
- },
- zoomRange: [80, 200], //缩放程度
- frislayertHeight: 160, //默认弹窗高度
- perspectiveControl: "", //视角控制：高度、角度 ()=>{}
- perspectiveControls: "", //视角控制：高度、角度 ()=>{}
-
- tilesetLayer: null, //3d模型
- tileset: null, //3d模型
- tilesetLayer: null, //2.5d模型
- usetowpointfive: null,
- tilesetLayer: null, //瀑布流
- areaLayer: null, //2.5d事件--绿色图层
- select: {
- //绿色图层控制显示
- overlay: undefined,
- color: undefined,
- },
-
- vecLayer: null, //3D底图
- cvaLayer: null, //3D底图
-
- audioData: null, //语音
- audioState: false, //语音状态
-
- navigationStartLngLat: "", //导航起点
- navigationEndLngLat: "", //导航终点
- drawALineLayer: null, //导航路径图层
- drawALineLayerIcon: null, //导航路径图层图标
- isOpenDrawALine: false, //是否开启路径
- endPosition: "", //传送终点经纬度--
- isendPosition: false, //传送终点经纬度--感应数据
- routerS: [], //所有路径
- choiceRouterS: 0, //当前选择路径
-
- showActivity: false, //是否显示活动弹窗
- showActivityData: {}, //活动内容
-
- drawALineLayerMany: null, //活动路线图层
- drawAPointLayerMany: null, //活动点图层
- isOpenDrawALineMany: null, //是否开启活动
- seeRight: true, //右侧控制栏显影
- },
- mutations: {
- ...urlParameter.mutations, //url参数
- MSET_VIEWER(state, viewer) {
- state.mviewer = viewer;
- },
- MSET_BIGPOPUP(state, viewer) {
- state.mBigPopup = viewer;
- $store.dispatch("closeMobileWindowsDom"); // 关闭弹窗
- },
- MSET_BIGPOPUPAFTER(state, viewer) {
- state.mBigPopupAfter = viewer;
- $store.dispatch("closeMobileWindowsDom"); // 关闭弹窗
- },
- MSET_POPUPOUROPENDATA(state, viewer) {
- state.popupOurOpenData = viewer;
- },
- MSET_ICONHIDE(state, viewer) {
- state.iconHide = viewer;
- },
- MSET_POPUPTABLENAME(state, viewer) {
- state.popupTableName = viewer;
- },
- MSET_MOBILEWINDOWSHIDE(state, viewer) {
- // 随地图移动窗口
- state.MobileWindowChangeData = !state.MobileWindowChangeData;
- state.MobileWindowsHide = viewer;
- },
- MSETCC_SETCC(state, viewer) {
- state.ccDataState = !state.ccDataState; // 专门测试
- state.query = viewer;
- },
- MSET_POPUPDOM(state, viewer) {
- state.popupsDom = viewer;
- },
- MSET_QUERY(state, viewer) {
- state.query = viewer;
- },
- MSET_OPENMOBILEGOTO(state, viewer) {
- state.openmobileGoTo = viewer;
- },
- MSET_OPENMOBILEPANORAMA(state, viewer) {
- state.openmobilePanorama = viewer;
- },
- MSET_MOBILEWINDOWSHIDEFIXED(state, viewer) {
- // 固定窗口
- state.MobileWindowChangeDataFixed = !state.MobileWindowChangeDataFixed;
- state.MobileWindowsHideFixed = viewer;
- console.log(state.MobileWindowChangeDataFixed);
- },
- // 默认位置
- MSET_MORENWEIZHI(state, data) {
- state.startPointFn = data;
- },
- // // 开关飞入点图标
- // MSET_OPENPOINTEL(state, val) {
- // if (val) {
- // state.pointLayerData.img = state.pointLayerData.checked
- // state[state.pointLayerData.layer].show = true
- // } else {
- // state.pointLayerData.img = state.pointLayerData.normal
- // state[state.pointLayerData.layer].show = false
- // }
- // },
- //送入移动端缩放范围
- set_zoomRange(state, data) {
- state.zoomRange = data;
- },
- //送入默认弹窗高度
- set_frislayertHeight(state, data) {
- state.frislayertHeight = data;
- },
- //切换2D和2.5D
- MSET_DIMENSION(state, data) {
- //关闭弹窗
- //3d，2.5d转换事件
- state.dimension = data;
- if (data == "3D") {
- // 改数据为3d数据
- state.dimensionData = {
- // 维度镜头数据
- heading: 0,
- pitch: -45,
- roll: 0,
- };
- //加载底图
- state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: " http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36",
- type: "wmts",
- layer: "vec",
- style: "default",
- format: "tiles",
- tileMatrixSetID: "w",
- show: true,
- maximumLevel: 18,
- })
- );
- state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: " http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36",
- type: "wmts",
- layer: "cva",
- style: "default",
- format: "tiles",
- tileMatrixSetID: "w",
- show: true,
- maximumLevel: 18,
- })
- );
- // console.log(1321)
- state.wallLayer.show = false; //关闭瀑布 以及2.5d图形贴片
- state.mviewer.imageryLayers.remove(state.newLayer);
- state.newLayer = null;
- // state.silhouetteBlue.selected = []
- // state.tilesetLayer.changesilhouetteBlue(); //清空silhouetteBlue.selected = [];
- // console.log(state.tileset)
- state.tilesetLayer.show = true; //显示3d图形
- state.startPointFn(); //移动默认视角
- // state.mviewer.flyTo(state.tileset);
- state.areaLayer.show = false; //绿布
-
- //3D视角不限制
- state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80;
- // 最大
- state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = 4000000;
- // 设置相机缩小时的速率
- state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 10000;
- // 设置相机放大时的速率
- state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000;
- // 视角平移
- state.mviewer.scene.screenSpaceCameraController.enableRotate = true;
- // 视角缩放
- state.mviewer.scene.screenSpaceCameraController.enableZoom = true;
- // 视角旋转
- 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);
- // state.vecLayer = null;
- // state.mviewer.imageryLayers.remove(state.cvaLayer);
- // state.cvaLayer = null;
- //加载底图
- state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: " http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36",
- type: "wmts",
- layer: "vec",
- style: "default",
- format: "tiles",
- tileMatrixSetID: "w",
- show: true,
- maximumLevel: 18,
- })
- );
- state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: " http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36",
- type: "wmts",
- layer: "cva",
- style: "default",
- format: "tiles",
- tileMatrixSetID: "w",
- show: true,
- maximumLevel: 18,
- })
- );
- state.tilesetLayer.show = false; //隐藏3d图形
- state.newLayer = state.usetowpointfive(); //添加2.5d图形贴片
- state.wallLayer.show = false; //打开瀑布
- state.startPointFn(); //移动默认视角
- state.areaLayer.show = true; //绿布
- //2.5D视角限制
- state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = state.zoomRange[0];
- // 最大
- state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = state.zoomRange[1];
- // 设置相机缩小时的速率
- state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 2000;
- // 设置相机放大时的速率
- state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000;
- // 视角平移
- state.mviewer.scene.screenSpaceCameraController.enableRotate = true;
- // 视角缩放
- state.mviewer.scene.screenSpaceCameraController.enableZoom = true;
- // 视角旋转
- state.mviewer.scene.screenSpaceCameraController.enableTilt = false;
- }
- },
- //绿布
- MSET_areaLayer(state, data) {
- state.areaLayer = data;
- },
- //切换控制
- MSET_PERSPECTIVECONTROL(state, data) {
- state.perspectiveControl = data;
- state.perspectiveControls = !state.perspectiveControls;
- },
- MSET_MODEOLS(state, data) {
- state.tilesetLayer = data.tilesetLayer;
- state.newLayer = data.newLayer;
- state.wallLayer = data.wallLayer;
- state.tileset = data.tileset;
- state.usetowpointfive = data.usetowpointfive;
- },
- //直接移动
- cameraSetView(state, data) {
- state.mviewer.camera.setView({
- // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
- // fromDegrees()方法，将经纬度和高程转换为世界坐标
- destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- // 114.0351,
- // 27.6314,
- // 200.0
- data[0] + 0.0,
- data[1] + 0.00028,
- data[2] || 300
- ),
- orientation: {
- heading: global.DC.Namespace.Cesium.Math.toRadians(
- state.dimensionData.heading
- ),
- pitch: global.DC.Namespace.Cesium.Math.toRadians(
- state.dimensionData.pitch
- ),
- // heading: data.heading,
- // pitch: data.pitch,
- roll: state.dimensionData.roll,
+ state: {
+ ...urlParameter.state, // url参数
+ mviewer: null, // 地图实体类
+ mBigPopup: false, // 全屏弹窗
+ popupOurOpenData: [], // 全屏弹窗中下拉菜单数据
+ popupTableName: [], // 全屏弹窗标签页数据
+ mBigPopupAfter: false, /// /全屏弹窗之前的弹窗
+ ips: '', // 获取的ip
+ iconHide: false, // 右侧伸缩状态
+ // DC: '',//DC全局保存
+ MobileWindowsHide: true, // 改变点击窗口的显示状态
+ MobileWindowChangeData: false, // 改变点击窗口的数据
+ popupsDom: '', // mobileDivForms的实体类
+ query: {}, // 传输数据
+ openmobileGoTo: false, // 测试
+ ccDataState: false, // 测试
+ openmobilePanorama: false, // 实景显影
+ MobileWindowsHideFixed: true, // 改变点击窗口的显示状态--固定窗口
+ MobileWindowChangeDataFixed: false, // 改变点击窗口的数据--固定窗口
+ // 在每次飞行弹窗中 加入自己的点
+ pointLayer: null,
+ pointLayerData: {
+ flag: false,
+ label: '选择点',
+ img: '/img/leftnav/way.png',
+ normal: '/img/leftnav/way.png',
+ checked: '/img/leftnav/way-checked.png',
+ layer: 'pointLayer'
},
- });
- },
- //删除路线
- removePolyline(state) {
- if (state.drawALineLayer) {
- state.drawALineLayer.remove();
- state.drawALineLayer = null;
- state.isOpenDrawALine = false;
- }
- },
- removerPolyLineIcon(state) {
- if (state.drawALineLayerIcon) {
- state.drawALineLayerIcon.remove();
- state.drawALineLayerIcon = null;
- }
- },
- removePolylineMany(state) {
- if (state.drawALineLayerMany) {
- state.drawALineLayerMany.remove();
- 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) {
- state.isendPosition = !state.isendPosition;
- state.endPosition = data;
- },
- //传送当前选择的路径
- set_choiceRouterS(state, data) {
- state.choiceRouterS = data;
- },
- //活动窗口是否显示
- 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: {
- ...urlParameter.actions, //url参数
- MSET_CREADE({
- state,
- commit,
- dispatch
- }) {
- state.pointLayer = new global.DC.VectorLayer("pointLayer"); // 创建图标实体类
- state.mviewer.addLayer(state.pointLayer); // 添加到地图
- },
- setMobileWindows({
- state,
- commit,
- dispatch
- }, data) {
- // 打开随地图移动窗口
- let clas, Flys;
- const nowHeight = Math.ceil(
- state.mviewer.camera.positionCartographic.height
- );
- // 传递响应数据
- commit("MSET_QUERY", data);
- // console.log(data);
- if (state.dimension == "3D") {
- Flys = [
- +data.lntLat[0] + 0.01197,
- // +data.lntLat[1] - 0.0001,
- +data.lntLat[1] - 0.0027,
- 330,
- ];
- clas = [
- data.from == "PopupOurOnce" ? +data.lntLat[0] : +data.lntLat[0],
- // data.from == 'PopupOurOnce' ? +data.lntLat[1] - 0.00108 : +data.lntLat[1],
- data.from == "PopupOurOnce" ?
- +data.lntLat[1] - 0.00108 :
- +data.lntLat[1] - 0.00048,
- data.from == "PopupOurOnce" ? 0 : 30.648862227,
- ];
- } else if (state.dimension == "2.5D") {
- Flys = [
- +data.lntLat[0] + 0.01197,
- +data.lntLat[1] + 0.00048,
- // +data.lntLat[1] - 0.0022,
- // nowHeight,
- state.frislayertHeight,
- ];
- // console.log(nowHeight);
- clas = [
- data.from == "PopupOurOnce" ? +data.lntLat[0] : +data.lntLat[0],
- data.from == "PopupOurOnce" ? +data.lntLat[1] : +data.lntLat[1],
- // data.from == 'PopupOurOnce' ? +data.lntLat[1] - 0.00108 : +data.lntLat[1] - 0.00048,
- // data.from == 'PopupOurOnce' ? 0 : 90.648862227
- data.from == "PopupOurOnce" ? 0 : 0,
- ];
- }
+ // 默认起始点函数
+ startPointFn: '',
+ dimension: '2.5D', // 维度
+ dimensionData: {
+ // 维度镜头数据
+ heading: 0,
+ pitch: -90,
+ roll: 0
+ },
+ zoomRange: [80, 200], // 缩放程度
+ frislayertHeight: 160, // 默认弹窗高度
+ perspectiveControl: '', // 视角控制：高度、角度 ()=>{}
+ perspectiveControls: '', // 视角控制：高度、角度 ()=>{}
- if (data.useJWD) {
- var ellipsoid = state.mviewer.scene.globe.ellipsoid;
- var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
- // data.lntLat[0],
- // data.lntLat[1] - 0.00048,//数值增大是下
- // "90.648862227"
- // clnt, clat, calt
- ...clas
- );
- data.position = ellipsoid.cartographicToCartesian(cartographic);
- }
+ tilesetLayer: null, // 3d模型
+ tileset: null, // 3d模型
+ tilesetLayer: null, // 2.5d模型
+ usetowpointfive: null,
+ tilesetLayer: null, // 瀑布流
+ areaLayer: null, // 2.5d事件--绿色图层
+ select: {
+ // 绿色图层控制显示
+ overlay: undefined,
+ color: undefined
+ },
- // 定制化窗体
- const popupsDom = new global.DC.mobileDivForms(state.mviewer, {
- domId: "mobilePopup",
- title: data.query.name || "成教楼 ",
- className: "mobilePopup",
- content: document.getElementById("mobile-map_content_content"),
- position: [data.position],
- });
- // commit("MSET_MOBILEWINDOWSHIDE", false)//显示弹窗
- // dispatch("CHANGETOC3", { // 转换坐标
- // lnt: data.lntLat[0],
- // lat: data.lntLat[1]
- // }).then(res => {
- // console.log(res)
+ vecLayer: null, // 3D底图
+ cvaLayer: null, // 3D底图
- // 基于高度基础设置
- // h：1530
- // lnt： + 0.01187 x轴 大是向左
- // Lat: - 0.0108 y轴 减是上
- // h：4000
- // lnt： + 0.01187 x轴
- // Lat: - 0.0308 y轴
- // h：330
- // lnt： + 0.01197 x轴
- // Lat: - 0.0021 y轴
- // console.log(data.query.from, 78)
- // let Flys = [
- // data.query.from == "地图点击" ? +data.lntLat[0] + 0.01197 : +data.lntLat[0] + 0.01197,
- // data.query.from == "地图点击" ? +data.lntLat[1] - 0.0021 : +data.lntLat[1] - 0.0021,
- // data.query.from == "地图点击" ? 330 : 330,
- // ]
+ audioData: null, // 语音
+ audioState: false, // 语音状态
- const Position = new global.DC.Position( // 转坐标
- // +data.lntLat[0] + 0.01197,
- // +data.lntLat[1] - 0.0021,
- // 330,
- ...Flys,
- 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", {
- //飞入
- lntLat: [Position.lng, Position.lat, Position.alt],
- heading: Position.heading,
- pitch: Position.pitch,
- roll: Position.roll,
- });
- } else {
- dispatch("mapFlyTo", {
- //飞入
- lntLat: [Position.lng, +Position.lat - 0.0003, Position.alt],
- heading: Position.heading,
- pitch: Position.pitch,
- roll: Position.roll,
- });
- // 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);
+ navigationStartLngLat: '', // 导航起点
+ navigationEndLngLat: '', // 导航终点
+ drawALineLayer: null, // 导航路径图层
+ drawALineLayerIcon: null, // 导航路径图层图标
+ isOpenDrawALine: false, // 是否开启路径
+ endPosition: '', // 传送终点经纬度--
+ isendPosition: false, // 传送终点经纬度--感应数据
+ routerS: [], // 所有路径
+ choiceRouterS: 0, // 当前选择路径
+
+ showActivity: false, // 是否显示活动弹窗
+ showActivityData: {}, // 活动内容
+
+ drawALineLayerMany: null, // 活动路线图层
+ drawAPointLayerMany: null, // 活动点图层
+ isOpenDrawALineMany: null, // 是否开启活动
+ seeRight: true // 右侧控制栏显影
},
- closeMobileWindowsDom({
- state,
- commit,
- dispatch
- }) {
- commit("CLOSE_NOWPOSITION"); //中断定位获取
- if (!state.MobileWindowsHide && state.popupsDom) {
- state.popupsDom.closeOur();
- commit("MSET_MOBILEWINDOWSHIDE", true);
- if (state.audioData) {
- dispatch("MSET_GETAUDIOBEGIN", "notOpen");
+ mutations: {
+ ...urlParameter.mutations, // url参数
+ MSET_VIEWER (state, viewer) {
+ state.mviewer = viewer
+ },
+ MSET_BIGPOPUP (state, viewer) {
+ state.mBigPopup = viewer
+ $store.dispatch('closeMobileWindowsDom') // 关闭弹窗
+ },
+ MSET_BIGPOPUPAFTER (state, viewer) {
+ state.mBigPopupAfter = viewer
+ $store.dispatch('closeMobileWindowsDom') // 关闭弹窗
+ },
+ MSET_POPUPOUROPENDATA (state, viewer) {
+ state.popupOurOpenData = viewer
+ },
+ MSET_ICONHIDE (state, viewer) {
+ state.iconHide = viewer
+ },
+ MSET_POPUPTABLENAME (state, viewer) {
+ state.popupTableName = viewer
+ },
+ MSET_MOBILEWINDOWSHIDE (state, viewer) {
+ // 随地图移动窗口
+ state.MobileWindowChangeData = !state.MobileWindowChangeData
+ state.MobileWindowsHide = viewer
+ },
+ MSETCC_SETCC (state, viewer) {
+ state.ccDataState = !state.ccDataState // 专门测试
+ state.query = viewer
+ },
+ MSET_POPUPDOM (state, viewer) {
+ state.popupsDom = viewer
+ },
+ MSET_QUERY (state, viewer) {
+ state.query = viewer
+ },
+ MSET_OPENMOBILEGOTO (state, viewer) {
+ state.openmobileGoTo = viewer
+ },
+ MSET_OPENMOBILEPANORAMA (state, viewer) {
+ state.openmobilePanorama = viewer
+ },
+ MSET_MOBILEWINDOWSHIDEFIXED (state, viewer) {
+ // 固定窗口
+ state.MobileWindowChangeDataFixed = !state.MobileWindowChangeDataFixed
+ state.MobileWindowsHideFixed = viewer
+ },
+ // 默认位置
+ MSET_MORENWEIZHI (state, data) {
+ state.startPointFn = data
+ },
+ // // 开关飞入点图标
+ // MSET_OPENPOINTEL(state, val) {
+ // if (val) {
+ // state.pointLayerData.img = state.pointLayerData.checked
+ // state[state.pointLayerData.layer].show = true
+ // } else {
+ // state.pointLayerData.img = state.pointLayerData.normal
+ // state[state.pointLayerData.layer].show = false
+ // }
+ // },
+ // 送入移动端缩放范围
+ set_zoomRange (state, data) {
+ state.zoomRange = data
+ },
+ // 送入默认弹窗高度
+ set_frislayertHeight (state, data) {
+ state.frislayertHeight = data
+ },
+ // 切换2D和2.5D
+ MSET_DIMENSION (state, data) {
+ // 关闭弹窗
+ // 3d，2.5d转换事件
+ state.dimension = data
+ if (data == '3D') {
+ // 改数据为3d数据
+ state.dimensionData = {
+ // 维度镜头数据
+ heading: 0,
+ pitch: -45,
+ roll: 0
+ }
+ // 加载底图
+ state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
+ new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
+ url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
+ type: 'wmts',
+ layer: 'vec',
+ style: 'default',
+ format: 'tiles',
+ tileMatrixSetID: 'w',
+ show: true,
+ maximumLevel: 18
+ })
+ )
+ state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
+ new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
+ url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
+ type: 'wmts',
+ layer: 'cva',
+ style: 'default',
+ format: 'tiles',
+ tileMatrixSetID: 'w',
+ show: true,
+ maximumLevel: 18
+ })
+ )
+ // console.log(1321)
+ state.wallLayer.show = false // 关闭瀑布 以及2.5d图形贴片
+ state.mviewer.imageryLayers.remove(state.newLayer)
+ state.newLayer = null
+ // state.silhouetteBlue.selected = []
+ // state.tilesetLayer.changesilhouetteBlue(); //清空silhouetteBlue.selected = [];
+ // console.log(state.tileset)
+ state.tilesetLayer.show = true // 显示3d图形
+ state.startPointFn() // 移动默认视角
+ // state.mviewer.flyTo(state.tileset);
+ state.areaLayer.show = false // 绿布
+
+ // 3D视角不限制
+ state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = 80
+ // 最大
+ state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = 4000000
+ // 设置相机缩小时的速率
+ state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 10000
+ // 设置相机放大时的速率
+ state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
+ // 视角平移
+ state.mviewer.scene.screenSpaceCameraController.enableRotate = true
+ // 视角缩放
+ state.mviewer.scene.screenSpaceCameraController.enableZoom = true
+ // 视角旋转
+ state.mviewer.scene.screenSpaceCameraController.enableTilt = true
+ } else if (data == '2.5D') {
+ 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);
+ // state.vecLayer = null;
+ // state.mviewer.imageryLayers.remove(state.cvaLayer);
+ // state.cvaLayer = null;
+ // 加载底图
+ state.vecLayer = state.mviewer.imageryLayers.addImageryProvider(
+ new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
+ url: ' http://t1.tianditu.gov.cn/vec_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
+ type: 'wmts',
+ layer: 'vec',
+ style: 'default',
+ format: 'tiles',
+ tileMatrixSetID: 'w',
+ show: true,
+ maximumLevel: 18
+ })
+ )
+ state.cvaLayer = state.mviewer.imageryLayers.addImageryProvider(
+ new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
+ url: ' http://t1.tianditu.gov.cn/cva_w/wmts?tk=9ae78c51a0a28f06444d541148496e36',
+ type: 'wmts',
+ layer: 'cva',
+ style: 'default',
+ format: 'tiles',
+ tileMatrixSetID: 'w',
+ show: true,
+ maximumLevel: 18
+ })
+ )
+ state.tilesetLayer.show = false // 隐藏3d图形
+ state.newLayer = state.usetowpointfive() // 添加2.5d图形贴片
+ state.wallLayer.show = false // 打开瀑布
+ state.startPointFn() // 移动默认视角
+ state.areaLayer.show = true // 绿布
+ // 2.5D视角限制
+ state.mviewer.scene.screenSpaceCameraController.minimumZoomDistance = state.zoomRange[0]
+ // 最大
+ state.mviewer.scene.screenSpaceCameraController.maximumZoomDistance = state.zoomRange[1]
+ // 设置相机缩小时的速率
+ state.mviewer.scene.screenSpaceCameraController._minimumZoomRate = 2000
+ // 设置相机放大时的速率
+ state.mviewer.scene.screenSpaceCameraController._maximumZoomRate = 5906376272000
+ // 视角平移
+ state.mviewer.scene.screenSpaceCameraController.enableRotate = true
+ // 视角缩放
+ state.mviewer.scene.screenSpaceCameraController.enableZoom = true
+ // 视角旋转
+ state.mviewer.scene.screenSpaceCameraController.enableTilt = false
+ }
+ },
+ // 绿布
+ MSET_areaLayer (state, data) {
+ state.areaLayer = data
+ },
+ // 切换控制
+ MSET_PERSPECTIVECONTROL (state, data) {
+ state.perspectiveControl = data
+ state.perspectiveControls = !state.perspectiveControls
+ },
+ MSET_MODEOLS (state, data) {
+ state.tilesetLayer = data.tilesetLayer
+ state.newLayer = data.newLayer
+ state.wallLayer = data.wallLayer
+ state.tileset = data.tileset
+ state.usetowpointfive = data.usetowpointfive
+ },
+ // 直接移动
+ cameraSetView (state, data) {
+ state.mviewer.camera.setView({
+ // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
+ // fromDegrees()方法，将经纬度和高程转换为世界坐标
+ destination: new global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ // 114.0351,
+ // 27.6314,
+ // 200.0
+ data[0] + 0.0,
+ data[1] + 0.00028,
+ data[2] || 300
+ ),
+ orientation: {
+ heading: global.DC.Namespace.Cesium.Math.toRadians(
+ state.dimensionData.heading
+ ),
+ pitch: global.DC.Namespace.Cesium.Math.toRadians(
+ state.dimensionData.pitch
+ ),
+ // heading: data.heading,
+ // pitch: data.pitch,
+ roll: state.dimensionData.roll
+ }
+ })
+ },
+ // 删除路线
+ removePolyline (state) {
+ if (state.drawALineLayer) {
+ state.drawALineLayer.remove()
+ state.drawALineLayer = null
+ state.isOpenDrawALine = false
+ }
+ },
+ removerPolyLineIcon (state) {
+ if (state.drawALineLayerIcon) {
+ state.drawALineLayerIcon.remove()
+ state.drawALineLayerIcon = null
+ }
+ },
+ removePolylineMany (state) {
+ if (state.drawALineLayerMany) {
+ state.drawALineLayerMany.remove()
+ 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) {
+ state.isendPosition = !state.isendPosition
+ state.endPosition = data
+ },
+ // 传送当前选择的路径
+ set_choiceRouterS (state, data) {
+ state.choiceRouterS = data
+ },
+ // 活动窗口是否显示
+ 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
}
- } //cancel
},
- CHANGETOC3({
- state,
- commit
- }, data) {
- // //转换经纬度坐标 成世界坐标cartesian3
- var ellipsoid = state.mviewer.scene.globe.ellipsoid;
- var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
- data.lnt,
- data.lat - 0.00006,
- data.alt || "90.648862227"
- );
- var position = ellipsoid.cartographicToCartesian(cartographic);
- return position;
- },
- SET_OPENWIDOWFIXED({
- state,
- commit
- }, data) {
- // 传递响应数据
- commit("MSET_QUERY", data);
- // 显示窗口
- commit("MSET_MOBILEWINDOWSHIDEFIXED", false);
- // 移动地图位置
- state.mviewer.zoomToPosition(
- new global.DC.Position(
- data.lntLat[0],
- data.lntLat[1] - 0.012,
- 1530,
- 0,
- -45
- )
- );
- },
- CLOSE_WIDOWFIXED({
- state,
- commit
- }) {
- // 隐藏窗口
- if (!state.MobileWindowsHideFixed) {
- console.log(state.MobileWindowsHideFixed);
- commit("MSET_MOBILEWINDOWSHIDEFIXED", true);
- }
- },
- // 加入当时的选点
- JOIN_POINT({
- state,
- commit
- }, data) {},
- // flyTo
- mapFlyTo({
- state,
- commit,
- dispatch
- }, data) {
- state.mviewer.camera.flyTo({
- destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
- data.lntLat[0] - 0.012,
- data.lntLat[1],
- data.lntLat[2] || 15000.0
- ),
- // destination: data.res,
- orientation: {
- heading: global.DC.Namespace.Cesium.Math.toRadians(data.heading),
- pitch: global.DC.Namespace.Cesium.Math.toRadians(data.pitch),
- // heading: data.heading,
- // pitch: data.pitch,
- roll: data.roll,
+ actions: {
+ ...urlParameter.actions, // url参数
+ MSET_CREADE ({
+ state,
+ commit,
+ dispatch
+ }) {
+ state.pointLayer = new global.DC.VectorLayer('pointLayer') // 创建图标实体类
+ state.mviewer.addLayer(state.pointLayer) // 添加到地图
},
- duration: 1, // 定位的时间间隔
- complete: () => {
- // 完成后的回调
- if (data.fn) {
- // 自定义回调
- setTimeout(() => {
- data.fn();
- }, 200);
- }
- if (!data.noOpen) {
- setTimeout(() => {
- // dispatch("MSET_POINTDATA", data.lntLat);//传入标记点
- !state.MobileWindowsHide ||
- commit("MSET_MOBILEWINDOWSHIDE", false); // 显示弹窗
- }, 100);
- }
+ setMobileWindows ({
+ state,
+ commit,
+ dispatch
+ }, data) {
+ // 打开随地图移动窗口
+ let clas, Flys
+ const nowHeight = Math.ceil(
+ state.mviewer.camera.positionCartographic.height
+ )
+ // 传递响应数据
+ commit('MSET_QUERY', data)
+ // console.log(data);
+ if (state.dimension == '3D') {
+ Flys = [
+ +data.lntLat[0] + 0.01197,
+ // +data.lntLat[1] - 0.0001,
+ +data.lntLat[1] - 0.0027,
+ 330
+ ]
+ clas = [
+ data.from == 'PopupOurOnce' ? +data.lntLat[0] : +data.lntLat[0],
+ // data.from == 'PopupOurOnce' ? +data.lntLat[1] - 0.00108 : +data.lntLat[1],
+ data.from == 'PopupOurOnce'
+ ? +data.lntLat[1] - 0.00108
+ : +data.lntLat[1] - 0.00048,
+ data.from == 'PopupOurOnce' ? 0 : 30.648862227
+ ]
+ } else if (state.dimension == '2.5D') {
+ Flys = [
+ +data.lntLat[0] + 0.01197,
+ +data.lntLat[1] + 0.00048,
+ // +data.lntLat[1] - 0.0022,
+ // nowHeight,
+ state.frislayertHeight
+ ]
+ // console.log(nowHeight);
+ clas = [
+ data.from == 'PopupOurOnce' ? +data.lntLat[0] : +data.lntLat[0],
+ data.from == 'PopupOurOnce' ? +data.lntLat[1] : +data.lntLat[1],
+ // data.from == 'PopupOurOnce' ? +data.lntLat[1] - 0.00108 : +data.lntLat[1] - 0.00048,
+ // data.from == 'PopupOurOnce' ? 0 : 90.648862227
+ data.from == 'PopupOurOnce' ? 0 : 0
+ ]
+ }
+
+ if (data.useJWD) {
+ var ellipsoid = state.mviewer.scene.globe.ellipsoid
+ var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
+ // data.lntLat[0],
+ // data.lntLat[1] - 0.00048,//数值增大是下
+ // "90.648862227"
+ // clnt, clat, calt
+ ...clas
+ )
+ data.position = ellipsoid.cartographicToCartesian(cartographic)
+ }
+
+ // 定制化窗体
+ const popupsDom = new global.DC.mobileDivForms(state.mviewer, {
+ domId: 'mobilePopup',
+ title: data.query.name || '成教楼 ',
+ className: 'mobilePopup',
+ content: document.getElementById('mobile-map_content_content'),
+ position: [data.position]
+ })
+ // commit("MSET_MOBILEWINDOWSHIDE", false)//显示弹窗
+ // dispatch("CHANGETOC3", { // 转换坐标
+ // lnt: data.lntLat[0],
+ // lat: data.lntLat[1]
+ // }).then(res => {
+ // console.log(res)
+
+ // 基于高度基础设置
+ // h：1530
+ // lnt： + 0.01187 x轴 大是向左
+ // Lat: - 0.0108 y轴 减是上
+ // h：4000
+ // lnt： + 0.01187 x轴
+ // Lat: - 0.0308 y轴
+ // h：330
+ // lnt： + 0.01197 x轴
+ // Lat: - 0.0021 y轴
+ // console.log(data.query.from, 78)
+ // let Flys = [
+ // data.query.from == "地图点击" ? +data.lntLat[0] + 0.01197 : +data.lntLat[0] + 0.01197,
+ // data.query.from == "地图点击" ? +data.lntLat[1] - 0.0021 : +data.lntLat[1] - 0.0021,
+ // data.query.from == "地图点击" ? 330 : 330,
+ // ]
+
+ const Position = new global.DC.Position( // 转坐标
+ // +data.lntLat[0] + 0.01197,
+ // +data.lntLat[1] - 0.0021,
+ // 330,
+ ...Flys,
+ 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', {
+ // 飞入
+ lntLat: [Position.lng, Position.lat, Position.alt],
+ heading: Position.heading,
+ pitch: Position.pitch,
+ roll: Position.roll
+ })
+ } else {
+ dispatch('mapFlyTo', {
+ // 飞入
+ lntLat: [Position.lng, +Position.lat - 0.0003, Position.alt],
+ heading: Position.heading,
+ pitch: Position.pitch,
+ roll: Position.roll
+ })
+ // 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)
},
- });
- // 官网flyto使用方法
- // 1. Fly to a position with a top-down view
- // viewer.camera.flyTo({
- // destination : Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0)
- // });
-
- // // 2. Fly to a Rectangle with a top-down view
- // viewer.camera.flyTo({
- // destination : Cesium.Rectangle.fromDegrees(west, south, east, north)
- // });
-
- // // 3. Fly to a position with an orientation using unit vectors.
- // viewer.camera.flyTo({
- // destination : Cesium.Cartesian3.fromDegrees(-122.19, 46.25, 5000.0),
- // orientation : {
- // direction : new Cesium.Cartesian3(-0.04231243104240401, -0.20123236049443421, -0.97862924300734),
- // up : new Cesium.Cartesian3(-0.47934589305293746, -0.8553216253114552, 0.1966022179118339)
- // }
- // });
-
- // // 4. Fly to a position with an orientation using heading, pitch and roll.
- // viewer.camera.flyTo({
- // destination : Cesium.Cartesian3.fromDegrees(-122.19, 46.25, 5000.0),
- // orientation : {
- // heading : Cesium.Math.toRadians(175.0),
- // pitch : Cesium.Math.toRadians(-35.0),
- // roll : 0.0
- // }
- // });
- },
- // 飞入点加入位置
- MSET_POINTDATA({
- state,
- commit,
- dispatch
- }, data) {
- // 加入坐标
- const positions = new global.DC.Position(
- data[0] - 0.0119,
- data[1] + 0.0111,
- 0
- );
- const billboard = new global.DC.Billboard(
- positions,
- "/img/leftnav/map-panorama.png"
- );
- billboard.size = [16, 16];
- // 订阅事件3
- billboard.on(DC.MouseEventType.CLICK, (e) => {
- // 定制化窗体
- console.log(e);
- const query = {
- name: "选择点"
- };
- const intLat = [e.wgs84Position.lng, e.wgs84Position.lat];
- const d = {
- position: null,
- lntLat: intLat,
- query: {
- ...(query || {}),
- introduce: null,
- address: intLat
- },
- useJWD: true, // 仅使用经纬度
- };
- dispatch("setMobileWindows", d);
- });
- state.pointLayer.addOverlay(billboard); // 实景
- // commit("MSET_OPENPOINTEL", true);
- },
- MSET_LOCKPERSPECTIVEL({
- state,
- commit,
- dispatch
- }, val) {
- // 锁定
- state.mviewer.camera.lookAtTransform(
- global.DC.Namespace.Cesium.Matrix4.IDENTITY
- );
- // console.log(global.DC.Namespace.Cesium.Matrix4.IDENTITY)
- },
- MSET_DIMENSIONS({
- state,
- commit,
- dispatch
- }, val) {
- //关闭弹窗
- dispatch("closeMobileWindowsDom");
- //3d，2.5d转换事件
- commit("MSET_DIMENSION", val);
- //控制高度
- const height = Math.ceil(
- state.mviewer.camera.positionCartographic.height
- );
- state.mviewer.camera.setView({
- destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
- state.mviewer.camera.positionCartographic.longitude,
- state.mviewer.camera.positionCartographic.latitude,
- height
- ),
- orientation: {
- heading: global.DC.Namespace.Cesium.Math.toRadians(
- state.dimensionData.heading
- ), // 方向
- pitch: global.DC.Namespace.Cesium.Math.toRadians(
- state.dimensionData.pitch
- ), // 倾斜角度
- roll: state.dimensionData.roll,
+ closeMobileWindowsDom ({
+ state,
+ commit,
+ dispatch
+ }) {
+ commit('CLOSE_NOWPOSITION') // 中断定位获取
+ if (!state.MobileWindowsHide && state.popupsDom) {
+ state.popupsDom.closeOur()
+ commit('MSET_MOBILEWINDOWSHIDE', true)
+ if (state.audioData) {
+ dispatch('MSET_GETAUDIOBEGIN', 'notOpen')
+ }
+ } // cancel
},
- });
- },
- MSET_GOTOCC({
- state,
- commit,
- dispatch
- }, val) {
- //测试移动位置
- // commit("MSET_DIMENSION", val);
- //控制高度
- // const height = Math.ceil(state.mviewer.camera.positionCartographic.height);
- state.mviewer.camera.setView({
- destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
- state.mviewer.camera.positionCartographic.longitude,
- state.mviewer.camera.positionCartographic.latitude,
- val.height
- ),
- orientation: {
- heading: global.DC.Namespace.Cesium.Math.toRadians(val.heading), // 方向
- pitch: global.DC.Namespace.Cesium.Math.toRadians(val.pitch), // 倾斜角度
- roll: val.roll,
+ CHANGETOC3 ({
+ state,
+ commit
+ }, data) {
+ // //转换经纬度坐标 成世界坐标cartesian3
+ var ellipsoid = state.mviewer.scene.globe.ellipsoid
+ var cartographic = global.DC.Namespace.Cesium.Cartographic.fromDegrees(
+ data.lnt,
+ data.lat - 0.00006,
+ data.alt || '90.648862227'
+ )
+ var position = ellipsoid.cartographicToCartesian(cartographic)
+ return position
},
- });
- },
- //文字转语音控制↓
- MSET_GETAUDIO({
- state,
- commit,
- dispatch
- }, val) {
- state.audioData = new window.SpeechSynthesisUtterance();
- state.audioData.text = val;
- state.audioData.onstart = function (e) {
- state.audioState = true;
- };
- state.audioData.onend = function (event) {
- state.audioState = false;
- };
- },
- MSET_GETAUDIOBEGIN({
- state,
- commit,
- dispatch
- }, val) {
- if (state.audioState) {
- window.speechSynthesis.cancel();
- state.audioState = false;
- } else {
- if (val != "notOpen") {
- window.speechSynthesis.speak(state.audioData);
- }
- }
- },
- //文字转语音控制↑
- //导航系统↓
- MSET_GOTOWHERE({
- state,
- commit,
- dispatch
- }, val) {
- state.routerS = []; //清空存着的路径
- //单条步行
- //本地图使用的是WGS84坐标，而高德使用的是火星坐标GCJ02，所以需要转换参数过去
- // 返回值需要转换为WGS84坐标
- state.navigationStartLngLat = [+val.start[0], +val.start[1]]; //导航起点
- state.navigationEndLngLat = [+val.end[0], +val.end[1]]; //导航终点
- //转换WGS84坐标为GCJ02
- let GCJ02StartLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
- Number(state.navigationStartLngLat[0]),
- Number(state.navigationStartLngLat[1])
- );
- let GCJ02EndLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
- Number(state.navigationEndLngLat[0]),
- Number(state.navigationEndLngLat[1])
- );
- // 获取路径，使用的是高德API
-
- let url = "https://restapi.amap.com/v3/direction/walking"; //默认api步行
- let data = {
- origin: `${Number(GCJ02StartLngLat[0]).toFixed(6)},${Number(
- GCJ02StartLngLat[1]
- ).toFixed(6)}`,
- destination: `${Number(GCJ02EndLngLat[0]).toFixed(6)},${Number(
- GCJ02EndLngLat[1]
- ).toFixed(6)}`,
- key: "4b3e1db3211054ce5b466407cbb9d221",
- output: "json",
- };
- let strategyType = [0];
- if (val.type) {
- //切换驾车模式
- url = "https://restapi.amap.com/v3/direction/driving";
- data["strategy"] = 10;
- strategyType = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
- }
- // for (let index = 0; index < strategyType.length; index++) {
- // data["strategy"] = strategyType[index];
- axios
- .get(url, {
- params: {
- ...data
- },
- })
- .then((res) => {
- //回调
- const paths = res.data.route.paths;
- for (let i = 0; i < paths.length; i++) {
- //多条路线
- drawALine(paths[i]);
- }
- // const paths = res.data.route.paths[0].steps;
- // drawALine(paths, res.data.route.paths[0].strategy);
- });
- // }
- let drawALine = (pathsour) => {
- let paths = pathsour.steps;
- let titles = pathsour.strategy;
- //paths是个道路对象，其中polyline是String类型的经纬度
- let Str = state.navigationStartLngLat.join(",") + ";"; //加入起点
- for (let index = 0; index < paths.length; index++) {
- const path = paths[index];
- let polyline = path.polyline; //取到String类型的经纬度
- let polylineArr = polyline.split(";"); //转为数组
- let polylineArrLength = polylineArr.length; //获取长度，避免多次重复读取polylineArr.length
- for (let k = 0; k < polylineArrLength; k++) {
- let inPolylineArr = polylineArr[k].split(","); //转经纬度为单独的数组
- let outIn = global.DC.CoordTransform.GCJ02ToWGS84(
- //处理火星坐标转换成WGS84 GCJ02ToWGS84
- inPolylineArr[0],
- inPolylineArr[1]
- );
- polylineArr[k] = outIn.join(","); //每组经纬度转为String
- }
- polyline = polylineArr.join(";"); //合并转换后的经纬度合集
-
- Str += polyline; //自加
- Str += ";";
- }
- Str += state.navigationEndLngLat.join(","); //加入终点
- if (val.fn) {
- let dataS = {
- //返回数据
- titles: titles,
- Str: Str,
- };
- // console.log(Str);
- state.routerS.push(dataS);
- return val.fn(dataS);
- } else {
- dispatch("MSET_DRAWALINELAYER", Str); //绘画线路
- }
- };
- },
- //导航系统↑
- //绘画线路
- MSET_DRAWALINELAYER({
- state,
- commit,
- dispatch
- }, value) {
- let Str = value[0];
- //检查是否存在路线
- commit("removePolyline");
- commit("removePolylineMany");
- let color =
- global.DC.Namespace.Cesium.Color.fromCssColorString("#409EFF");
- let material = new global.DC.PolylineTrailMaterialProperty({
- color: color,
- speed: 10,
- });
- state.drawALineLayer = new global.DC.VectorLayer("lineLayer");
- state.mviewer.addLayer(state.drawALineLayer);
-
- //如果是添加 给第一个点加入图标 和事件
- if (value[1]) {
- commit("removerPolyLineIcon");
- state.drawALineLayerIcon = new global.DC.VectorLayer("pointLayer");
- state.mviewer.addLayer(state.drawALineLayerIcon);
- 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,
- "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[1] || {}),
- position,
- lntLat,
- notAddGoOn: "notAddGoOn",
- },
- useJWD: true, //仅使用经纬度
- };
- dispatch("setMobileWindows", windowData);
- });
- state.drawALineLayerIcon.addOverlay(billboard);
- }
- let polyline = new global.DC.Polyline(Str); //加入线
- polyline.setStyle({
- width: 3,
- material: material,
- clampToGround: true,
- });
- state.drawALineLayer.addOverlay(polyline);
-
- state.isOpenDrawALine = true;
- // commit("cameraSetView", state.navigationStartLngLat); //移动
- },
- //绘画线路活动多条
- MSET_DRAWALINELAYERMANY({
- state,
- commit,
- dispatch
- }, value) {
- //检查是否存在路线
- 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");
- let blue = global.DC.Namespace.Cesium.Color.fromCssColorString("#2196F3");
- let material = new global.DC.PolylineTrailMaterialProperty({
- color: red,
- speed: 10,
- });
- let material1 = new global.DC.PolylineImageTrailMaterialProperty({
- color: red,
- speed: 60,
- image: "img/icon/right.png",
- repeat: {
- x: 320,
- y: 1
+ SET_OPENWIDOWFIXED ({
+ state,
+ commit
+ }, data) {
+ // 传递响应数据
+ commit('MSET_QUERY', data)
+ // 显示窗口
+ commit('MSET_MOBILEWINDOWSHIDEFIXED', false)
+ // 移动地图位置
+ state.mviewer.zoomToPosition(
+ new global.DC.Position(
+ data.lntLat[0],
+ data.lntLat[1] - 0.012,
+ 1530,
+ 0,
+ -45
+ )
+ )
},
- });
- 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: 6,
- material: material1,
- clampToGround: true,
- });
- drawALineLayerMany.addOverlay(polyline);
- // let post = Strs[k].value.split(";")[0].split(",");
- // let position = new global.DC.Position(post[0], post[1]);
- // let Label = new global.DC.Label(position, Strs[k].name);
- // Label.setStyle({
- // font: "16px sans-serif", // CSS 字体设置
- // scale: 1, //比例
- // fillColor: white, //文字颜色
- // showBackground: true, //是否显示背景
- // backgroundColor: blue, //背景颜色
- // // outlineColor: white, //边框颜色
- // // outlineWidth: 10, //边框大小，
- // });
- // drawALineLayerMany.addOverlay(Label);
- }
- //多个点
- let point = value[1];
- for (let k in point) {
- let post = point[k].value;
- let position = new global.DC.Position(post[0], post[1]);
+ CLOSE_WIDOWFIXED ({
+ state,
+ commit
+ }) {
+ // 隐藏窗口
+ if (!state.MobileWindowsHideFixed) {
+ commit('MSET_MOBILEWINDOWSHIDEFIXED', true)
+ }
+ },
+ // 加入当时的选点
+ JOIN_POINT ({
+ state,
+ commit
+ }, data) { },
+ // flyTo
+ mapFlyTo ({
+ state,
+ commit,
+ dispatch
+ }, data) {
+ state.mviewer.camera.flyTo({
+ destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
+ data.lntLat[0] - 0.012,
+ data.lntLat[1],
+ data.lntLat[2] || 15000.0
+ ),
+ // destination: data.res,
+ orientation: {
+ heading: global.DC.Namespace.Cesium.Math.toRadians(data.heading),
+ pitch: global.DC.Namespace.Cesium.Math.toRadians(data.pitch),
+ // heading: data.heading,
+ // pitch: data.pitch,
+ roll: data.roll
+ },
+ duration: 1, // 定位的时间间隔
+ complete: () => {
+ // 完成后的回调
+ if (data.fn) {
+ // 自定义回调
+ setTimeout(() => {
+ data.fn()
+ }, 200)
+ }
+ if (!data.noOpen) {
+ setTimeout(() => {
+ // dispatch("MSET_POINTDATA", data.lntLat);//传入标记点
+ !state.MobileWindowsHide ||
+ commit('MSET_MOBILEWINDOWSHIDE', false) // 显示弹窗
+ }, 100)
+ }
+ }
+ })
+ // 官网flyto使用方法
+ // 1. Fly to a position with a top-down view
+ // viewer.camera.flyTo({
+ // destination : Cesium.Cartesian3.fromDegrees(-117.16, 32.71, 15000.0)
+ // });
- // 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,
- `
+ // // 2. Fly to a Rectangle with a top-down view
+ // viewer.camera.flyTo({
+ // destination : Cesium.Rectangle.fromDegrees(west, south, east, north)
+ // });
+
+ // // 3. Fly to a position with an orientation using unit vectors.
+ // viewer.camera.flyTo({
+ // destination : Cesium.Cartesian3.fromDegrees(-122.19, 46.25, 5000.0),
+ // orientation : {
+ // direction : new Cesium.Cartesian3(-0.04231243104240401, -0.20123236049443421, -0.97862924300734),
+ // up : new Cesium.Cartesian3(-0.47934589305293746, -0.8553216253114552, 0.1966022179118339)
+ // }
+ // });
+
+ // // 4. Fly to a position with an orientation using heading, pitch and roll.
+ // viewer.camera.flyTo({
+ // destination : Cesium.Cartesian3.fromDegrees(-122.19, 46.25, 5000.0),
+ // orientation : {
+ // heading : Cesium.Math.toRadians(175.0),
+ // pitch : Cesium.Math.toRadians(-35.0),
+ // roll : 0.0
+ // }
+ // });
+ },
+ // 飞入点加入位置
+ MSET_POINTDATA ({
+ state,
+ commit,
+ dispatch
+ }, data) {
+ // 加入坐标
+ const positions = new global.DC.Position(
+ data[0] - 0.0119,
+ data[1] + 0.0111,
+ 0
+ )
+ const billboard = new global.DC.Billboard(
+ positions,
+ '/img/leftnav/map-panorama.png'
+ )
+ billboard.size = [16, 16]
+ // 订阅事件3
+ billboard.on(DC.MouseEventType.CLICK, (e) => {
+ // 定制化窗体
+ const query = {
+ name: '选择点'
+ }
+ const intLat = [e.wgs84Position.lng, e.wgs84Position.lat]
+ const d = {
+ position: null,
+ lntLat: intLat,
+ query: {
+ ...(query || {}),
+ introduce: null,
+ address: intLat
+ },
+ useJWD: true // 仅使用经纬度
+ }
+ dispatch('setMobileWindows', d)
+ })
+ state.pointLayer.addOverlay(billboard) // 实景
+ // commit("MSET_OPENPOINTEL", true);
+ },
+ MSET_LOCKPERSPECTIVEL ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ // 锁定
+ state.mviewer.camera.lookAtTransform(
+ global.DC.Namespace.Cesium.Matrix4.IDENTITY
+ )
+ // console.log(global.DC.Namespace.Cesium.Matrix4.IDENTITY)
+ },
+ MSET_DIMENSIONS ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ // 关闭弹窗
+ dispatch('closeMobileWindowsDom')
+ // 3d，2.5d转换事件
+ commit('MSET_DIMENSION', val)
+ // 控制高度
+ const height = Math.ceil(
+ state.mviewer.camera.positionCartographic.height
+ )
+ state.mviewer.camera.setView({
+ destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
+ state.mviewer.camera.positionCartographic.longitude,
+ state.mviewer.camera.positionCartographic.latitude,
+ height
+ ),
+ orientation: {
+ heading: global.DC.Namespace.Cesium.Math.toRadians(
+ state.dimensionData.heading
+ ), // 方向
+ pitch: global.DC.Namespace.Cesium.Math.toRadians(
+ state.dimensionData.pitch
+ ), // 倾斜角度
+ roll: state.dimensionData.roll
+ }
+ })
+ },
+ MSET_GOTOCC ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ // 测试移动位置
+ // commit("MSET_DIMENSION", val);
+ // 控制高度
+ // const height = Math.ceil(state.mviewer.camera.positionCartographic.height);
+ state.mviewer.camera.setView({
+ destination: global.DC.Namespace.Cesium.Cartesian3.fromRadians(
+ state.mviewer.camera.positionCartographic.longitude,
+ state.mviewer.camera.positionCartographic.latitude,
+ val.height
+ ),
+ orientation: {
+ heading: global.DC.Namespace.Cesium.Math.toRadians(val.heading), // 方向
+ pitch: global.DC.Namespace.Cesium.Math.toRadians(val.pitch), // 倾斜角度
+ roll: val.roll
+ }
+ })
+ },
+ // 文字转语音控制↓
+ MSET_GETAUDIO ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ state.audioData = new window.SpeechSynthesisUtterance()
+ state.audioData.text = val
+ state.audioData.onstart = function (e) {
+ state.audioState = true
+ }
+ state.audioData.onend = function (event) {
+ state.audioState = false
+ }
+ },
+ MSET_GETAUDIOBEGIN ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ if (state.audioState) {
+ window.speechSynthesis.cancel()
+ state.audioState = false
+ } else {
+ if (val != 'notOpen') {
+ window.speechSynthesis.speak(state.audioData)
+ }
+ }
+ },
+ // 文字转语音控制↑
+ // 导航系统↓
+ MSET_GOTOWHERE ({
+ state,
+ commit,
+ dispatch
+ }, val) {
+ state.routerS = [] // 清空存着的路径
+ // 单条步行
+ // 本地图使用的是WGS84坐标，而高德使用的是火星坐标GCJ02，所以需要转换参数过去
+ // 返回值需要转换为WGS84坐标
+ state.navigationStartLngLat = [+val.start[0], +val.start[1]] // 导航起点
+ state.navigationEndLngLat = [+val.end[0], +val.end[1]] // 导航终点
+ // 转换WGS84坐标为GCJ02
+ const GCJ02StartLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
+ Number(state.navigationStartLngLat[0]),
+ Number(state.navigationStartLngLat[1])
+ )
+ const GCJ02EndLngLat = global.DC.CoordTransform.WGS84ToGCJ02(
+ Number(state.navigationEndLngLat[0]),
+ Number(state.navigationEndLngLat[1])
+ )
+ // 获取路径，使用的是高德API
+
+ let url = 'https://restapi.amap.com/v3/direction/walking' // 默认api步行
+ const data = {
+ origin: `${Number(GCJ02StartLngLat[0]).toFixed(6)},${Number(
+ GCJ02StartLngLat[1]
+ ).toFixed(6)}`,
+ destination: `${Number(GCJ02EndLngLat[0]).toFixed(6)},${Number(
+ GCJ02EndLngLat[1]
+ ).toFixed(6)}`,
+ key: '4b3e1db3211054ce5b466407cbb9d221',
+ output: 'json'
+ }
+ let strategyType = [0]
+ if (val.type) {
+ // 切换驾车模式
+ url = 'https://restapi.amap.com/v3/direction/driving'
+ data.strategy = 10
+ strategyType = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
+ }
+ // for (let index = 0; index < strategyType.length; index++) {
+ // data["strategy"] = strategyType[index];
+ axios
+ .get(url, {
+ params: {
+ ...data
+ }
+ })
+ .then((res) => {
+ // 回调
+ const paths = res.data.route.paths
+ for (let i = 0; i < paths.length; i++) {
+ // 多条路线
+ drawALine(paths[i])
+ }
+ // const paths = res.data.route.paths[0].steps;
+ // drawALine(paths, res.data.route.paths[0].strategy);
+ })
+ // }
+ const drawALine = (pathsour) => {
+ const paths = pathsour.steps
+ const titles = pathsour.strategy
+ // paths是个道路对象，其中polyline是String类型的经纬度
+ let Str = state.navigationStartLngLat.join(',') + ';' // 加入起点
+ for (let index = 0; index < paths.length; index++) {
+ const path = paths[index]
+ let polyline = path.polyline // 取到String类型的经纬度
+ const polylineArr = polyline.split(';') // 转为数组
+ const polylineArrLength = polylineArr.length // 获取长度，避免多次重复读取polylineArr.length
+ for (let k = 0; k < polylineArrLength; k++) {
+ const inPolylineArr = polylineArr[k].split(',') // 转经纬度为单独的数组
+ const outIn = global.DC.CoordTransform.GCJ02ToWGS84(
+ // 处理火星坐标转换成WGS84 GCJ02ToWGS84
+ inPolylineArr[0],
+ inPolylineArr[1]
+ )
+ polylineArr[k] = outIn.join(',') // 每组经纬度转为String
+ }
+ polyline = polylineArr.join(';') // 合并转换后的经纬度合集
+
+ Str += polyline // 自加
+ Str += ';'
+ }
+ Str += state.navigationEndLngLat.join(',') // 加入终点
+ if (val.fn) {
+ const dataS = {
+ // 返回数据
+ titles: titles,
+ Str: Str
+ }
+ // console.log(Str);
+ state.routerS.push(dataS)
+ return val.fn(dataS)
+ } else {
+ dispatch('MSET_DRAWALINELAYER', Str) // 绘画线路
+ }
+ }
+ },
+ // 导航系统↑
+ // 绘画线路
+ MSET_DRAWALINELAYER ({
+ state,
+ commit,
+ dispatch
+ }, value) {
+ const Str = value[0]
+ // 检查是否存在路线
+ commit('removePolyline')
+ commit('removePolylineMany')
+ const color =
+ global.DC.Namespace.Cesium.Color.fromCssColorString('#409EFF')
+ const material = new global.DC.PolylineTrailMaterialProperty({
+ color: color,
+ speed: 10
+ })
+ state.drawALineLayer = new global.DC.VectorLayer('lineLayer')
+ state.mviewer.addLayer(state.drawALineLayer)
+
+ // 如果是添加 给第一个点加入图标 和事件
+ if (value[1]) {
+ commit('removerPolyLineIcon')
+ state.drawALineLayerIcon = new global.DC.VectorLayer('pointLayer')
+ state.mviewer.addLayer(state.drawALineLayerIcon)
+ const useStr = Str.split(';')
+ const post = useStr[useStr.length - 1].split(',')
+ const position = new global.DC.Position(post[0], post[1])
+ const billboard = new global.DC.Billboard(
+ position,
+ 'img/dingwei/dingwei1.png'
+ ) // 加入绘画点
+ billboard.setStyle({
+ pixelOffset: {
+ x: 0,
+ y: -17
+ } // 偏移像素
+ })
+ // 订阅事件
+ billboard.on(global.DC.MouseEventType.CLICK, (e) => {
+ // console.log(e);
+ // return;
+ // 定制化窗体
+ const position = e.position
+ const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
+ const windowData = {
+ position,
+ lntLat,
+ query: {
+ ...(value[1] || {}),
+ position,
+ lntLat,
+ notAddGoOn: 'notAddGoOn'
+ },
+ useJWD: true // 仅使用经纬度
+ }
+ dispatch('setMobileWindows', windowData)
+ })
+ state.drawALineLayerIcon.addOverlay(billboard)
+ }
+ const polyline = new global.DC.Polyline(Str) // 加入线
+ polyline.setStyle({
+ width: 3,
+ material: material,
+ clampToGround: true
+ })
+ state.drawALineLayer.addOverlay(polyline)
+
+ state.isOpenDrawALine = true
+ // commit("cameraSetView", state.navigationStartLngLat); //移动
+ },
+ // 绘画线路活动多条
+ MSET_DRAWALINELAYERMANY ({
+ state,
+ commit,
+ dispatch
+ }, value) {
+ // 检查是否存在路线
+ commit('removePolylineMany')
+ commit('removePolyline')
+ commit('removerPolyLineIcon')
+ const Strs = value[0]
+ const red = global.DC.Namespace.Cesium.Color.fromCssColorString('#FF0000')
+ const white = global.DC.Namespace.Cesium.Color.fromCssColorString('#fff')
+ const blue = global.DC.Namespace.Cesium.Color.fromCssColorString('#2196F3')
+ const material = new global.DC.PolylineTrailMaterialProperty({
+ color: red,
+ speed: 10
+ })
+ const material1 = new global.DC.PolylineImageTrailMaterialProperty({
+ color: red,
+ speed: 60,
+ image: 'img/icon/right.png',
+ repeat: {
+ x: 320,
+ y: 1
+ }
+ })
+ const drawALineLayerMany = new global.DC.VectorLayer('manyLinePointLayer')
+ state.mviewer.addLayer(drawALineLayerMany)
+ const drawAPointLayerMany = new global.DC.HtmlLayer('manyPointPointLayer')
+ state.mviewer.addLayer(drawAPointLayerMany)
+ // 多条线
+ for (const k in Strs) {
+ const polyline = new global.DC.Polyline(Strs[k].value) // 加入绘画点
+ polyline.setStyle({
+ width: 6,
+ material: material1,
+ clampToGround: true
+ })
+ drawALineLayerMany.addOverlay(polyline)
+ // let post = Strs[k].value.split(";")[0].split(",");
+ // let position = new global.DC.Position(post[0], post[1]);
+ // let Label = new global.DC.Label(position, Strs[k].name);
+ // Label.setStyle({
+ // font: "16px sans-serif", // CSS 字体设置
+ // scale: 1, //比例
+ // fillColor: white, //文字颜色
+ // showBackground: true, //是否显示背景
+ // backgroundColor: blue, //背景颜色
+ // // outlineColor: white, //边框颜色
+ // // outlineWidth: 10, //边框大小，
+ // });
+ // drawALineLayerMany.addOverlay(Label);
+ }
+ // 多个点
+ const point = value[1]
+ for (const k in point) {
+ const post = point[k].value
+ const position = new global.DC.Position(post[0], post[1])
+
+ // 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 }, //偏移像素
+ // });
+ const Labels = new global.DC.DivIcon(
+ // new this.DC.Position(Number(item[0]), Number(item[1]), 0),
+ position,
+ `
<div class="point-entitys-box">
<div class="point-logo">
<img src="/img/icon/activity.png">
@@ -1093,38 +1089,38 @@
</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];
- let windowData = {
- position,
- lntLat,
- query: {
- ...(value[2] || {}),
- position,
- lntLat
- },
- useJWD: true, //仅使用经纬度
- };
- dispatch("setMobileWindows", windowData);
- });
- drawAPointLayerMany.addOverlay(Labels);
- // console.log(point[k]);
- }
- state.drawALineLayerMany = drawALineLayerMany;
- state.drawAPointLayerMany = drawAPointLayerMany;
- // state.isOpenDrawALineMany = value[2].name ? value[2].name : true;
- // commit("cameraSetView", state.navigationStartLngLat); //移动
- },
- },
-};
+ )
+ // 订阅事件
+ Labels.on(global.DC.MouseEventType.CLICK, (e) => {
+ // console.log(e);
+ // return;
+ if (value[3]) {
+ value[3]()
+ }
+ // 定制化窗体
+ const position = e.position
+ const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
+ const windowData = {
+ position,
+ lntLat,
+ query: {
+ ...(value[2] || {}),
+ position,
+ lntLat
+ },
+ useJWD: true // 仅使用经纬度
+ }
+ dispatch('setMobileWindows', windowData)
+ })
+ drawAPointLayerMany.addOverlay(Labels)
+ // console.log(point[k]);
+ }
+ state.drawALineLayerMany = drawALineLayerMany
+ state.drawAPointLayerMany = drawAPointLayerMany
+ // state.isOpenDrawALineMany = value[2].name ? value[2].name : true;
+ // commit("cameraSetView", state.navigationStartLngLat); //移动
+ }
+ }
+}
-export default mobile;
\ No newline at end of file
+export default mobile
diff --git a/src/store/modules/pc/leftNavsData.js b/src/store/modules/pc/leftNavsData.js
index 825804b..c4a3bdf 100644
--- a/src/store/modules/pc/leftNavsData.js
+++ b/src/store/modules/pc/leftNavsData.js
@@ -1,58 +1,57 @@
-let leftNavsData = {
+const leftNavsData = {
state: {
addIconsLayerIconstate: false,
addIconsLayerIconLayer: null,
- addIconsLayerIconPopup: false, //控制编辑窗口显影
- addIconsLayerIconPosition: [], //发送坐标
+ addIconsLayerIconPopup: false, // 控制编辑窗口显影
+ addIconsLayerIconPosition: [] // 发送坐标
},
actions: {
- chouseAddIconsLayerIcon({
+ chouseAddIconsLayerIcon ({
state,
commit,
dispatch
}, val) {
- //加载图层
- commit("createAddIconsLayerIconLayer", {
+ // 加载图层
+ commit('createAddIconsLayerIconLayer', {
viewer: val.viewer
})
- //重置事件
- state.addIconsLayerIconstate = false;
- commit("set_closeMapClick", true); //关闭其他操作
- //监听鼠标移动
+ // 重置事件
+ state.addIconsLayerIconstate = false
+ commit('set_closeMapClick', true) // 关闭其他操作
+ // 监听鼠标移动
val.viewer.on(global.DC.MouseEventType.MOUSE_MOVE, (e) => {
- if (state.addIconsLayerIconstate) { //事件完成
- return;
+ if (state.addIconsLayerIconstate) { // 事件完成
+ return
}
- commit("addIconsLayerIconmoveMessage", {
+ commit('addIconsLayerIconmoveMessage', {
e: e,
- b: "点击确认标注位置",
+ b: '点击确认标注位置',
viewer: val.viewer
})
- });
+ })
val.viewer.once(global.DC.MouseEventType.CLICK, (e) => {
- commit("addIconsLayerIconmoveMessage", { //取消tip
+ commit('addIconsLayerIconmoveMessage', { // 取消tip
e: e,
- b: "",
+ b: '',
viewer: val.viewer
})
- dispatch("pcFlyView", { //飞入位置
+ dispatch('pcFlyView', { // 飞入位置
jd: e.wgs84SurfacePosition.lng,
wd: +e.wgs84SurfacePosition.lat + 0.0002,
- viewer: val.viewer,
- });
- //完成选点操作
- state.addIconsLayerIconstate = true;
+ viewer: val.viewer
+ })
+ // 完成选点操作
+ state.addIconsLayerIconstate = true
// commit("set_closeMapClick", false); //开启其他操作
if (val.fn) {
- let lnglat = [e.wgs84SurfacePosition.lng,
- e.wgs84SurfacePosition.lat
+ const lnglat = [e.wgs84SurfacePosition.lng,
+ e.wgs84SurfacePosition.lat
]
val.fn(lnglat)
}
- });
-
+ })
},
- addIconsLayerIcon({
+ addIconsLayerIcon ({
state,
commit,
dispatch
@@ -66,18 +65,18 @@
`
<div class="tag-entitys-box">
<div class="tag-content">
- ${val.name || "我的标签"}
+ ${val.name || '我的标签'}
</div>
<div class="tag-angle-content">
<img src="https://map.hit.edu.cn/images/tarrow_xq.png">
</div>
</div>
`
- );
- state.addIconsLayerIconLayer.addOverlay(divIcon);
- //打开编辑窗口弹窗
+ )
+ state.addIconsLayerIconLayer.addOverlay(divIcon)
+ // 打开编辑窗口弹窗
new global.DC.DivForms(val.viewer, {
- domId: "leftNavsAdd",
+ domId: 'leftNavsAdd',
position: [
global.DC.Transform.transformWGS84ToCartesian(
new global.DC.Position(
@@ -85,47 +84,45 @@
Number(val.lnglat[1]),
Number(0)
)
- ),
- ],
- });
- commit("SET_addIconsLayerIconPosition", val.lnglat)
- commit("SET_addIconsLayerIconPopup", true);
+ )
+ ]
+ })
+ commit('SET_addIconsLayerIconPosition', val.lnglat)
+ commit('SET_addIconsLayerIconPopup', true)
}
},
mutations: {
- createAddIconsLayerIconLayer(state, val) {
+ createAddIconsLayerIconLayer (state, val) {
if (state.addIconsLayerIconLayer == null) {
- state.addIconsLayerIconLayer = new global.DC.HtmlLayer("addIconsLayerIconLayer");
- val.viewer.addLayer(state.addIconsLayerIconLayer);
+ state.addIconsLayerIconLayer = new global.DC.HtmlLayer('addIconsLayerIconLayer')
+ val.viewer.addLayer(state.addIconsLayerIconLayer)
}
if (val.clear) {
- state.addIconsLayerIconLayer.clear();
+ state.addIconsLayerIconLayer.clear()
}
- console.log(state.addIconsLayerIconLayer, "see")
},
- addIconsLayerIconmoveMessage(state, val) {
- console.log(val)
- if (val.b == "") {
- val.viewer.tooltip.enable = false;
+ addIconsLayerIconmoveMessage (state, val) {
+ if (val.b == '') {
+ val.viewer.tooltip.enable = false
} else {
- val.viewer.tooltip.enable = true;
- val.viewer.tooltip.showAt(val.e.windowPosition, val.b);
+ val.viewer.tooltip.enable = true
+ val.viewer.tooltip.showAt(val.e.windowPosition, val.b)
}
},
- SET_addIconsLayerIconPopup(state, addIconsLayerIconPopup) {
+ SET_addIconsLayerIconPopup (state, addIconsLayerIconPopup) {
state.addIconsLayerIconPopup = addIconsLayerIconPopup
- if (!state.addIconsLayerIconPopup) { //关闭即关闭图层 并刷新标签
+ if (!state.addIconsLayerIconPopup) { // 关闭即关闭图层 并刷新标签
if (state.addIconsLayerIconLayer) {
- state.addIconsLayerIconLayer.clear();
- state.addIconsLayerIconLayer.remove();
- state.addIconsLayerIconLayer = null;
+ state.addIconsLayerIconLayer.clear()
+ state.addIconsLayerIconLayer.remove()
+ state.addIconsLayerIconLayer = null
}
}
},
- SET_addIconsLayerIconPosition(state, addIconsLayerIconPosition) {
+ SET_addIconsLayerIconPosition (state, addIconsLayerIconPosition) {
state.addIconsLayerIconPosition = addIconsLayerIconPosition
- },
+ }
}
}
-export default leftNavsData
\ No newline at end of file
+export default leftNavsData
diff --git a/src/store/modules/popupParams.js b/src/store/modules/popupParams.js
index edbfa68..d8dd881 100644
--- a/src/store/modules/popupParams.js
+++ b/src/store/modules/popupParams.js
@@ -23,103 +23,103 @@
addTagPopup: false,
addTagPosition: null,
- labelLayer: null, //自定义标签图层
+ labelLayer: null, // 自定义标签图层
addSignList: true,
myviewer: null,
nowlabelLayerData: {},
labelLayerDataShow: false,
- closeMapClick: false, //关闭地图点击，防止新增标签误触
+ closeMapClick: false // 关闭地图点击，防止新增标签误触
},
mutations: {
...leftNavsData.mutations,
- SET_POPUPBGURL(state, popupBgUrl) {
+ SET_POPUPBGURL (state, popupBgUrl) {
// console.log(popupBgUrl, "see33333")
if (!popupBgUrl) {
- return;
+ return
}
- state.popupBgUrl = popupBgUrl;
+ state.popupBgUrl = popupBgUrl
},
- SET_POPUPQRURL(state, pupupQRUrl) {
+ SET_POPUPQRURL (state, pupupQRUrl) {
state.pupupQRUrl = pupupQRUrl
},
- SET_TERMINUS(state, terminus) {
+ SET_TERMINUS (state, terminus) {
state.terminus = terminus
},
- SET_STARTINGPOINT(state, startingPoint) {
+ SET_STARTINGPOINT (state, startingPoint) {
state.startingPoint = startingPoint
},
- SET_POINTPOSITION(state, pointPosition) {
+ SET_POINTPOSITION (state, pointPosition) {
state.pointPosition = pointPosition
},
- SET_STATENAME(state, stateName) {
+ SET_STATENAME (state, stateName) {
state.stateName = stateName
},
- SET_SITENAME(state, siteName) {
+ SET_SITENAME (state, siteName) {
state.siteName = siteName
},
- SET_TELEPHONE(state, telephone) {
+ SET_TELEPHONE (state, telephone) {
state.telephone = telephone
},
- SET_INTRODUCETEXT(state, introduceText) {
+ SET_INTRODUCETEXT (state, introduceText) {
state.introduceText = introduceText
},
- SET_PANORAMAURL(state, panoramaUrl) {
+ SET_PANORAMAURL (state, panoramaUrl) {
state.panoramaUrl = panoramaUrl
},
- SET_PANORAMAPOPUP(state, panoramaPopup) {
+ SET_PANORAMAPOPUP (state, panoramaPopup) {
state.panoramaPopup = panoramaPopup
},
- SET_MONITORURL(state, monitorUrl) {
+ SET_MONITORURL (state, monitorUrl) {
state.monitorUrl = monitorUrl
},
- SET_MONITORPOPUP(state, monitorPopup) {
+ SET_MONITORPOPUP (state, monitorPopup) {
state.monitorPopup = monitorPopup
},
- SET_DETAILSPOPUP(state, detailsPopup) {
+ SET_DETAILSPOPUP (state, detailsPopup) {
state.detailsPopup = detailsPopup
},
- SET_POPUPIMGATLAS(state, popupImgAtlas) {
+ SET_POPUPIMGATLAS (state, popupImgAtlas) {
state.popupImgAtlas = popupImgAtlas
},
- SET_TEACHLIST(state, teachList) {
+ SET_TEACHLIST (state, teachList) {
state.teachList = teachList
},
- SET_LIVELIST(state, liveList) {
+ SET_LIVELIST (state, liveList) {
state.liveList = liveList
},
- SET_ADDTAGPOPUP(state, addTagPopup) {
+ SET_ADDTAGPOPUP (state, addTagPopup) {
state.addTagPopup = addTagPopup
},
- SET_ADDTAGPOSITION(state, addTagPosition) {
+ SET_ADDTAGPOSITION (state, addTagPosition) {
state.addTagPosition = addTagPosition
},
- initLabelLayer(state, val) {
+ initLabelLayer (state, val) {
if (!state.labelLayer) {
- state.labelLayer = new global.DC.HtmlLayer("labelLayer");
- val.addLayer(state.labelLayer);
+ state.labelLayer = new global.DC.HtmlLayer('labelLayer')
+ val.addLayer(state.labelLayer)
}
- state.myviewer = val;
+ state.myviewer = val
},
- clearLabelLayerIcon(state, val) {
+ clearLabelLayerIcon (state, val) {
if (state.labelLayer) {
- state.labelLayer.clear();
+ state.labelLayer.clear()
}
},
- openLabelLayer(state, val) {
+ openLabelLayer (state, val) {
// console.log(val, "see")
if (val.show) {
- state.nowlabelLayerData = val.data;
- state.labelLayerDataShow = true;
+ state.nowlabelLayerData = val.data
+ state.labelLayerDataShow = true
} else {
- state.nowlabelLayerData = {};
- state.labelLayerDataShow = false;
+ state.nowlabelLayerData = {}
+ state.labelLayerDataShow = false
}
},
- CLEAR_ALL(state, param) {
+ CLEAR_ALL (state, param) {
state.siteName = param
state.introduceText = param
state.telephone = param
@@ -129,13 +129,13 @@
state.teachList = []
state.liveList = []
},
- set_closeMapClick(state, val) {
- state.closeMapClick = val;
+ set_closeMapClick (state, val) {
+ state.closeMapClick = val
}
},
actions: {
...leftNavsData.actions,
- openPopups({
+ openPopups ({
state,
commit,
dispatch
@@ -150,7 +150,7 @@
// });
// });
var popup = new global.DC.DivForms(state.viewer, {
- domId: "divFormsDomBox",
+ domId: 'divFormsDomBox',
position: [
global.DC.Transform.transformWGS84ToCartesian(
new global.DC.Position(
@@ -158,52 +158,50 @@
Number(value.lat),
Number(value.alt || 0)
)
- ),
- ],
- });
- dispatch("setOurDataInPoput", value);
- dispatch("pcFlyView", {
+ )
+ ]
+ })
+ dispatch('setOurDataInPoput', value)
+ dispatch('pcFlyView', {
jd: value.lng,
wd: value.lat,
- viewer: this.viewer,
- });
+ viewer: this.viewer
+ })
},
- setOurDataInPoput({
+ setOurDataInPoput ({
state,
commit,
dispatch
}, value) {
- //弹窗使用方法
+ // 弹窗使用方法
- commit("CLEAR_ALL", null);
+ commit('CLEAR_ALL', null)
-
- commit("SET_STATENAME", value.item.mechanismname);
- commit("SET_PANORAMAURL", value.item.panoramaurl);
- commit("SET_INTRODUCETEXT", value.item.introduce);
- var imgArr = [];
+ commit('SET_STATENAME', value.item.mechanismname)
+ commit('SET_PANORAMAURL', value.item.panoramaurl)
+ commit('SET_INTRODUCETEXT', value.item.introduce)
+ var imgArr = []
if (value.item.tpurl) {
- imgArr = value.item.tpurl.split(",");
+ imgArr = value.item.tpurl.split(',')
}
- commit("SET_POPUPBGURL", imgArr[0]);
+ commit('SET_POPUPBGURL', imgArr[0])
commit('SET_POPUPIMGATLAS', imgArr)
- commit("SET_POPUPQRURL", value.item.codeurl);
- commit("SET_POINTPOSITION", [
+ commit('SET_POPUPQRURL', value.item.codeurl)
+ commit('SET_POINTPOSITION', [
Number(value.lng),
Number(value.lat),
Number(0),
Number(0),
Number(-90),
- Number(0),
- ]);
- commit("SET_DETAILSPOPUP", true);
+ Number(0)
+ ])
+ commit('SET_DETAILSPOPUP', true)
},
- pcMoveView({
+ pcMoveView ({
state,
commit,
dispatch
}, val) {
- console.log(val, "see1")
val.viewer.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
@@ -217,36 +215,36 @@
heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
// 视角
pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0,
- },
- });
+ roll: 0.0
+ }
+ })
},
- pcFlyView({
+ pcFlyView ({
state,
commit,
dispatch
}, val) {
val.viewer.flyToPosition(
new global.DC.Position(Number(val.jd), Number(val.wd), Number(300), Number(0), Number(-90), Number(0)),
- function () {},
+ function () { },
2
)
},
- addLabelLayerIcon({
+ addLabelLayerIcon ({
state,
commit,
dispatch
}, val) {
- let list = val.list;
+ const list = val.list
if (val.clear) {
// state.labelLayer.remove();
- state.labelLayer.clear();
+ state.labelLayer.clear()
}
- if (val.add) { //刷新列表
- state.addSignList = !state.addSignList;
- return;
+ if (val.add) { // 刷新列表
+ state.addSignList = !state.addSignList
+ return
}
- for (let i in list) {
+ for (const i in list) {
const divIcon = new global.DC.DivIcon(
new global.DC.Position(
Number(list[i].jd),
@@ -263,17 +261,17 @@
</div>
</div>
`
- );
- //订阅事件
+ )
+ // 订阅事件
divIcon.on(global.DC.MouseEventType.CLICK, (e) => {
// console.log(e);
// return;
// 定制化窗体
- let position = e.position,
- lntLat = [e.overlay._position._lng, e.overlay._position._lat];
+ const position = e.position
+ const lntLat = [e.overlay._position._lng, e.overlay._position._lat]
// console.log(position, lntLat, list[i], state.myviewer, "see")
new global.DC.DivForms(state.myviewer, {
- domId: "labelLayerid",
+ domId: 'labelLayerid',
position: [
global.DC.Transform.transformWGS84ToCartesian(
new global.DC.Position(
@@ -281,9 +279,9 @@
Number(lntLat[1]),
Number(0)
)
- ),
- ],
- });
+ )
+ ]
+ })
state.myviewer.camera.setView({
// Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
// fromDegrees()方法，将经纬度和高程转换为世界坐标
@@ -297,18 +295,18 @@
heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
// 视角
pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
- roll: 0.0,
- },
- });
- commit("openLabelLayer", {
+ roll: 0.0
+ }
+ })
+ commit('openLabelLayer', {
show: true,
data: list[i]
})
- });
- state.labelLayer.addOverlay(divIcon);
+ })
+ state.labelLayer.addOverlay(divIcon)
}
- },
+ }
}
}
-export default popupParams
\ No newline at end of file
+export default popupParams
--
Gitblit v1.9.3