From 0f6f73971c9c3db3d591018a8e6c2272ea07088a Mon Sep 17 00:00:00 2001
From: liuyg <liuyg@qq.com>
Date: Mon, 28 Mar 2022 11:14:18 +0800
Subject: [PATCH] +抚州数据以及缩放调整，活动底图数据获取
---
/dev/null | 37 --
src/components/mobilemap/index.vue | 60 +++
src/components/mobileActivity/index.vue | 72 ++++
src/components/mobileActivity旧的没底图/move.js | 166 ++++++++++
src/store/modules/mobile.js | 74 ++--
src/api/mobile/hd/hd.js | 7
src/components/mobileActivity旧的没底图/index.vue | 507 +++++++++++++++++++++++++++++++
7 files changed, 837 insertions(+), 86 deletions(-)
diff --git a/src/api/mobile/hd/hd.js b/src/api/mobile/hd/hd.js
index 5145ac4..f2f03bd 100644
--- a/src/api/mobile/hd/hd.js
+++ b/src/api/mobile/hd/hd.js
@@ -13,3 +13,10 @@
method: "get",
});
};
+
+export const getdetail = (id) => {
+ return request({
+ url: `blade-hd/hd/detail?id=` + id,
+ method: "get",
+ });
+};
\ No newline at end of file
diff --git a/src/components/mobileActivity copy/index.vue b/src/components/mobileActivity copy/index.vue
deleted file mode 100644
index 0cc7508..0000000
--- a/src/components/mobileActivity copy/index.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<template>
- <div id="mobileActivity">
- <div class="mobileActivity_in">showActivity</div>
- </div>
-</template>
-
-<script>
-import { mapGetters } from "vuex";
-export default {
- name: "mobileActivity",
- computed: {
- ...mapGetters(["showActivity"]),
- },
-};
-</script>
-<style lang="scss" scoped>
-#mobileActivity {
- position: fixed;
- top: 0px;
- left: 0px;
- width: 100%;
- height: 100%;
- background-color: rgba($color: #000000, $alpha: 0.3);
- z-index: 999;
- display: flex;
- align-items: center;
- justify-content: center;
- .mobileActivity_in {
- border-radius: 25px 25px 10px 10px;
- width: 70%;
- height: 50%;
- background-color: #fff;
- box-sizing: border-box;
- padding: 10px;
- }
-}
-</style>
diff --git a/src/components/mobileActivity/index.vue b/src/components/mobileActivity/index.vue
index 8648b4d..7c60640 100644
--- a/src/components/mobileActivity/index.vue
+++ b/src/components/mobileActivity/index.vue
@@ -50,7 +50,7 @@
<div class="mobileActivity_coutrol" :style="{ bottom: bottom + 'px' }">
<ul>
<li
- v-for="(item, index) in leftNavData"
+ v-for="(item, index) in ourLeftData"
:key="index"
@click="mobileActivityCoutrolClick(item)"
v-show="!item.notShow"
@@ -66,6 +66,8 @@
<script>
import { mapGetters } from "vuex";
import moveWindow from "./move";
+import { getdetail } from "@/api/mobile/hd/hd";
+window.serviceMapSee = {};
export default {
name: "mobileActivity",
computed: {
@@ -75,6 +77,9 @@
// 'drawALineLayerMany',
// 'drawAPointLayerMany'
]),
+ ourLeftData() {
+ return [...this.serviceMap, ...this.leftNavData];
+ },
},
data() {
const heig = 135;
@@ -124,6 +129,19 @@
// layer: "sceneLayer",
// imgSrc: "img/leftnav/map-panorama.png",
// // imgSrc: "img/mobile/blue.png",
+ // },
+ ],
+ //底图
+ serviceMap: [
+ // {
+ // flag: true,
+ // label: "底图1",
+ // 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: null,
// },
],
};
@@ -190,6 +208,51 @@
that.domMove.opens(false, true);
},
]);
+
+ //绘画底图
+ //获取详细信息，来获取底图
+ // console.log(this.showActivityData, "see");
+ that.serviceMap = [];
+ getdetail(this.showActivityData.opendata.id).then((res) => {
+ let name = res.data.data.mapname.split(",");
+ let url = res.data.data.url.split(",");
+ for (let k in name) {
+ let d = {
+ flag: true,
+ label: name[k],
+ 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: "serviceMap" + that.serviceMap.length,
+ url: url[k],
+ to: "serviceMap",
+ };
+ // this.leftNavData.shift(d);
+ // console.log(d, "see");
+ // that.serviceMap.push(d);
+ // window.serviceMapSee[d.layer] =
+ // global.DC.ImageryLayerFactory.createArcGisImageryLayer({
+ // url: url[k],
+ // });
+ // global.viewer.addBaseLayer(window.serviceMapSee[d.layer], {
+ // iconUrl: "examples/images/icon/elec.png",
+ // name: d.layer,
+ // });
+ }
+ // const baselayer_shaded =
+ // global.DC.ImageryLayerFactory.createArcGisImageryLayer({
+ // url: "https://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer",
+ // });
+ // global.viewer.addBaseLayer(baselayer_shaded, {
+ // iconUrl: "examples/images/icon/elec.png",
+ // name: "电子",
+ // });
+
+ // console.log(window.serviceMapSee, "see");
+ // }
+ });
};
}
},
@@ -270,6 +333,10 @@
item.img = item.checked;
} else {
item.img = item.normal;
+ }
+ if (item.to == "serviceMap") {
+ console.log(item);
+ return;
}
this.$store.commit("showLineOrPoint", {
layer: item.layer,
@@ -473,13 +540,14 @@
margin-bottom: 6px;
font-weight: 400;
display: block;
- width: 80px;
+ // width: 80px;
height: 30px;
line-height: 30px;
background-color: #fff;
border-radius: 15px;
text-align: center;
font-size: 0;
+ padding: 0 6px;
cursor: pointer;
img {
diff --git "a/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/index.vue" "b/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/index.vue"
new file mode 100644
index 0000000..1065cd0
--- /dev/null
+++ "b/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/index.vue"
@@ -0,0 +1,507 @@
+<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>
+ </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 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";
+export default {
+ name: "mobileActivity没底图",
+ computed: {
+ ...mapGetters([
+ "showActivity",
+ "showActivityData",
+ // 'drawALineLayerMany',
+ // 'drawAPointLayerMany'
+ ]),
+ },
+ 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",
+ // },
+ ],
+ };
+ },
+ 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;
+ 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;
+ 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;
+ }
+}
+
+.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);
+ }
+}
+.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;
+ 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;
+ }
+
+ span {
+ display: inline-block;
+ vertical-align: middle;
+ font-size: 14px;
+ color: #2f2f2f;
+ }
+ }
+}
+</style>
diff --git "a/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/move.js" "b/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/move.js"
new file mode 100644
index 0000000..1f5f2b6
--- /dev/null
+++ "b/src/components/mobileActivity\346\227\247\347\232\204\346\262\241\345\272\225\345\233\276/move.js"
@@ -0,0 +1,166 @@
+class moveWindow {
+ constructor(data) {
+ this.id = data.id;
+ this.start = 0;
+ this.end = 0;
+ this.domHeight = 0;
+ this.domMove = null;
+ this.openValue = false;
+ this.useHeight = data.minHeight;
+ this.maxHeight = data.maxHeight;
+ this.height = data.minHeight;
+ this.critical = data.critical;
+ let that = this;
+ this.fn =
+ data.fn ||
+ function (res) {
+ console.log("未设置回调函数");
+ console.log(res);
+ };
+
+ this.ListenerTouchmove = function (window) {
+ let moseHeight = window.changedTouches[0].clientY;
+ // let windowHeight = document.body.clientHeight; //屏幕宽度
+ let endOn = moseHeight;
+ let cha = +that.domHeight + that.start - +endOn;
+ if (cha >= that.maxHeight) {
+ cha = that.maxHeight;
+ } else if (cha <= that.useHeight) {
+ cha = that.useHeight;
+ }
+ let d = {
+ state: "on",
+ height: cha,
+ };
+ that.fn(d);
+ };
+ this.ListenerTouchstart = function (window) {
+ let moseHeight = window.changedTouches[0].clientY;
+ that.start = moseHeight;
+ that.domHeight = document
+ .getElementById(that.id)
+ .style.cssText.split("px")[0]
+ .split("height:")[1];
+ };
+ this.ListenerTouchend = function (window) {
+ let moseHeight = window.changedTouches[0].clientY;
+ that.end = moseHeight;
+ let cha, states;
+ if (that.end >= that.start) {
+ states = false; //方向
+ cha = that.end - that.start;
+ } else {
+ states = true; //方向
+ cha = that.start - that.end;
+ }
+ if (cha >= that.critical) {
+ //高
+ that.opens(states, true); //程度
+ } else if (cha < that.critical) {
+ //低
+ that.opens(states, false); //程度
+ }
+ };
+ return this;
+ }
+ //启动监听事件
+ init() {
+ // this.domMove = document.getElementById(this.id);
+ let that = this;
+ this.checkDom(that.id, (dom) => {
+ //检测是否有dom
+ that.domMove = dom;
+ that.domMove.addEventListener("touchmove", that.ListenerTouchmove);
+ // 结束位置靠滑动距离判断
+ that.domMove.addEventListener("touchstart", that.ListenerTouchstart);
+ that.domMove.addEventListener("touchend", that.ListenerTouchend);
+ });
+ }
+ //关闭监听事件
+ closeInit() {
+ this.domMove = document.getElementById(this.id);
+ this.domMove.removeEventListener("touchmove", this.ListenerTouchmove);
+ // 结束位置靠滑动距离判断
+ this.domMove.removeEventListener("touchstart", this.ListenerTouchstart);
+ this.domMove.removeEventListener("touchend", this.ListenerTouchend);
+ }
+ //输出事件
+ opens(val, chengdu) {
+ if (chengdu) {
+ this.openValue = val;
+ if (val) {
+ this.height = this.maxHeight;
+ } else {
+ this.height = this.useHeight;
+ }
+ } else {
+ this.height = this.domHeight;
+ }
+ let d = {
+ state: this.openValue,
+ height: this.height,
+ };
+ // console.log(val, this.height);
+ this.fn(d);
+ }
+ changeHeight() {
+ //抛出切换方法
+ this.openValue = !this.openValue;
+ if (this.openValue) {
+ this.height = this.maxHeight;
+ } else {
+ this.height = this.useHeight;
+ }
+ let d = {
+ state: this.openValue,
+ height: this.height,
+ };
+ // console.log(val, this.height);
+ this.fn(d);
+ }
+ checkDom(name, fn) {
+ // 声明定时器
+ var timer = null;
+ // 检查dom是否执行完成
+ function checkDom() {
+ // let dom = that.$refs[name];
+ let dom = document.getElementById(name);
+ if (dom) {
+ // 执行dom加载完成后的操作
+ // 清除定时器
+ if (!timer) {
+ clearTimeout(timer);
+ }
+ if (fn) {
+ //回调函数
+ fn(dom);
+ return;
+ } else {
+ return dom;
+ }
+ } else {
+ // 自我调用
+ timer = setTimeout(checkDom, 100);
+ }
+ }
+ // 首次执行
+ checkDom();
+ }
+ // 结束位置是一半判断
+ // domMove.addEventListener("touchend", function (window) {
+ // let moseHeight = window.changedTouches[0].clientY;
+ // let windowHeight = document.body.clientHeight;
+ // let cha = windowHeight - moseHeight;
+ // console.log(cha, "最后位置");
+ // let centerPoint =
+ // (windowHeight / 2 - +that.useHeight) / 2 + +that.useHeight;
+ // if (cha >= centerPoint) {
+ // cha = windowHeight / 2;
+ // } else if (cha < centerPoint) {
+ // cha = that.useHeight;
+ // }
+ // that.height = cha;
+ // });
+}
+
+export default moveWindow;
diff --git a/src/components/mobilemap/index.vue b/src/components/mobilemap/index.vue
index 0546968..9437e14 100644
--- a/src/components/mobilemap/index.vue
+++ b/src/components/mobilemap/index.vue
@@ -115,8 +115,8 @@
],
// areaLayer: null,
// mapCenter: [115.871863, 28.743861, 160.0],
- // mapCenter: [114.04062292 - 0.00035, 27.62666834 + 0.0025, 160.0],
- mapCenter: [116.35381525 - 0.00035, 27.95839468 + 0.0025, 160.0],
+ mapCenter: [114.04062292 - 0.00035, 27.62666834 + 0.0025, 160.0],
+ // mapCenter: [116.35381525 - 0.00035, 27.95839468 + 0.0025, 160.0],
// 控制4层缩放
// onelayerNum: 80,
// towlayerNum: 120,
@@ -134,7 +134,8 @@
intervallayerNum: 15,
frislayertHeight: 160, // 默认高度
- useSuofang: true, //是否缩放
+ useSuofang: false, //是否缩放 true 去掉了缩放，
+ addOthers: true, //加入了活动底图以及抚州底图
};
},
computed: {
@@ -170,7 +171,19 @@
var that = this;
// let viewer;
+ if (this.addOthers) {
+ //抚州视角数据
+ this.mapCenter = [116.35381525 - 0.00035, 27.95839468 + 0.0025, 160.0];
+ this.onelayerNum = 100;
+ this.towlayerNum = 300;
+ this.threelayerNum = 500;
+ this.forlayerNum = 700;
+ this.fivelayerNum = null;
+ this.sixlayerNum = null;
+ this.intervallayerNum = 100;
+ this.frislayertHeight = 700; // 默认高度
+ }
window.initViewer = () => {
global.viewer = new global.DC.Viewer("mobile-viewer-container", {
contextOptions: {
@@ -295,7 +308,11 @@
// conBack(200);
// }
// const usMun = that.forlayerNum ? that.forlayerNum : that.threelayerNum;
- const usMun = that.sixlayerNum;
+ const usMun = that.sixlayerNum
+ ? that.sixlayerNum
+ : that.fivelayerNum
+ ? that.fivelayerNum
+ : that.forlayerNum;
if (window.height1s > usMun && isSet) {
if (that.useSuofang) {
return;
@@ -325,12 +342,15 @@
};
window.butbut = function () {
// return;
- if (that.useSuofang) {
- return;
- }
+ // if (that.useSuofang) {
+ // return;
+ // }
// 放大
document.querySelector(".dc-zoom-controller").children[0].onclick =
function () {
+ if (that.useSuofang) {
+ return;
+ }
if (that.dimension == "2.5D") {
window.height2s = Math.ceil(
global.viewer.camera.positionCartographic.height
@@ -393,6 +413,9 @@
// 缩小
document.querySelector(".dc-zoom-controller").children[2].onclick =
function () {
+ if (that.useSuofang) {
+ return;
+ }
if (that.dimension == "2.5D") {
window.height3s = Math.ceil(
global.viewer.camera.positionCartographic.height
@@ -479,6 +502,18 @@
};
var isCameraTime = null;
global.viewer.on(global.DC.SceneEventType.CAMERA_CHANGED, (e) => {
+ // window.height4s = Math.ceil(
+ // global.viewer.camera.positionCartographic.height
+ // );
+ // if (ii == 1 && startHeight == 0) {
+ // startHeight = window.height4s;
+ // }
+ // ii++;
+ // cutHeight = window.height4s - startHeight;
+ // that.heights = window.height4s;
+ // that.heights1 = cutHeight;
+ // console.log(cutHeight);
+
if (that.useSuofang) {
return;
}
@@ -492,9 +527,9 @@
}
ii++;
cutHeight = window.height4s - startHeight;
+ that.heights = window.height4s;
+ that.heights1 = cutHeight;
// console.log(cutHeight);
- // that.heights = window.height4s;
- // that.heights1 = cutHeight;
// return;
if (isCameraTime) {
clearTimeout(isCameraTime);
@@ -1059,8 +1094,13 @@
that.$store.commit("set_zoomRange", [
that.onelayerNum,
// that.forlayerNum ? that.forlayerNum : that.threelayerNum,
- that.sixlayerNum,
+ that.sixlayerNum
+ ? that.sixlayerNum
+ : that.fivelayerNum
+ ? that.fivelayerNum
+ : that.forlayerNum,
that.useSuofang,
+ that.addOthers,
]); // 送入移动端缩放范围
that.$store.commit("MSET_DIMENSION", "2.5D"); // 切换2.5D设置
} else if (that.dimension == "3D") {
diff --git a/src/store/modules/mobile.js b/src/store/modules/mobile.js
index f9e22cc..f03bee1 100644
--- a/src/store/modules/mobile.js
+++ b/src/store/modules/mobile.js
@@ -295,46 +295,46 @@
maximumLevel: 18
})
)
- global.viewer.imageryLayers.addImageryProvider(
- new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
- url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/FZ25DMap/MapServer/WMTS",
- layer: "fzsw2019",
- style: "default",
- tileMatrixSetID: "default028mm",
- format: "image/jpgpng",
- tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
- maximumLevel: 19,
- tileMatrixLabels: [
- "0",
- "1",
- "2",
- "3",
- "4",
- "5",
- "6",
- "7",
- "8",
- "9",
- "10",
- "11",
- "12",
- "13",
- "14",
- "15",
- "16",
- "17",
- "18",
- "19",
- ],
- })
- );
window.tilesetLayer.show = false // 隐藏3d图形
window.newLayer = window.usetowpointfive() // 添加2.5d图形贴片
window.wallLayer.show = false // 打开瀑布
window.startPointFn() // 移动默认视角
window.areaLayer.show = true // 绿布
- if (state.zoomRange[2]) {
+ if (state.zoomRange[3]) {
+ global.viewer.imageryLayers.addImageryProvider(
+ new global.DC.Namespace.Cesium.WebMapTileServiceImageryProvider({
+ url: "http://arcgis.jxpskj.com:6080/arcgis/rest/services/FZ25DMap/MapServer/WMTS",
+ layer: "fzsw2019",
+ style: "default",
+ tileMatrixSetID: "default028mm",
+ format: "image/jpgpng",
+ tilingScheme: new global.DC.Namespace.Cesium.GeographicTilingScheme(),
+ maximumLevel: 19,
+ tileMatrixLabels: [
+ "0",
+ "1",
+ "2",
+ "3",
+ "4",
+ "5",
+ "6",
+ "7",
+ "8",
+ "9",
+ "10",
+ "11",
+ "12",
+ "13",
+ "14",
+ "15",
+ "16",
+ "17",
+ "18",
+ "19",
+ ],
+ })
+ );
// 2.5D视角限制
// global.viewer.scene.screenSpaceCameraController.minimumZoomDistance = 50
// // 最大
@@ -419,9 +419,9 @@
window.drawALineLayerMany = null
state.isOpenDrawALineMany = false
}
- if (window.drawALineLayerMany) {
- window.drawALineLayerMany.remove()
- window.drawALineLayerMany = null
+ if (window.drawAPointLayerMany) {
+ window.drawAPointLayerMany.remove()
+ window.drawAPointLayerMany = null
state.isOpenDrawALineMany = false
}
},
--
Gitblit v1.9.3