From a916fc2df00bac9f8210b09fd7ee79f8b291e345 Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期三, 07 八月 2024 13:35:08 +0800
Subject: [PATCH] 最新
---
src/components/viewer.vue | 3
src/components/sideMenu/layerMenu/layerPanel2.vue | 404 +++---------
src/components/viewer2d.vue | 284 +++++++++
src/components/sideMenu/layerMenu/layerPanel copy.vue | 687 ++++++++++++++++++++++
src/components/login.vue | 18
src/router/index.js | 3
src/components/sideMenu/layerTreePanel/layerTreePanel2.vue | 1
src/components/viewer-bak.vue | 435 ++++++++++++++
8 files changed, 1,517 insertions(+), 318 deletions(-)
diff --git a/src/components/login.vue b/src/components/login.vue
index 89a01fc..5da85c4 100644
--- a/src/components/login.vue
+++ b/src/components/login.vue
@@ -10,10 +10,13 @@
},
mounted() {
// 娴嬭瘯鐗堟湰鍏嶇櫥褰�
- this.$router.push("/home");
+ // this.$router.push({
+ // path: "/home",
+ // query: { showlayer: this.$route.query.showlayer }
+ // });
- // // 姝ｅ紡鐗堢涓夋柟鐧诲綍
- // this.getQueryString("focus-open-code");
+ // 姝ｅ紡鐗堢涓夋柟鐧诲綍
+ this.getQueryString("focus-open-code");
},
methods: {
@@ -21,11 +24,14 @@
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
- this.$router.push("/home");
+ this.$router.push({
+ path: "/index",
+ query: { showlayer: this.$route.query.showlayer }
+ });
}
return null;
- },
- },
+ }
+ }
};
</script>
diff --git a/src/components/sideMenu/layerMenu/layerPanel copy.vue b/src/components/sideMenu/layerMenu/layerPanel copy.vue
new file mode 100644
index 0000000..d5e0a75
--- /dev/null
+++ b/src/components/sideMenu/layerMenu/layerPanel copy.vue
@@ -0,0 +1,687 @@
+<template>
+ <div class="layerPanel">
+ <div class="mapMode">
+ <div class="title">鍦板浘妯″紡</div>
+ <div class="container">
+ <div
+ class="layerItem"
+ :key="value.id"
+ v-for="(value, index) in eMapModeList"
+ @click.stop="handleEMapClick(value, index)"
+ >
+ <img
+ :src="value.src"
+ :class="{ active: curEMapModelIndex == index }"
+ />
+ <span :class="{ spanActive: curEMapModelIndex == index }">{{
+ value.name
+ }}</span>
+ </div>
+ <div
+ class="layerItem"
+ :key="value0.id"
+ v-for="(value0, index0) in sMapModelList"
+ @click.stop="handleSMapClick(value0, index0)"
+ >
+ <img
+ :src="value0.src"
+ :class="{ active: curSMapModelIndex == index0 }"
+ />
+ <span :class="{ spanActive: curSMapModelIndex == index0 }">{{
+ value0.name
+ }}</span>
+ </div>
+ </div>
+ </div>
+ <!-- <div class="areaType" style="margin-top: 10px">
+ <div class="title">
+ 涓撻鍥惧眰
+ <span class="more" @click.stop="showLayerTree"
+ >鏇村鍥惧眰<i class="el-icon-arrow-right"></i
+ ></span>
+ </div>
+ <div class="container">
+ <div
+ class="layerItem"
+ :key="value1.id"
+ v-for="(value1, index1) in areaTypeList"
+ @click.stop="handleAreaClick(value1, index1)"
+ >
+ <img
+ :src="value1.src"
+ :class="{ active: curAreaTypeIndex == index1 }"
+ />
+ <span :class="{ spanActive: curAreaTypeIndex == index1 }">{{
+ value1.name
+ }}</span>
+ </div>
+ </div>
+ </div> -->
+ <div class="areaType" style="margin-top: 10px">
+ <div class="title">
+ 涓撻搴旂敤
+ <!-- 涓嶆樉绀烘洿澶氬浘灞� -->
+ <span class="more" v-show="false" @click.stop="showLayerTree"
+ >鏇村鍥惧眰<i class="el-icon-arrow-right"></i
+ ></span>
+ </div>
+ <div class="container">
+ <div
+ class="layerItem"
+ v-for="(ZTValue, ZTIndex) in zhuantiList"
+ :key="ZTValue.id"
+ @click.stop="handleZTlick(ZTValue, ZTIndex)"
+ >
+ <img :src="ZTValue.src" :class="{ active: curZTIndex == ZTIndex }" />
+ <span :class="{ spanActive: curZTIndex == ZTIndex }">{{
+ ZTValue.name
+ }}</span>
+ </div>
+ </div>
+ <div class="title2"></div>
+ <div class="container">
+ <div
+ class="layerItem"
+ v-for="(funcValue, funcIndex) in FuncList"
+ :key="funcValue.id"
+ @click.stop="handleFuncClick(funcIndex)"
+ >
+ <img
+ :src="funcValue.src"
+ :class="{ active: curFuncIndex == funcIndex }"
+ />
+ <span :class="{ spanActive: curFuncIndex == funcIndex }">{{
+ funcValue.name
+ }}</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- <div class="yjsxt">
+ <div class="title">鍩庡競閮ㄤ欢</div>
+ <div class="container">
+ <div
+ class="layerItem"
+ :key="value2.id"
+ v-for="(value2, index2) in yjList"
+ @click.stop="handleYJClick(index2)"
+ >
+ <img :src="value2.src" :class="{ active: curYjIndex == index2 }" />
+ <span :class="{ spanActive: curYjIndex == index2 }">{{
+ value2.name
+ }}</span>
+ </div>
+ </div>
+ </div> -->
+ </div>
+</template>
+
+<script>
+import {
+ loadHXQ,
+ loadJKQ,
+ loadXZ,
+ clearMap,
+ loadManhole,
+ loadCamera,
+ loadEnterprise,
+ loadLayer,
+ clearLayerByTypeId,
+ clearLayerByTypeIdArr,
+} from "@/utils/map.js";
+import _GLOBAL from "@/assets/GLOBAL";
+import store from "@/utils/store.js";
+import ZTTitem from "@/utils/ztt.js";
+import { layers } from "../../../../static/json/layer.js";
+export default {
+ name: "LayerPanel",
+ data() {
+ return {
+ eMapModeList: [
+ {
+ id: "ewdt",
+ name: "浜岀淮鍦板浘",
+ active: false,
+ type: "er",
+ src: require("@/assets/img/layer/ewdt.png"),
+ },
+ {
+ id: "yxdt",
+ name: "褰卞儚鍦板浘",
+ active: true,
+ type: "er",
+ src: require("@/assets/img/layer/yxdt.png"),
+ },
+ ],
+ sMapModelList: [
+ {
+ id: "3Dcs",
+ name: "3D鍩庡競",
+ active: false,
+ type: "san",
+ src: require("@/assets/img/layer/3Dcs.png"),
+ },
+ {
+ id: "swmx",
+ name: "涓夌淮妯″瀷",
+ active: false,
+ type: "san",
+ src: require("@/assets/img/layer/swmx.png"),
+ },
+ ],
+ areaTypeList: [
+ // {
+ // id: 'hxq',
+ // name: '鏍稿績鍖�',
+ // active: false,
+ // src: require("@/assets/img/layer/hxq.png")
+ // },
+ // {
+ // id: 'jkq',
+ // name: '缁忓紑鍖�',
+ // active: false,
+ // src: require("@/assets/img/layer/jkq.png")
+ // },
+ // {
+ // id: 'xz',
+ // name: '涔￠晣',
+ // active: false,
+ // src: require("@/assets/img/layer/xz.png")
+ // }
+ {
+ id: "瑙勫垝鑼冨洿",
+ name: "瑙勫垝鑼冨洿",
+ active: false,
+ src: require("@/assets/img/layer/ghfw.png"),
+ },
+ {
+ id: "XingZhengQuHuaTu",
+ name: "琛屾斂鍖哄垝",
+ active: false,
+ src: require("@/assets/img/layer/xzqh.png"),
+ },
+ {
+ id: "GuiHuaDanYuanHuaFenTu",
+ name: "瑙勫垝鍗曞厓",
+ active: false,
+ src: require("@/assets/img/layer/ghdy.png"),
+ },
+ {
+ id: "ZhuYaoGongNengQuGuiHuaShiYiTu",
+ name: "鍔熻兘鍖哄煙",
+ active: false,
+ src: require("@/assets/img/layer/gnq.png"),
+ },
+ ],
+ yjList: [
+ {
+ id: "yinjing",
+ name: "绐ㄤ簳",
+ active: false,
+ src: require("@/assets/img/layer/yj.png"),
+ },
+ {
+ id: "shext",
+ name: "鎽勫儚澶�",
+ active: false,
+ src: require("@/assets/img/layer/sxt.png"),
+ },
+ ],
+ FuncList: [
+ {
+ id: "tdgl",
+ name: "鍦熷湴绠＄悊",
+ active: false,
+ src: require("@/assets/img/layer/tudiguanli.png"),
+ },
+ {
+ id: "history",
+ name: "鍘嗗彶褰卞儚",
+ active: false,
+ src: require("@/assets/img/layer/lishiyingxiang.png"),
+ },
+ ],
+ zhuantiList: ZTTitem,
+ //curMapModelIndex: 1,
+ curEMapModelIndex: 0,
+ curSMapModelIndex: -1,
+ curAreaTypeIndex: -1,
+ curYjIndex: -1,
+ curFuncIndex: -1,
+ curZTIndex: -1,
+ state: store.thematicLayer,
+ basicMapChecked: store.basicMapChecked,
+ state1: store.tdglInfo,
+ };
+ },
+ mounted() {
+ this.$nextTick(() => {
+ setTimeout(() => {
+ this.handleEMapClick(
+ {
+ id: "yxdt",
+ name: "褰卞儚鍦板浘",
+ active: true,
+ type: "er",
+ src: "/static/img/yxdt.cf4698e.png",
+ },
+ 1
+ );
+ loadEnterprise();
+ }, 2000);
+ });
+ },
+ methods: {
+ changeLayerView(max, enableTilt) {
+ window.Viewer.scene.screenSpaceCameraController.maximumZoomDistance = max;
+ window.Viewer.scene.screenSpaceCameraController.enableTilt = enableTilt;
+ },
+ handleMapClick(result, index) {
+ const val = layers.filter((res) => {
+ if (res.name == result.name) {
+ return res;
+ }
+ });
+ const children = val[0].children;
+ if (this.curMapModelIndex == index) {
+ clearLayerByTypeId(result.id);
+ this.curMapModelIndex = -1;
+ } else {
+ this.curMapModelIndex = index;
+ if (result.type == "er") {
+ clearLayerByTypeIdArr(["ewdt", "yxdt"]);
+ } else {
+ clearLayerByTypeIdArr(["3Dcs", "swmx"]);
+ }
+ // clearLayerByTypeIdArr(['ewdt', 'yxdt', '3Dcs', 'swmx']);
+ _GLOBAL.layers[result.id] = [];
+ children.forEach((item) => {
+ let itemLayer = loadLayer(item);
+ _GLOBAL.layers[result.id].push(itemLayer);
+ console.log(_GLOBAL.layers[result.id]);
+ });
+ }
+ },
+ // 浜岀淮搴曞浘閫夋嫨
+ handleEMapClick(result, index) {
+ let p = sgworld.Navigate.getCameraInfo();
+ let pitch;
+ if (pitch !== -90) {
+ pitch = -90;
+ sgworld.Navigate.flyToPointsInterest({
+ destination: new Cesium.Cartesian3.fromDegrees(
+ p.location.lon,
+ p.location.lat,
+ p.location.height
+ ),
+ orientation: {
+ heading: Cesium.Math.toRadians(0),
+ pitch: Cesium.Math.toRadians(pitch),
+ roll: Cesium.Math.toRadians(0),
+ },
+ });
+ }
+
+ // 璁剧疆鐩告満
+ if (result.name == "浜岀淮鍦板浘") {
+ window.Viewer.scene.globe.maximumScreenSpaceError = 4 / 3;
+ this.changeLayerView(25000, false);
+ } else if (result.name == "褰卞儚鍦板浘") {
+ window.Viewer.scene.globe.maximumScreenSpaceError = 4 / 3;
+ this.changeLayerView(50000, false);
+ }
+ // 鍒囨崲鍥惧眰
+ const val = layers.filter((res) => {
+ if (res.name == result.name) {
+ return res;
+ }
+ });
+ const children = val[0].children;
+ if (this.curEMapModelIndex == index) {
+ // 鍐嶆鐐瑰嚮閫変腑鐨刬tem鏃跺彇娑堥�夋嫨
+ // clearLayerByTypeId(result.id);
+ // this.curEMapModelIndex = -1;
+ } else {
+ this.curSMapModelIndex = -1;
+ this.curEMapModelIndex = index;
+ clearLayerByTypeIdArr(["ewdt", "yxdt"]);
+ clearLayerByTypeIdArr(["3Dcs", "swmx"]);
+ _GLOBAL.layers[result.id] = [];
+ children.forEach((item) => {
+ let itemLayer = loadLayer(item);
+ _GLOBAL.layers[result.id].push(itemLayer);
+ // console.log(_GLOBAL.layers[result.id]);
+ });
+ }
+ },
+ // 涓夌淮妯″瀷閫夋嫨
+ handleSMapClick(result, index) {
+ // 璁剧疆鐩告満
+ if (result.name == "3D鍩庡競") {
+ window.Viewer.scene.globe.maximumScreenSpaceError = 2;
+ this.changeLayerView(45000, true);
+ } else if (result.name == "涓夌淮妯″瀷") {
+ window.Viewer.scene.globe.maximumScreenSpaceError = 2;
+ this.changeLayerView(80000, true);
+ }
+ // 鍒囨崲鍥惧眰
+ const val = layers.filter((res) => {
+ if (res.name == result.name) {
+ return res;
+ }
+ });
+ const children = val[0].children;
+ if (this.curSMapModelIndex == index) {
+ // clearLayerByTypeId(result.id);
+ // this.curSMapModelIndex = -1;
+ } else {
+ this.curEMapModelIndex = -1;
+ this.curSMapModelIndex = index;
+ clearLayerByTypeIdArr(["ewdt", "yxdt"]);
+ clearLayerByTypeIdArr(["3Dcs", "swmx"]);
+ _GLOBAL.layers[result.id] = [];
+ children.forEach((item) => {
+ let itemLayer = loadLayer(item);
+ _GLOBAL.layers[result.id].push(itemLayer);
+ console.log(_GLOBAL.layers[result.id]);
+ });
+ }
+ },
+ // 涓撻鍥鹃�夋嫨
+ handleAreaClick(result, index) {
+ const val = layers.filter((res) => {
+ if (res.name == result.name) {
+ return res;
+ }
+ });
+ const children = val[0].children;
+ if (this.curAreaTypeIndex == index) {
+ this.curAreaTypeIndex = -1;
+ let _data = sgworld.ProjectTree.getObject(children[0].id);
+ if (_data) {
+ sgworld.ProjectTree.setVisibility(children[0].id, false);
+ }
+ // clearLayerByTypeIdArr(['GuiHuaFanWeiShiYiTu', 'XingZhengQuHuaTu', 'GuiHuaDanYuanHuaFenTu', 'ZhuYaoGongNengQuGuiHuaShiYiTu']);
+ store.setThematicLayerItemId("");
+ } else {
+ this.curAreaTypeIndex = index;
+ //娓呴櫎
+ //clearLayerByTypeIdArr(['GuiHuaFanWeiShiYiTu', 'XingZhengQuHuaTu', 'GuiHuaDanYuanHuaFenTu', 'ZhuYaoGongNengQuGuiHuaShiYiTu']);
+ let arr = [
+ "GuiHuaFanWeiShiYiTu",
+ "XingZhengQuHuaTu",
+ "GuiHuaDanYuanHuaFenTu",
+ "ZhuYaoGongNengQuGuiHuaShiYiTu",
+ ];
+ arr.forEach((item) => {
+ sgworld.ProjectTree.getObject(item) &&
+ sgworld.ProjectTree.setVisibility(item, false);
+ });
+ let dataObj = sgworld.ProjectTree.getObject(result.id);
+ if (dataObj) {
+ sgworld.ProjectTree.setVisibility(result.id, true);
+ } else {
+ _GLOBAL.layers[result.id] = [];
+ children.forEach((item) => {
+ let itemLayer = loadLayer(item);
+ _GLOBAL.layers[result.id].push(itemLayer);
+ console.log(_GLOBAL.layers[result.id]);
+ });
+ }
+ store.setThematicLayerItemId(result.id);
+ }
+ },
+ // 绐ㄤ簳鍔犺浇
+ handleYJClick(index) {
+ if (this.curYjIndex == index) {
+ this.curYjIndex = -1;
+ window.clusterLayer && window.clusterLayer.clear();
+ } else {
+ this.curYjIndex = index;
+ switch (index) {
+ case 0:
+ loadManhole();
+ break;
+ case 1:
+ loadCamera();
+ break;
+ case 2:
+ loadEnterprise();
+ break;
+ }
+ }
+ },
+ // 绗簩琛� 涓撻鍥� 鐐瑰嚮
+ handleZTlick(result, index) {
+ const val = layers.filter((res) => {
+ if (res.name == result.name) {
+ return res;
+ }
+ });
+ const children = val[0].children;
+ if (this.curZTIndex == index) {
+ this.curZTIndex = -1;
+ // let _data = sgworld.ProjectTree.getObject(children[0].id);
+ // if (_data) {
+ // sgworld.ProjectTree.setVisibility(children[0].id, false);
+ // }
+ store.setThematicLayerItemId("");
+ } else {
+ this.curZTIndex = index;
+ store.setThematicLayerItemId(children);
+
+ // //娓呴櫎
+ // // let arr = [
+ // // "GuiHuaFanWeiShiYiTu",
+ // // "XingZhengQuHuaTu",
+ // // "GuiHuaDanYuanHuaFenTu",
+ // // "ZhuYaoGongNengQuGuiHuaShiYiTu",
+ // // ];
+ // // arr.forEach((item) => {
+ // // sgworld.ProjectTree.getObject(item) &&
+ // // sgworld.ProjectTree.setVisibility(item, false);
+ // // });
+ // let dataObj = sgworld.ProjectTree.getObject(result.id);
+ // if (dataObj) {
+ // sgworld.ProjectTree.setVisibility(result.id, true);
+ // } else {
+ // _GLOBAL.layers[result.id] = [];
+ // children.forEach((item) => {
+ // let itemLayer = loadLayer(item);
+ // _GLOBAL.layers[result.id].push(itemLayer);
+ // console.log(_GLOBAL.layers[result.id]);
+ // });
+ // }
+ // // store.setThematicLayerItemId(result.id);
+ }
+ },
+ // 绗笁琛� 涓撻鍔熻兘 鐐瑰嚮
+ handleFuncClick(index) {
+ if (this.curFuncIndex == index) {
+ store.setTdglFlag(false);
+ store.setPoplayerListAction({});
+ divPoint3 && divPoint3.deleteObject();
+ store.setPoplayerShowAction(false);
+ if (window.tdglLine) {
+ sgworld.Creator.DeleteObject(window.tdglLine);
+ window.tdglLine = null;
+ }
+ this.curFuncIndex = -1;
+ window.clusterLayer && window.clusterLayer.clear();
+ if (window.tdglLayer) {
+ store.setSliderShow(false);
+ sgworld.Creator.DeleteObject(window.tdglLayer);
+ }
+ } else {
+ // 闅愯棌搴曢儴鍥惧眰闈㈢増tdglLayer
+ store.setLayerPanelShow(false);
+ // 闅愯棌鍙充笂瑙掕彍鍗曢潰鏉�
+ store.setMenuListShow(false);
+ // 闅愯棌搴曢儴婕父闈㈡澘
+ store.setRoamPanelShow(false);
+ this.curFuncIndex = index;
+ switch (index) {
+ case 0:
+ store.setSliderShow(true);
+ window.tdglLayer = sgworld.Creator.createImageryProvider(
+ layers[8].name,
+ "tms",
+ {
+ id: layers[8].children[0].id,
+ url: layers[8].children[0].urls,
+ fileExtension: layers[8].children[0].img || "png",
+ enablePickFeatures: false,
+ level: layers[8].children[0].Level,
+ minimumLevel: layers[8].children[0].minimumLevel,
+ maximumLevel: layers[8].children[0].maximumLevel,
+ tilingScheme:
+ layers[8].children[0].tileType === "Geo"
+ ? new Cesium.GeographicTilingScheme()
+ : new Cesium.WebMercatorTilingScheme(),
+ alpha: layers[8].children[0].alpha,
+ },
+ "0",
+ layers[8].children[0].zIndex,
+ true,
+ ""
+ );
+ store.setTdglFlag(true);
+ break;
+ case 1:
+ this.curFuncIndex = -1;
+ store.setTdglFlag(false);
+ if (window.tdglLayer) {
+ store.setSliderShow(false);
+ sgworld.Creator.DeleteObject(window.tdglLayer);
+ }
+ store.setHistoryShow(true);
+ break;
+ }
+ }
+ },
+ showLayerTree() {
+ store.setLayerTreeShow(true);
+ },
+ },
+ watch: {
+ "state.itemId": {
+ handler: function (newVal, oldVal) {
+ let that = this;
+ if (newVal == "") {
+ this.curAreaTypeIndex = -1;
+ } else {
+ let index = -1;
+ if (newVal == "GuiHuaFanWeiShiYiTu") {
+ index = 0;
+ } else if (newVal == "XingZhengQuHuaTu") {
+ index = 1;
+ } else if (newVal == "GuiHuaDanYuanHuaFenTu") {
+ index = 2;
+ } else if (newVal == "ZhuYaoGongNengQuGuiHuaShiYiTu") {
+ index = 3;
+ }
+ this.curAreaTypeIndex = index;
+ }
+ },
+ },
+ // 鍩虹鍥惧眰
+ "basicMapChecked.val": {
+ handler: function (newVal, oldVal) {
+ if (newVal == "涓夌淮妯″瀷") {
+ debugger;
+ this.handleSMapClick(
+ {
+ id: "swmx",
+ name: "涓夌淮妯″瀷",
+ active: false,
+ type: "san",
+ src: require("@/assets/img/layer/swmx.png"),
+ },
+ 1
+ );
+ }
+ },
+ immediate: true, //鍒锋柊鍔犺浇 绔嬮┈瑙﹀彂涓�娆andler
+ deep: true, // 鍙互娣卞害妫�娴嬪埌 obj 瀵硅薄鐨勫睘鎬у�肩殑鍙樺寲
+ },
+ // "state1.alpha": {
+ // handler: function (newVal) {
+ // this.handleFuncClick(0);
+ // },
+ // deep: true,
+ // },
+ },
+ computed: {
+ alpha() {
+ return store.tdglInfo.alpha;
+ },
+ },
+};
+</script>
+
+<style scoped>
+.layerPanel {
+ width: 100%;
+ position: absolute;
+ bottom: 0px;
+ align-items: center;
+ padding: 0.1rem;
+ background: white;
+ z-index: 1000;
+ padding-left: 0.25rem;
+}
+
+.title {
+ height: 25px;
+ font-size: 16px;
+ font-family: Source Han Sans SC;
+ font-weight: 700;
+ color: #181818;
+ line-height: 25px;
+ margin: 10px 0px 10px 0;
+}
+.title2 {
+ height: 15px;
+}
+.container {
+ display: flex;
+ align-items: center;
+ text-align: center;
+}
+
+.layerItem {
+ /* font-size: 14px; */
+ font-family: Source Han Sans SC;
+ font-weight: 400;
+ margin-right: 30px;
+ cursor: pointer;
+}
+
+.active {
+ color: #4187ff;
+ border: 2px solid #4187ff;
+ border-radius: 10px;
+}
+
+.spanActive {
+ color: #4187ff;
+}
+
+img {
+ display: block;
+ width: 60px;
+ height: 40px;
+ margin-bottom: 5px;
+}
+
+.more {
+ float: right;
+ margin-right: 20px;
+ font-size: 0.12rem;
+ color: #4187ff;
+ line-height: 25px;
+ font-weight: 500;
+ font-family: unset;
+ cursor: pointer;
+}
+</style>
\ No newline at end of file
diff --git a/src/components/sideMenu/layerMenu/layerPanel2.vue b/src/components/sideMenu/layerMenu/layerPanel2.vue
index 76a7c60..bb7cdcf 100644
--- a/src/components/sideMenu/layerMenu/layerPanel2.vue
+++ b/src/components/sideMenu/layerMenu/layerPanel2.vue
@@ -9,38 +9,37 @@
v-for="(value, index) in eMapModeList"
@click.stop="handleEMapClick(value, index)"
>
- <img
- :src="value.src"
- :class="{ active: curEMapModelIndex == index }"
- />
- <span :class="{ spanActive: curEMapModelIndex == index }">{{
+ <img :src="value.src" :class="{ active: curEMapModelIndex == index }" />
+ <span :class="{ spanActive: curEMapModelIndex == index }">
+ {{
value.name
- }}</span>
+ }}
+ </span>
</div>
- <div
+ <!-- <div
class="layerItem"
:key="value0.id"
v-for="(value0, index0) in sMapModelList"
@click.stop="handleSMapClick(value0, index0)"
>
- <img
- :src="value0.src"
- :class="{ active: curSMapModelIndex == index0 }"
- />
- <span :class="{ spanActive: curSMapModelIndex == index0 }">{{
+ <img :src="value0.src" :class="{ active: curSMapModelIndex == index0 }" />
+ <span :class="{ spanActive: curSMapModelIndex == index0 }">
+ {{
value0.name
- }}</span>
- </div>
+ }}
+ </span>
+ </div>-->
</div>
</div>
-
+
<div class="areaType">
<div class="title ZTtitle">
涓撻搴旂敤
<!-- 涓嶆樉绀烘洿澶氬浘灞� -->
- <span class="more" v-show="false" @click.stop="showLayerTree"
- >鏇村鍥惧眰<i class="el-icon-arrow-right"></i
- ></span>
+ <span class="more" v-show="false" @click.stop="showLayerTree">
+ 鏇村鍥惧眰
+ <i class="el-icon-arrow-right"></i>
+ </span>
</div>
<div class="container">
<div
@@ -50,9 +49,11 @@
@click.stop="handleZTlick(ZTValue, ZTIndex)"
>
<img :src="ZTValue.src" :class="{ active: curZTIndex == ZTIndex }" />
- <span :class="{ spanActive: curZTIndex == ZTIndex }">{{
+ <span :class="{ spanActive: curZTIndex == ZTIndex }">
+ {{
ZTValue.name
- }}</span>
+ }}
+ </span>
</div>
<div
class="layerItem"
@@ -60,50 +61,15 @@
:key="funcValue.id"
@click.stop="handleFuncClick(funcIndex)"
>
- <img
- :src="funcValue.src"
- :class="{ active: curFuncIndex == funcIndex }"
- />
- <span :class="{ spanActive: curFuncIndex == funcIndex }">{{
+ <img :src="funcValue.src" :class="{ active: curFuncIndex == funcIndex }" />
+ <span :class="{ spanActive: curFuncIndex == funcIndex }">
+ {{
funcValue.name
- }}</span>
+ }}
+ </span>
</div>
- <!-- <div style="height: 0" class="layerItem" v-for="n in 3" :key="n"></div> -->
</div>
- <!-- <div class="container">
- <div
- class="layerItem"
- v-for="(funcValue, funcIndex) in FuncList"
- :key="funcValue.id"
- @click.stop="handleFuncClick(funcIndex)"
- >
- <img
- :src="funcValue.src"
- :class="{ active: curFuncIndex == funcIndex }"
- />
- <span :class="{ spanActive: curFuncIndex == funcIndex }">{{
- funcValue.name
- }}</span>
- </div>
- </div> -->
</div>
-
- <!-- <div class="yjsxt">
- <div class="title">鍩庡競閮ㄤ欢</div>
- <div class="container">
- <div
- class="layerItem"
- :key="value2.id"
- v-for="(value2, index2) in yjList"
- @click.stop="handleYJClick(index2)"
- >
- <img :src="value2.src" :class="{ active: curYjIndex == index2 }" />
- <span :class="{ spanActive: curYjIndex == index2 }">{{
- value2.name
- }}</span>
- </div>
- </div>
- </div> -->
</div>
</template>
@@ -118,7 +84,7 @@
loadEnterprise,
loadLayer,
clearLayerByTypeId,
- clearLayerByTypeIdArr,
+ clearLayerByTypeIdArr
} from "@/utils/map.js";
import _GLOBAL from "@/assets/GLOBAL2";
import store from "@/utils/store2.js";
@@ -131,7 +97,7 @@
addYzLayer,
loadBaseMap,
loadGeoMap,
- clearAll,
+ clearAll
} from "@/utils/tool";
export default {
name: "LayerPanel",
@@ -143,15 +109,15 @@
name: "浜岀淮鍦板浘",
active: false,
type: "er",
- src: require("@/assets/img/layer/ewdt.png"),
+ src: require("@/assets/img/layer/ewdt.png")
},
{
id: "yxdt",
name: "褰卞儚鍦板浘",
active: true,
type: "er",
- src: require("@/assets/img/layer/yxdt.png"),
- },
+ src: require("@/assets/img/layer/yxdt.png")
+ }
],
sMapModelList: [
{
@@ -159,124 +125,65 @@
name: "涓夌淮妯″瀷",
active: false,
type: "san",
- src: require("@/assets/img/layer/swmx.png"),
- },
- ],
- areaTypeList: [
- {
- id: "瑙勫垝鑼冨洿",
- name: "瑙勫垝鑼冨洿",
- active: false,
- src: require("@/assets/img/layer/ghfw.png"),
- },
- {
- id: "XingZhengQuHuaTu",
- name: "琛屾斂鍖哄垝",
- active: false,
- src: require("@/assets/img/layer/xzqh.png"),
- },
- {
- id: "GuiHuaDanYuanHuaFenTu",
- name: "瑙勫垝鍗曞厓",
- active: false,
- src: require("@/assets/img/layer/ghdy.png"),
- },
- {
- id: "ZhuYaoGongNengQuGuiHuaShiYiTu",
- name: "鍔熻兘鍖哄煙",
- active: false,
- src: require("@/assets/img/layer/gnq.png"),
- },
- ],
- yjList: [
- {
- id: "yinjing",
- name: "绐ㄤ簳",
- active: false,
- src: require("@/assets/img/layer/yj.png"),
- },
- {
- id: "shext",
- name: "鎽勫儚澶�",
- active: false,
- src: require("@/assets/img/layer/sxt.png"),
- },
+ src: require("@/assets/img/layer/swmx.png")
+ }
],
FuncList: [
{
id: "tdgl",
name: "鍦熷湴绠＄悊",
active: false,
- src: require("@/assets/img/layer/tudiguanli.png"),
+ src: require("@/assets/img/layer/tudiguanli.png")
},
{
id: "history",
name: "鍘嗗彶褰卞儚",
active: false,
- src: require("@/assets/img/layer/lishiyingxiang.png"),
- },
+ src: require("@/assets/img/layer/lishiyingxiang.png")
+ }
],
zhuantiList: ZTTitem,
//curMapModelIndex: 1,
curEMapModelIndex: 0,
curSMapModelIndex: -1,
curAreaTypeIndex: -1,
- curYjIndex: -1,
curFuncIndex: -1,
curZTIndex: -1,
state: store.thematicLayer,
basicMapChecked: store.basicMapChecked,
- state1: store.tdglInfo,
+ state1: store.tdglInfo
};
},
mounted() {
this.$nextTick(() => {
- // setTimeout(() => {
- // this.handleEMapClick(
- // {
- // id: "yxdt",
- // name: "褰卞儚鍦板浘",
- // active: true,
- // type: "er",
- // src: "/static/img/yxdt.cf4698e.png",
- // },
- // 1
- // );
- // loadEnterprise();
- // }, 2000);
+ setTimeout(() => {
+ switch (this.$route.query.showlayer) {
+ case "SPJK":
+ debugger;
+ this.handleZTlick(ZTTitem[0], 0);
+ break;
+ case "QYXX":
+ this.handleZTlick(ZTTitem[1], 1);
+ break;
+ case "SZGT":
+ this.handleZTlick(ZTTitem[2], 2);
+ break;
+ case "TDGL":
+ this.handleFuncClick(0);
+ break;
+ case "LSYX":
+ this.handleFuncClick(1);
+ break;
+ default:
+ break;
+ }
+ // loadEnterprise();
+ // 鍒濆鍔犺浇鍦板浘
+ // this.handleEMapClick(this.eMapModeList[1], 1);
+ }, 1000);
});
},
methods: {
- changeLayerView(max, enableTilt) {
- window.Viewer.scene.screenSpaceCameraController.maximumZoomDistance = max;
- window.Viewer.scene.screenSpaceCameraController.enableTilt = enableTilt;
- },
- // handleMapClick(result, index) {
- // const val = layers.filter((res) => {
- // if (res.name == result.name) {
- // return res;
- // }
- // });
- // const children = val[0].children;
- // if (this.curMapModelIndex == index) {
- // clearLayerByTypeId(result.id);
- // this.curMapModelIndex = -1;
- // } else {
- // this.curMapModelIndex = index;
- // if (result.type == "er") {
- // clearLayerByTypeIdArr(["ewdt", "yxdt"]);
- // } else {
- // clearLayerByTypeIdArr(["3Dcs", "swmx"]);
- // }
- // // clearLayerByTypeIdArr(['ewdt', 'yxdt', '3Dcs', 'swmx']);
- // _GLOBAL.layers[result.id] = [];
- // children.forEach((item) => {
- // let itemLayer = loadLayer(item);
- // _GLOBAL.layers[result.id].push(itemLayer);
- // console.log(_GLOBAL.layers[result.id]);
- // });
- // }
- // },
// 浜岀淮搴曞浘閫夋嫨
handleEMapClick(result, index) {
if (this.curEMapModelIndex == index) return;
@@ -300,112 +207,14 @@
}
},
// 璺宠浆鍒颁笁缁�
- show3d() {
+ handleSMapClick(result, index) {
store.setLayerPanelShow(false);
this.$router.push("/viewer3D");
},
- // 涓夌淮妯″瀷閫夋嫨
- handleSMapClick(result, index) {
- // // 璁剧疆鐩告満
- // if (result.name == "3D鍩庡競") {
- // window.Viewer.scene.globe.maximumScreenSpaceError = 2;
- // this.changeLayerView(45000, true);
- // } else if (result.name == "涓夌淮妯″瀷") {
- // window.Viewer.scene.globe.maximumScreenSpaceError = 2;
- // this.changeLayerView(80000, true);
- // }
- // 鍒囨崲鍥惧眰
- this.show3d();
- const val = layers.filter((res) => {
- if (res.name == result.name) {
- return res;
- }
- });
- const children = val[0].children;
- if (this.curSMapModelIndex == index) {
- // clearLayerByTypeId(result.id);
- // this.curSMapModelIndex = -1;
- } else {
- // this.curEMapModelIndex = -1;
- // this.curSMapModelIndex = index;
- // clearLayerByTypeIdArr(["ewdt", "yxdt"]);
- // clearLayerByTypeIdArr(["3Dcs", "swmx"]);
- // _GLOBAL.layers[result.id] = [];
- // children.forEach((item) => {
- // let itemLayer = loadLayer(item);
- // _GLOBAL.layers[result.id].push(itemLayer);
- // console.log(_GLOBAL.layers[result.id]);
- // });
- }
- },
- // 涓撻鍥鹃�夋嫨
- handleAreaClick(result, index) {
- const val = layers.filter((res) => {
- if (res.name == result.name) {
- return res;
- }
- });
- const children = val[0].children;
- if (this.curAreaTypeIndex == index) {
- this.curAreaTypeIndex = -1;
- let _data = sgworld.ProjectTree.getObject(children[0].id);
- if (_data) {
- sgworld.ProjectTree.setVisibility(children[0].id, false);
- }
- // clearLayerByTypeIdArr(['GuiHuaFanWeiShiYiTu', 'XingZhengQuHuaTu', 'GuiHuaDanYuanHuaFenTu', 'ZhuYaoGongNengQuGuiHuaShiYiTu']);
- store.setThematicLayerItemId("");
- } else {
- this.curAreaTypeIndex = index;
- //娓呴櫎
- //clearLayerByTypeIdArr(['GuiHuaFanWeiShiYiTu', 'XingZhengQuHuaTu', 'GuiHuaDanYuanHuaFenTu', 'ZhuYaoGongNengQuGuiHuaShiYiTu']);
- let arr = [
- "GuiHuaFanWeiShiYiTu",
- "XingZhengQuHuaTu",
- "GuiHuaDanYuanHuaFenTu",
- "ZhuYaoGongNengQuGuiHuaShiYiTu",
- ];
- arr.forEach((item) => {
- sgworld.ProjectTree.getObject(item) &&
- sgworld.ProjectTree.setVisibility(item, false);
- });
- let dataObj = sgworld.ProjectTree.getObject(result.id);
- if (dataObj) {
- sgworld.ProjectTree.setVisibility(result.id, true);
- } else {
- _GLOBAL.layers[result.id] = [];
- children.forEach((item) => {
- let itemLayer = loadLayer(item);
- _GLOBAL.layers[result.id].push(itemLayer);
- console.log(_GLOBAL.layers[result.id]);
- });
- }
- store.setThematicLayerItemId(result.id);
- }
- },
- // 绐ㄤ簳鍔犺浇
- handleYJClick(index) {
- if (this.curYjIndex == index) {
- this.curYjIndex = -1;
- window.clusterLayer && window.clusterLayer.clear();
- } else {
- this.curYjIndex = index;
- switch (index) {
- case 0:
- loadManhole();
- break;
- case 1:
- loadCamera();
- break;
- case 2:
- loadEnterprise();
- break;
- }
- }
- },
- // 绗簩琛� 涓撻鍥� 鐐瑰嚮
+ // 鐐逛綅鍥� 鐐瑰嚮
handleZTlick(result, index) {
- // console.log(result, index);
- const val = layers.filter((res) => {
+ console.log(result, index);
+ const val = layers.filter(res => {
if (res.name == result.name) {
return res;
}
@@ -420,7 +229,7 @@
store.setThematicLayerItemId(children);
}
},
- // 绗笁琛� 涓撻鍔熻兘 鐐瑰嚮
+ // 鍔熻兘椤� 鐐瑰嚮
handleFuncClick(index) {
if (this.curFuncIndex == index) {
store.setTdglFlag(false);
@@ -456,15 +265,16 @@
window.tdgllayer = new ol.layer.Tile({
source: new ol.source.TileWMS({
ratio: 3,
- url: "https://skyzt.bda.gov.cn/gisserver/wmsserver/chengshiguihua_dikuaibianhao",
+ url:
+ "https://skyzt.bda.gov.cn/gisserver/wmsserver/chengshiguihua_dikuaibianhao",
params: {
VERSION: "1.1.1",
SRS: "EPSG:3857",
FORMAT: "image/png",
TILED: true,
- LAYERS: "",
- },
- }),
+ LAYERS: ""
+ }
+ })
});
// window.tdgllayer = new ol.layer.Tile({
@@ -508,55 +318,35 @@
},
showLayerTree() {
store.setLayerTreeShow(true);
- },
+ }
},
- watch: {
- "state.itemId": {
- handler: function (newVal, oldVal) {
- let that = this;
- if (newVal == "") {
- this.curAreaTypeIndex = -1;
- } else {
- let index = -1;
- if (newVal == "GuiHuaFanWeiShiYiTu") {
- index = 0;
- } else if (newVal == "XingZhengQuHuaTu") {
- index = 1;
- } else if (newVal == "GuiHuaDanYuanHuaFenTu") {
- index = 2;
- } else if (newVal == "ZhuYaoGongNengQuGuiHuaShiYiTu") {
- index = 3;
- }
- this.curAreaTypeIndex = index;
- }
- },
- },
- // 鍩虹鍥惧眰
- "basicMapChecked.val": {
- handler: function (newVal, oldVal) {
- if (newVal == "涓夌淮妯″瀷") {
- debugger;
- this.handleSMapClick(
- {
- id: "swmx",
- name: "涓夌淮妯″瀷",
- active: false,
- type: "san",
- src: require("@/assets/img/layer/swmx.png"),
- },
- 1
- );
- }
- },
- immediate: true, //鍒锋柊鍔犺浇 绔嬮┈瑙﹀彂涓�娆andler
- deep: true, // 鍙互娣卞害妫�娴嬪埌 obj 瀵硅薄鐨勫睘鎬у�肩殑鍙樺寲
- },
- },
+ // watch: {
+ // // 鍩虹鍥惧眰
+ // "basicMapChecked.val": {
+ // handler: function(newVal, oldVal) {
+ // if (newVal == "涓夌淮妯″瀷") {
+ // debugger;
+ // this.handleSMapClick(
+ // {
+ // id: "swmx",
+ // name: "涓夌淮妯″瀷",
+ // active: false,
+ // type: "san",
+ // src: require("@/assets/img/layer/swmx.png")
+ // },
+ // 1
+ // );
+ // }
+ // },
+ // immediate: true, //鍒锋柊鍔犺浇 绔嬮┈瑙﹀彂涓�娆andler
+ // deep: true // 鍙互娣卞害妫�娴嬪埌 obj 瀵硅薄鐨勫睘鎬у�肩殑鍙樺寲
+ // }
+ // },
computed: {
alpha() {
return store.tdglInfo.alpha;
- },
- },
+ }
+ }
};
</script>
diff --git a/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue b/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
index 0d2eb1b..b9fe4c5 100644
--- a/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
+++ b/src/components/sideMenu/layerTreePanel/layerTreePanel2.vue
@@ -2694,7 +2694,6 @@
watch: {
"state.itemId": {
handler: function (newVal, oldVal) {
- console.log("state.itemId");
if (oldVal != "") {
oldVal.forEach((item) => {
this.setVisiable(item, false);
diff --git a/src/components/viewer-bak.vue b/src/components/viewer-bak.vue
new file mode 100644
index 0000000..277feaa
--- /dev/null
+++ b/src/components/viewer-bak.vue
@@ -0,0 +1,435 @@
+<template>
+ <div class="panel">
+ <!-- 鐞� -->
+ <div id="sdkContainer" @click="clicktoclose"></div>
+
+ <!-- 椤甸潰鏍囬 -->
+ <div class="titleBg">
+ <img src="@/assets/img/title/title.png" />
+ </div>
+ <!-- 鍘嗗彶褰卞儚 -->
+ <my-history v-if="state.show"></my-history>
+ <!-- 鍘嗗彶褰卞儚鍏抽棴鎸夐挳 -->
+ <div class="colseBtn" v-if="state.show" @click="closeHistory(false)">
+ <img class="searchBtn" src="@/assets/closeinput1.png" />
+ </div>
+ <!-- 鍙充晶瀵艰埅妗� -->
+ <my-navigation-bar></my-navigation-bar>
+ <!-- 鎼滅储妗� -->
+ <my-sousuo v-if="!state.show" v-show="childrendata.ssval"></my-sousuo>
+ <!-- 鍙充笂蹇嵎鍖哄煙锛堝伐绋嬫爲銆佺┖闂村垎鏋愶級 -->
+ <!-- <div class="right-top">
+ <my-layertree :rightshowzy="childrendata"></my-layertree>
+ </div> -->
+ <!-- 鍘熷乏涓嬭彍鍗� -->
+ <!-- <my-menu v-on:getshowsta="datafromchild" ref="menu"></my-menu> -->
+ <!-- 宸︿笅蹇嵎鍖哄煙锛堝浣嶃�佹寚鍖楃瓑锛� -->
+ <my-left-bottom :test="childrendata"></my-left-bottom>
+ <!-- 鍙充笅蹇嵎鍖哄煙锛堟斁澶х缉灏忥級 -->
+ <my-right-bottom :test="childrendata"></my-right-bottom>
+
+ <!-- 鍚勭闈㈡澘 -->
+ <!-- 璁剧疆闈㈡澘 -->
+ <my-setting-panel></my-setting-panel>
+ <!-- 浣嶇疆闈㈡澘 -->
+ <my-collection-panel></my-collection-panel>
+ <!-- 鎸囧寳閽堥潰鏉� -->
+ <my-direction-panel></my-direction-panel>
+ <!-- 鏂板鏀惰棌闈㈡澘 -->
+ <my-add-collection-panel></my-add-collection-panel>
+ <!-- 绐ㄤ簳銆佹憚鍍忓ご缁熻闈㈡澘 -->
+ <my-statistics-panel></my-statistics-panel>
+ <!-- 绐ㄤ簳缁熻鍒嗘瀽闈㈡澘 -->
+ <my-manhole-panel></my-manhole-panel>
+ <!-- 鎽勫儚澶寸粺璁″垎鏋愰潰鏉� -->
+ <my-video-panel></my-video-panel>
+ <!-- 鍥惧眰闈㈡澘 -->
+ <my-layer-panel></my-layer-panel>
+ <!-- 婕父闈㈡澘 -->
+ <my-roam-panel></my-roam-panel>
+ <!-- 鍥惧眰鏍戦潰鏉� -->
+ <my-layer-tree-panel></my-layer-tree-panel>
+ <!-- 鍦熷湴绠＄悊寮圭獥 -->
+ <my-land-admin-info></my-land-admin-info>
+ <my-slider></my-slider>
+ </div>
+</template>
+<script>
+import store from "@/utils/store.js";
+
+import _GLOBAL from "@/assets/GLOBAL";
+import { leftClick, loadLayer } from "@/utils/map.js";
+import leftBottom from "@/components/leftMenu/bottom.vue";
+import rightBottom from "@/components/rightMenu/bottom.vue";
+import sousuo from "@/components/leftMenu/sousuo.vue";
+import menu from "@/components/menu/menu.vue";
+import NavigationBar from "./rightNavigation/NavigationBar.vue";
+import layertree from "@/components/rightMenu/layerTree.vue";
+import settingPanel from "./sideMenu/settingMenu/main.vue";
+import collectionPanel from "./sideMenu/collectionMenu/main.vue";
+import directionPanel from "./sideMenu/directionMenu/main.vue";
+import addCollectionPanel from "./sideMenu/addCollectionMenu/main.vue";
+import statisticsPanel from "./sideMenu/statisticsMenu/main.vue";
+import manholePanel from "./sideMenu/manholeStatistics/main.vue";
+import videoPanel from "./sideMenu/videoStatistics/main.vue";
+import layerPanel from "./sideMenu/layerMenu/main.vue";
+import roamPanel from "./sideMenu/roamPanel/main.vue";
+import layerTreePanel from "./sideMenu/layerTreePanel/main.vue";
+import history from "./poplayer/history.vue";
+import landAdminInfo from "./poplayer/landAdmin.vue";
+import sliderAlpha from "./sideMenu/sliderAlpha/main.vue";
+import Axios from "axios";
+
+export default {
+ name: "viewer",
+ components: {
+ "my-sousuo": sousuo,
+ "my-left-bottom": leftBottom,
+ "my-right-bottom": rightBottom,
+ "my-menu": menu,
+ "my-layertree": layertree,
+ "my-navigation-bar": NavigationBar,
+ "my-setting-panel": settingPanel,
+ "my-collection-panel": collectionPanel,
+ "my-direction-panel": directionPanel,
+ "my-add-collection-panel": addCollectionPanel,
+ "my-statistics-panel": statisticsPanel,
+ "my-manhole-panel": manholePanel,
+ "my-video-panel": videoPanel,
+ "my-layer-panel": layerPanel,
+ "my-roam-panel": roamPanel,
+ "my-layer-tree-panel": layerTreePanel,
+ "my-history": history,
+ "my-land-admin-info": landAdminInfo,
+ "my-slider": sliderAlpha,
+ },
+ data() {
+ return {
+ date: "",
+ parentItem: {},
+ childrendata: {
+ fwval: true,
+ zbzval: false,
+ qpval: false,
+ zymlval: false,
+ zymlmenu: false,
+ kjcxval: false,
+ dxmsval: false,
+ snmsval: false,
+ ssval: true,
+ zoomval: true,
+ },
+ timer: null,
+ count: 0,
+ state: store.history,
+ };
+ },
+ created() {},
+ mounted() {
+ this.$nextTick(function () {
+ let that = this;
+ let option = {
+ // licenseServer: "http://183.162.245.49:18080",
+ // StaticFileBaseUrl: "../../Mobile/static/CimSDK/",
+ url: "./static/img/cesium/earth.jpg",
+ toolbar: false,
+ // fullscreenButton: true,
+ navigationOption: {
+ enableCompass: false,
+ enableZoomControls: false,
+ enableDistanceLegend: false,
+ enableCompassOuterRing: false,
+ },
+ };
+
+ //EPSG4326
+ // Cesium.ExpandBySmartEarth.Ellipsoid.z = 6356752.3142451793;
+
+ window.sgworld = new SmartEarth.SGWorld(
+ "sdkContainer",
+ // Cesium,
+ option,
+ // null,
+ function () {
+ sgworld.Navigate.jumpTo({
+ //璺宠浆瑙嗚
+ destination: Cesium.Cartesian3.fromDegrees(
+ 116.52217697339846,
+ 39.75979421847914,
+ 17045.47005612415
+ ),
+ // orientation: {
+ // heading: Cesium.Math.toRadians(0),
+ // pitch: Cesium.Math.toRadians(0),
+ // roll: Cesium.Math.toRadians(0),
+ // },
+ });
+ }
+ );
+ window.Viewer = sgworld._Viewer;
+ Viewer.shadows = false;
+ Viewer.scene.fxaa = false;
+ Viewer.scene.postProcessStages.fxaa.enabled = false;
+ window.Viewer.scene.globe.maximumScreenSpaceError = 4 / 3;
+ that.showBottom();
+ window.Viewer.scene.screenSpaceCameraController.minimumZoomDistance = 100; //鐩告満鐨勯珮搴︾殑鏈�灏忓��
+ // window.Viewer.scene.screenSpaceCameraController.maximumZoomDistance = 38000; //鐩告満楂樺害鐨勬渶澶у��
+ //鍔犺浇褰卞儚
+ // let dtLayer = loadLayer({
+ // id: "C0698021",
+ // sourceType: "arcgis",
+ // name: "鑸媿褰卞儚",
+ // urls: "https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer",
+ // });
+ // _GLOBAL.layers["yxdt"] = [];
+ // _GLOBAL.layers["yxdt"].push(dtLayer);
+
+ window.clusterLayer = new SmartEarth.ClusterLayer(Viewer, {
+ style: "clustering",
+ // size: 18,
+ // fontSize: 12,
+ // fontColor: "rgb(0,0,0)",
+ // pixelRange: 10,
+ });
+
+ window.sgwfs = new SmartEarth.WFSTool(sgworld._Viewer);
+
+ leftClick();
+ // this.getQYInfo();
+ //fps
+ // Viewer.scene.debugShowFramesPerSecond = true;
+ //娣卞害妫�娴�
+ // sgworld.Analysis.depthTestAgainstTerrain(true);
+
+ // sgworld.Creator.SimpleGraphic.edit(true, {
+ // editProp: true,
+ // editPropData: {
+ // width: "100%",
+ // offset: "b",
+ // shade: 0.3,
+ // success: function (lay, index) {
+ // lay.css({
+ // "border-radius": "13px 13px 0px 0px",
+ // });
+ // lay.find(".layui-layer-title").css({
+ // "background-color": "#fff",
+ // border: "none",
+ // "font-size": "19px",
+ // "font-weight": "bold",
+ // });
+ // },
+ // },
+ // });
+ // sgworld.Creator.SimpleGraphic.setEdit(false);
+ window.layerOpen = function (name, options) {
+ layuiLayer.close(SmartEarthPopupData.layerProp);
+
+ var width = options.width;
+ var height = options.height;
+ var offset = options.offset;
+ var fn = options.fn || {};
+
+ //鑾峰彇鐩稿叧鍥炶皟浜嬩欢
+ var cancelFn = null;
+ var successFn = null;
+ var endFn = null;
+ for (var key in fn) {
+ cancelFn = key == "cancel" ? fn[key] : cancelFn;
+ successFn = key == "success" ? fn[key] : successFn;
+ endFn = key == "end" ? fn[key] : endFn;
+ }
+
+ SmartEarthPopupData.layerProp = layuiLayer.open({
+ title: name,
+ skin: "title-class",
+ // title:false,
+ type: 2, //0锛堜俊鎭锛岄粯璁わ級1锛堥〉闈㈠眰锛�2锛坕frame灞傦級3锛堝姞杞藉眰锛�4锛坱ips灞傦級
+ // shade: options.shade !== undefined ? options.shade : 0.3,
+ shade: 0,
+ shadeClose: false,
+ closeBtn: 1,
+ resize: false,
+ offset: offset,
+ area: [
+ typeof width === "number" ? width + "px" : width,
+ // "100%",
+ typeof height === "number" ? height + "px" : height,
+ ],
+ content: options.url,
+ success: function (layero, index) {
+ if (successFn && typeof successFn === "function") {
+ successFn(layero, index);
+ }
+ },
+ cancel: function () {
+ if (cancelFn && typeof cancelFn === "function") {
+ cancelFn();
+ }
+ },
+ end: function () {
+ if (endFn && typeof endFn === "function") {
+ endFn();
+ }
+ },
+ });
+ };
+
+ window._layerOpen = function (name, options) {
+ layuiLayer.close(SmartEarthPopupData._layerProp);
+
+ var width = options.width;
+ var height = options.height;
+ var fn = options.fn || {};
+
+ //鑾峰彇鐩稿叧鍥炶皟浜嬩欢
+ var cancelFn = null;
+ var successFn = null;
+ var endFn = null;
+ for (var key in fn) {
+ cancelFn = key == "cancel" ? fn[key] : cancelFn;
+ successFn = key == "success" ? fn[key] : successFn;
+ endFn = key == "end" ? fn[key] : endFn;
+ }
+
+ SmartEarthPopupData._layerProp = layuiLayer.open({
+ title: name,
+ type: 2, //0锛堜俊鎭锛岄粯璁わ級1锛堥〉闈㈠眰锛�2锛坕frame灞傦級3锛堝姞杞藉眰锛�4锛坱ips灞傦級
+ shade: options.shade !== undefined ? options.shade : 0.3,
+ shadeClose: true,
+ resize: false,
+ offset: "b",
+ area: [
+ // typeof width === "number" ? width + "px" : width,
+ "100%",
+ typeof height === "number" ? height + "px" : height,
+ ],
+ content: options.url,
+ success: function (layero, index) {
+ if (successFn && typeof successFn === "function") {
+ successFn(layero, index);
+ }
+ },
+ cancel: function () {
+ if (cancelFn && typeof cancelFn === "function") {
+ cancelFn();
+ }
+ },
+ end: function () {
+ if (endFn && typeof endFn === "function") {
+ endFn();
+ }
+ },
+ });
+ };
+ });
+ },
+ methods: {
+ clicktoclose() {
+ clearTimeout(this.timer);
+ this.timer = setTimeout(() => {
+ this.count++;
+ if (this.count == 2) {
+ // console.log("鍗曞嚮浜嬩欢");
+ // 鍏抽棴鎵�鏈夊脊绐�
+ //this.$refs.menu.closeall();
+ // 娓呴櫎瀹氫綅涓殑浣嶇疆鏍囪
+ //this.$refs.menu.clearFlyPoint();
+ } else {
+ // 鎵ц鏀惧ぇ鎿嶄綔
+ // console.log("鍙屽嚮");
+ // Viewer.camera.zoomIn();
+ // console.log(window.clickPOI);
+ let p = sgworld.Navigate.getDegrees();
+ // console.log(p);
+ Viewer.camera.flyTo({
+ destination: Cesium.Cartesian3.fromDegrees(
+ window.clickPOI.lon,
+ window.clickPOI.lat,
+ p.height / 1.8
+ ),
+ duration: 1.0,
+ });
+ }
+ this.count = 0;
+ }, 300);
+ this.count++;
+ },
+ datafromchild(data) {
+ for (var i in data) {
+ this.childrendata[i] = data[i];
+ }
+ },
+ closeHistory(val) {
+ store.setHistoryShow(val);
+ },
+ showBottom() {
+ let handler3D = new Cesium.ScreenSpaceEventHandler(Viewer.scene.canvas);
+ handler3D.setInputAction((wheelment) => {
+ // 婊氬姩婊氳酱锛屽緱鍒板綋鍓嶇殑瑙嗙偣楂樺害
+ // 鍗曚綅鎹㈢畻锛屽綋澶т簬1000绫崇殑鏃跺�欐樉绀衡�滃崈绫斥�濓紝灏忎簬1000绫崇殑鏃跺�欐樉绀哄崟浣嶄负鈥滅背鈥�
+ var cHeightM = Viewer.camera.positionCartographic.height;
+ var cHeightKm = (cHeightM / 1000).toFixed(0);
+ // 褰揷Height鐨勫�兼敼鍙樻椂锛岃祴鍊肩粰window涓殑sdHeight
+ window.sdHeight = this.cHeight;
+
+ //褰撴粦鍔ㄧ殑璺濈灏忎簬2km锛屽彇娑堣仛鍚�
+ // if (window.dataClustering && window.dataClustering.enabled) {
+ if (parseFloat(cHeightKm) < 2) {
+ window.dataClustering && (window.dataClustering.enabled = false);
+ } else {
+ window.dataClustering && (window.dataClustering.enabled = true);
+ }
+ }, Cesium.ScreenSpaceEventType.WHEEL);
+ },
+ getQYInfo() {
+ console.log(window.gisBaseUrl);
+ Axios.get(
+ window.gisBaseUrl +
+ "/gisserver/wfsserver/qiyelianqiye?version=1.3.0&request=GetFeature&format=json&typename=浼佷笟閾句紒涓�"
+ ).then((res) => {
+ console.log(res);
+ });
+ },
+ },
+};
+</script>
+<style scoped>
+.panel,
+#sdkContainer {
+ width: 100%;
+ height: 100%;
+ background: black;
+ position: absolute !important;
+}
+
+.titleBg {
+ position: absolute;
+ left: 0rem;
+ top: 0rem;
+ width: 100%;
+ height: 0.43rem;
+ background-color: #127eff;
+ text-align: center;
+ /* background-image: url("~@/assets/img/title/u2.png") !important;
+ background-repeat: no-repeat;
+ background-size: 100% 100% !important; */
+}
+
+.titleBg img {
+ width: 207px;
+ margin-top: 5px;
+}
+
+.bottomLeft {
+ display: none;
+}
+.colseBtn {
+ position: absolute;
+ z-index: 2;
+ top: 0.55rem;
+ left: 0.2rem;
+}
+.colseBtn img {
+ width: 30px;
+}
+</style>
diff --git a/src/components/viewer.vue b/src/components/viewer.vue
index 4050d89..005181e 100644
--- a/src/components/viewer.vue
+++ b/src/components/viewer.vue
@@ -132,7 +132,6 @@
this.$nextTick(function () {
let that = this;
let option = {
- // licenseServer: "http://183.162.245.49:18080",
// StaticFileBaseUrl: "../../Mobile/static/CimSDK/",
url: "./static/img/cesium/earth.jpg",
toolbar: false,
@@ -145,8 +144,6 @@
},
};
- //EPSG4326
- // Cesium.ExpandBySmartEarth.Ellipsoid.z = 6356752.3142451793;
window.sgworld = new SmartEarth.SGWorld(
"sdkContainer",
diff --git a/src/components/viewer2d.vue b/src/components/viewer2d.vue
new file mode 100644
index 0000000..4ad4fd4
--- /dev/null
+++ b/src/components/viewer2d.vue
@@ -0,0 +1,284 @@
+<template>
+ <div class="panel">
+ <div id="openlayerContainer"></div>
+ </div>
+</template>
+<script>
+import store from "@/utils/store2.js";
+import { setClick, leftClick, touchClick } from "@/utils/map2.js";
+import _GLOBAL from "@/assets/GLOBAL2";
+// import { leftClick, loadLayer } from "@/utils/map.js";
+import {
+ addHxLayer,
+ addYzLayer,
+ loadGeoMap,
+ listenDirection,
+ getCurrentPosition,
+} from "@/utils/tool";
+
+export default {
+ name: "viewer2",
+ components: {
+
+ },
+ data() {
+ return {
+ date: "",
+ parentItem: {},
+ childrendata: {
+ fwval: true,
+ zbzval: false,
+ qpval: false,
+ zymlval: false,
+ zymlmenu: false,
+ kjcxval: false,
+ dxmsval: false,
+ snmsval: false,
+ ssval: true,
+ zoomval: true,
+ },
+ timer: null,
+ count: 0,
+ state: store.history,
+ };
+ },
+ created() {},
+ mounted() {
+ this.$nextTick(function () {
+ ol.Map.prototype.getLayerByName = function (name) {
+ var layer;
+ this.getLayers().array_.forEach(function (lyr) {
+ if (name == lyr.values_.name) {
+ layer = lyr;
+ }
+ });
+ return layer;
+ };
+
+ const layers = [];
+
+ const TDTKey = "f234b950740b8c2e0d9959a51c169d21";
+ const tiandituUrl = "http://t0.tianditu.gov.cn";
+ let options = { proj: "EPSG:3857", layer: "img", matrixSets: "c" };
+ let _proj = options.proj;
+ let _layer = options.layer;
+ let _key = TDTKey;
+ let _matrixSets = options.matrixSets;
+
+ let projection = ol.proj.get(_proj);
+ let projectionExtent = projection.getExtent();
+ let origin = projectionExtent
+ ? ol.extent.getTopLeft(projectionExtent)
+ : [-180, 90];
+ let fromLonLat = ol.proj.getTransform("EPSG:3857", projection);
+ let width = projectionExtent
+ ? ol.extent.getWidth(projectionExtent)
+ : ol.extent.getWidth(
+ ol.extent.applyTransform([-180.0, -90.0, 180.0, 90.0], fromLonLat)
+ );
+
+ let resolutions = [];
+ let matrixIds = [];
+ for (let z = 1; z < 19; z++) {
+ resolutions[z] = width / (256 * Math.pow(2, z));
+ matrixIds[z] = z;
+ }
+ let wmtsTileGrid = new ol.tilegrid.WMTS({
+ origin: origin,
+ resolutions: resolutions,
+ matrixIds: matrixIds,
+ });
+ console.log(
+ "url:",
+ `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`
+ );
+ let wmtsSource = new ol.source.WMTS({
+ url: `${tiandituUrl}/${_layer}_${_matrixSets}/wmts?tk=${_key}`,
+ layer: _layer,
+ version: "1.0.0",
+ matrixSet: _matrixSets,
+ format: "tiles",
+ projection: projection,
+ requestEncoding: "KVP",
+ style: "default",
+ tileGrid: wmtsTileGrid,
+ });
+ let wmtsLayer = new ol.layer.Tile({
+ name: "褰卞儚鍦板浘",
+ id: _layer + "_" + _matrixSets,
+ source: wmtsSource,
+ });
+
+ let wmtsSource1 = new ol.source.WMTS({
+ url: `${tiandituUrl}/cia_${_matrixSets}/wmts?tk=${_key}`,
+ layer: "cia",
+ version: "1.0.0",
+ matrixSet: _matrixSets,
+ format: "tiles",
+ projection: projection,
+ requestEncoding: "KVP",
+ style: "default",
+ tileGrid: wmtsTileGrid,
+ });
+ let wmtsLayer1 = new ol.layer.Tile({
+ name: "璺綉鍥惧眰",
+ id: "cia_c",
+ source: wmtsSource1,
+ });
+
+ let wmtsSource2 = new ol.source.WMTS({
+ url: `${tiandituUrl}/vec_c/wmts?tk=${_key}`,
+ layer: "vec",
+ version: "1.0.0",
+ matrixSet: _matrixSets,
+ format: "tiles",
+ projection: projection,
+ requestEncoding: "KVP",
+ style: "default",
+ tileGrid: wmtsTileGrid,
+ });
+ let wmtsLayer2 = new ol.layer.Tile({
+ name: "浜岀淮鍦板浘",
+ id: "cva_c",
+ source: wmtsSource2,
+ });
+ // wmtsLayer2.setVisible(false);
+ ////浜岀淮鍦板浘
+ // layers.push(wmtsLayer2);
+ ////鍗槦褰卞儚
+ // layers.push(wmtsLayer);
+ ////璺綉
+ // layers.push(wmtsLayer1);
+
+ const map = new ol.Map({
+ layers: layers,
+ target: "openlayerContainer",
+ view: new ol.View({
+ center: ol.proj.fromLonLat([116.505348, 39.795592]),
+ projection: "EPSG:3857",
+ zoom: 11.5,
+ minZoom: 7,
+ maxZoom: 19.5,
+ enableRotation: false,
+ // constrainResolution: true,
+ smoothResolutionConstraint: false,
+ }),
+ });
+
+ window.mapapi = map;
+ window.layersArray = window.mapapi.getLayers();
+ // addImageLayer();
+ // addAnnotationLayer();
+ window.mapapi.getView().setZoom(14);
+ loadGeoMap();
+ // loadBaseMap();
+ addHxLayer();
+ addYzLayer();
+
+ setClick(true);
+ touchClick();
+
+ getCurrentPosition();
+ listenDirection();
+ // leftClick()
+
+ window.layerOpen = function (name, options) {
+ layuiLayer.close(SmartEarthPopupData.layerProp);
+
+ var width = options.width;
+ var height = options.height;
+ var offset = options.offset;
+ var fn = options.fn || {};
+
+ //鑾峰彇鐩稿叧鍥炶皟浜嬩欢
+ var cancelFn = null;
+ var successFn = null;
+ var endFn = null;
+ for (var key in fn) {
+ cancelFn = key == "cancel" ? fn[key] : cancelFn;
+ successFn = key == "success" ? fn[key] : successFn;
+ endFn = key == "end" ? fn[key] : endFn;
+ }
+
+ SmartEarthPopupData.layerProp = layuiLayer.open({
+ title: name,
+ skin: "title-class",
+ // title:false,
+ type: 2, //0锛堜俊鎭锛岄粯璁わ級1锛堥〉闈㈠眰锛�2锛坕frame灞傦級3锛堝姞杞藉眰锛�4锛坱ips灞傦級
+ // shade: options.shade !== undefined ? options.shade : 0.3,
+ shade: 0,
+ shadeClose: false,
+ closeBtn: 1,
+ resize: false,
+ offset: offset,
+ area: [
+ typeof width === "number" ? width + "px" : width,
+ // "100%",
+ typeof height === "number" ? height + "px" : height,
+ ],
+ content: options.url,
+ success: function (layero, index) {
+ if (successFn && typeof successFn === "function") {
+ successFn(layero, index);
+ }
+ },
+ cancel: function () {
+ if (cancelFn && typeof cancelFn === "function") {
+ cancelFn();
+ }
+ },
+ end: function () {
+ if (endFn && typeof endFn === "function") {
+ endFn();
+ }
+ },
+ });
+ };
+ });
+ },
+ methods: {},
+};
+</script>
+<style scoped>
+.panel,
+#openlayerContainer {
+ width: 100%;
+ height: 100%;
+ background: black;
+ /* position: absolute !important; */
+ z-index: 0;
+}
+
+.titleBg {
+ position: absolute;
+ left: 0rem;
+ top: 0rem;
+ width: 100%;
+ height: 0.43rem;
+ background-color: #127eff;
+ text-align: center;
+ /* background-image: url("~@/assets/img/title/u2.png") !important;
+ background-repeat: no-repeat;
+ background-size: 100% 100% !important; */
+}
+
+.titleBg img {
+ width: 207px;
+ margin-top: 5px;
+}
+
+.bottomLeft {
+ display: none;
+}
+
+.colseBtn {
+ position: absolute;
+ z-index: 2;
+ top: 0.55rem;
+ left: 0.2rem;
+}
+
+.colseBtn img {
+ width: 30px;
+}
+</style>
diff --git a/src/router/index.js b/src/router/index.js
index 5c48b4a..da72c34 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -11,8 +11,9 @@
const routes = [
{
path: '/',
- redirect: "home",
// redirect: "index",
+ // redirect: "home",
+ redirect: "login",
},
{
path: '/login',
--
Gitblit v1.9.3