From ab8f3297f7c8243d486c9da0900e4f813b2ea2df Mon Sep 17 00:00:00 2001
From: suerprisePlus <15810472099@163.com>
Date: 星期三, 27 十一月 2024 17:16:46 +0800
Subject: [PATCH] 功能更新
---
src/assets/logo/Login3.png | 0
src/views/visualization/bottomMenu.vue | 2
vue.config.js | 2
public/imgs/向上.png | 0
.env.staging | 2
src/components/RuoYi/Msgger/index.vue | 2
src/views/visualization/msgList.js | 116 ++++++++
src/layout/components/Sidebar/Logo.vue | 4
public/config/config.js | 2
src/assets/logo/Login3_1.png | 0
src/views/visualization/mapView.vue | 9
src/store/modules/mapLayers.js | 18
src/views/visualization/msgListInfo.vue | 141 ++++++++++
src/views/login copy.vue | 4
public/index.html | 2
src/assets/js/mapSdk/mapData.js | 8
.vscode/settings.json | 3
public/imgs/向右.png | 0
src/views/visualization/msgList.vue | 97 ++----
public/imgs/thunder2.png | 0
src/views/visualization/list/chart1.vue | 12
.env.development | 2
src/views/login.vue | 6
src/views/visualization/list/mapWeather.js | 236 ++++++++++++++--
public/imgs/filre.png | 0
.env.production | 2
src/assets/js/mapSdk/menuManager.js | 3
src/views/visualization/index.vue | 113 +++++++
src/views/visualization/list/chart.vue | 10
src/views/visualization/list/chart2.vue | 10
30 files changed, 657 insertions(+), 149 deletions(-)
diff --git a/.env.development b/.env.development
index ffb5e2a..c5dbfac 100644
--- a/.env.development
+++ b/.env.development
@@ -1,5 +1,5 @@
# 椤甸潰鏍囬
-VUE_APP_TITLE = 灞辫タ閰嶇綉
+VUE_APP_TITLE = 涓�浣撳寲鎸囨尌鎸囨尌鑸�
# 寮�鍙戠幆澧冮厤缃�
ENV = 'development'
diff --git a/.env.production b/.env.production
index 2364eea..49e70cd 100644
--- a/.env.production
+++ b/.env.production
@@ -1,5 +1,5 @@
# 椤甸潰鏍囬
-VUE_APP_TITLE = 灞辫タ閰嶇綉
+VUE_APP_TITLE = 涓�浣撳寲鎸囨尌鎸囨尌鑸�
# 鐢熶骇鐜閰嶇疆
ENV = 'production'
diff --git a/.env.staging b/.env.staging
index 0d879bb..2fbb449 100644
--- a/.env.staging
+++ b/.env.staging
@@ -1,5 +1,5 @@
# 椤甸潰鏍囬
-VUE_APP_TITLE = 灞辫タ閰嶇綉
+VUE_APP_TITLE = 涓�浣撳寲鏅烘収鎸囨尌鑸�
NODE_ENV = production
diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..28a51d5
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+ "compile-hero.disable-compile-files-on-did-save-code": false
+}
\ No newline at end of file
diff --git a/public/config/config.js b/public/config/config.js
index 449c469..c076d31 100644
--- a/public/config/config.js
+++ b/public/config/config.js
@@ -20,6 +20,7 @@
const pwythHost = "http://localhost/pwyth";
//閰嶇疆
const config = {
+
images: host + "/imgs/",
// server鏈嶅姟
apiServices: "http://" + apiHost + "/server/",
@@ -59,5 +60,6 @@
url: pwythHost + "/modles/TY/tileset.json",
cnName:"baseModel",
id:"baseModel",
+ flag:false,
},
};
diff --git a/public/imgs/filre.png b/public/imgs/filre.png
new file mode 100644
index 0000000..c6da601
--- /dev/null
+++ b/public/imgs/filre.png
Binary files differ
diff --git a/public/imgs/thunder2.png b/public/imgs/thunder2.png
new file mode 100644
index 0000000..a1de6c9
--- /dev/null
+++ b/public/imgs/thunder2.png
Binary files differ
diff --git "a/public/imgs/\345\220\221\344\270\212.png" "b/public/imgs/\345\220\221\344\270\212.png"
new file mode 100644
index 0000000..660f7fc
--- /dev/null
+++ "b/public/imgs/\345\220\221\344\270\212.png"
Binary files differ
diff --git "a/public/imgs/\345\220\221\345\217\263.png" "b/public/imgs/\345\220\221\345\217\263.png"
new file mode 100644
index 0000000..f51c195
--- /dev/null
+++ "b/public/imgs/\345\220\221\345\217\263.png"
Binary files differ
diff --git a/public/index.html b/public/index.html
index 857561f..00892b6 100644
--- a/public/index.html
+++ b/public/index.html
@@ -13,7 +13,7 @@
<script src="./CimSDK/CimSDK.min.js"></script>
<link rel="stylesheet" href="./CimSDK/Workers/layui/css/layui.css">
<link rel="stylesheet" href="./CimSDK/CimSDK.min.css">
-
+
<title>
<%= webpackConfig.name %>
</title>
diff --git a/src/assets/js/mapSdk/mapData.js b/src/assets/js/mapSdk/mapData.js
index cc7c69d..6e935e3 100644
--- a/src/assets/js/mapSdk/mapData.js
+++ b/src/assets/js/mapSdk/mapData.js
@@ -4,7 +4,7 @@
menuData: [
{
id: 's1',
- name: '閰嶇綉宸℃',
+ name: '宸℃',
children: [
{
id: 'a1',
@@ -15,7 +15,7 @@
},
{
id: 's2',
- name: '閰嶇綉杩愭',
+ name: '杩愭',
children: [
{
id: 'a1',
@@ -252,8 +252,8 @@
dataOption: [
{ value: '鏉嗗', label: '鏉嗗' },
{
- value: '閰嶇綉绠�',
- label: '閰嶇綉绠�',
+ value: '绠�',
+ label: '绠�',
},
{
value: '鐜綉鏌�',
diff --git a/src/assets/js/mapSdk/menuManager.js b/src/assets/js/mapSdk/menuManager.js
index b22d7e6..aa66c21 100644
--- a/src/assets/js/mapSdk/menuManager.js
+++ b/src/assets/js/mapSdk/menuManager.js
@@ -298,6 +298,9 @@
}
return std;
},
+ getCartesianCoord(longitude, latitude, height) {
+ return Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
+ },
// 娴嬮噺
setMenuS8(res) {
const colorAll = this.colorAll;
diff --git a/src/assets/logo/Login3.png b/src/assets/logo/Login3.png
index c61fb87..2356232 100644
--- a/src/assets/logo/Login3.png
+++ b/src/assets/logo/Login3.png
Binary files differ
diff --git a/src/assets/logo/Login3_1.png b/src/assets/logo/Login3_1.png
new file mode 100644
index 0000000..c61fb87
--- /dev/null
+++ b/src/assets/logo/Login3_1.png
Binary files differ
diff --git a/src/components/RuoYi/Msgger/index.vue b/src/components/RuoYi/Msgger/index.vue
index 49d8891..614994f 100644
--- a/src/components/RuoYi/Msgger/index.vue
+++ b/src/components/RuoYi/Msgger/index.vue
@@ -14,7 +14,7 @@
<el-table-column label="鎿嶄綔" width="100">
<template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text" size="small">鏌ョ湅</el-button>
- <el-button @click="handleClick2(scope.row)" type="text" size="small">鍒嗗彂</el-button></el-button>
+ <el-button @click="handleClick2(scope.row)" type="text" size="small">鍒嗗彂</el-button>
</template>
</el-table-column>
</el-table>
diff --git a/src/layout/components/Sidebar/Logo.vue b/src/layout/components/Sidebar/Logo.vue
index ff2c0a1..0a1ea3d 100644
--- a/src/layout/components/Sidebar/Logo.vue
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -35,8 +35,8 @@
},
data() {
return {
- title: '灞辫タ閰嶇綉',
- logo: logoImg
+ title: '涓�浣撳寲鎸囨尌鑸�',
+ logo:""
}
}
}
diff --git a/src/store/modules/mapLayers.js b/src/store/modules/mapLayers.js
index 901332e..f161ca6 100644
--- a/src/store/modules/mapLayers.js
+++ b/src/store/modules/mapLayers.js
@@ -6,17 +6,23 @@
mapInfo: [],
msgList: [],
disasterSnow: {
- title:"闆�",
- val:[]
+ title: '闆�',
+ val: [],
},
disasterRain: {
- title:"闆�",
- val:[]
+ title: '闆�',
+ val: [],
},
disasterFire: {
- title:"鐏�",
- val:[]
+ title: '鐏�',
+ val: [],
},
+ weatherFlag: 2,
+ weatherMsg: {
+ name:'',
+ data:[]
+ },
+ msgInfoData:null,
};
const mutations = {
diff --git a/src/views/login copy.vue b/src/views/login copy.vue
index ae3ae09..a16bc06 100644
--- a/src/views/login copy.vue
+++ b/src/views/login copy.vue
@@ -7,8 +7,8 @@
<div class="logoImg"></div>
<!-- <img :src="logo" alt="logo" style="width: 100px; height: 100px; float: left" /> -->
<div style="float: left; margin-top: 13px; width: 300px; text-align: left">
- <div>灞辫タ閰嶇綉</div>
- <div style="letter-spacing: 1.5px; font-size: 20px; font-weight: 600; margin-top: -8px; margin-left: 3px">灞辫タ閰嶇綉</div>
+ <div>涓�浣撳寲鏅烘収鎸囨尌鑸�</div>
+ <div style="letter-spacing: 1.5px; font-size: 20px; font-weight: 600; margin-top: -8px; margin-left: 3px">涓�浣撳寲鏅烘収鎸囨尌鑸�</div>
</div>
</div>
</div>
diff --git a/src/views/login.vue b/src/views/login.vue
index c9067dd..13bad6b 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -4,10 +4,6 @@
<div class="titleItem">
<div class="logImg"></div>
</div>
-
- <!-- <div class="titleItem">
- <div class="logText">鏁板瓧瀛敓鏅鸿兘閰嶇綉宸℃绯荤粺</div>
- </div> -->
</div>
<div class="logContent">
<div class="contFrom">
@@ -361,7 +357,7 @@
.titleItem {
height: 100%;
display: flex;
- align-items: center;
+ align-items: end;
height: 266px;
}
diff --git a/src/views/visualization/bottomMenu.vue b/src/views/visualization/bottomMenu.vue
index e5909e8..9d71987 100644
--- a/src/views/visualization/bottomMenu.vue
+++ b/src/views/visualization/bottomMenu.vue
@@ -61,7 +61,7 @@
// }]
// },
{
- name: '閰嶇綉杩愭',
+ name: '杩愭',
}
],
diff --git a/src/views/visualization/index.vue b/src/views/visualization/index.vue
index d69f69d..1f82429 100644
--- a/src/views/visualization/index.vue
+++ b/src/views/visualization/index.vue
@@ -25,7 +25,7 @@
<atlas v-if="isShow == '鐭ヨ瘑鍥捐氨'"></atlas>
<analysis v-if="isShow == '鏁版嵁鍒嗘瀽'"></analysis>
<statistics v-if="isShow == '鏁版嵁缁熻'"></statistics>
- <line-loss v-if="isShow == '閰嶇綉杩愭'"></line-loss>
+ <line-loss v-if="isShow == '杩愭'"></line-loss>
<semanticFunction v-if="isShow == '璇箟鍔熻兘'"></semanticFunction>
</div>
@@ -39,6 +39,21 @@
</div>
<div class="msgList" v-show="!showMsgFlag">
<msg-list @childData="receiveDataFromChild"></msg-list>
+ </div>
+ <div class="msgListinfo" v-if="showMsgInfoFlag">
+ <msg-list-info @childData="receiveDataInfoChild"></msg-list-info >
+ </div>
+ <div class="wearthList" v-if="$store.state.mapLayers.weatherFlag == 1">
+ <div class="weatherHeader">
+ {{ $store.state.mapLayers.weatherMsg.name }}
+ </div>
+ <div class="weatherBox">
+ <ul>
+ <li v-for="(item, key) in $store.state.mapLayers.weatherMsg.data" :key="key">
+ {{ item.name }}:{{ item.val }}
+ </li>
+ </ul>
+ </div>
</div>
</div>
</template>
@@ -54,6 +69,7 @@
import statistics from '@/views/visual/statistics/index.vue'
import semanticFunction from '@/views/dataManager/semanticFunction/index.vue'
import msgList from './msgList.vue';
+import msgListInfo from './msgListInfo.vue';
import { point } from '@turf/turf';
export default {
components: {
@@ -65,7 +81,8 @@
statistics,
lineLoss,
semanticFunction,
- msgList
+ msgList,
+ msgListInfo
},
data() {
return {
@@ -74,7 +91,8 @@
wsSocket: null,
rightChartData: {},
leftChartData: {},
- showMsgFlag: true
+ showMsgFlag: true,
+ showMsgInfoFlag: false,
}
},
beforeDestroy() {
@@ -94,9 +112,16 @@
},
methods: {
receiveDataFromChild(data) {
- console.log(data);
-
- this.showMsgFlag = true
+ if(data =="close"){
+ this.showMsgFlag = true;
+ this.showMsgInfoFlag = false
+ return
+ }
+ this.showMsgInfoFlag = true;
+
+ },
+ receiveDataInfoChild() {
+ this.showMsgInfoFlag = false
},
ShowMenuList() {
if (this.$store.state.mapLayers.msgList.length == 0) return;
@@ -114,13 +139,20 @@
if (event.data != "杩炴帴鎴愬姛") {
const obj = JSON.parse(event.data)
if (obj.type == "rain") {
- this.$store.state.mapLayers.disasterRain.val = [obj]
- } else if (obj.type == "snow") {
- this.$store.state.mapLayers.disasterSnow.val = [obj]
+ if ([obj] != this.$store.state.mapLayers.disasterRain.val) {
+ this.$store.state.mapLayers.disasterRain.val = [obj]
+ }
+
+ } else if (obj.type == "thunder") {
+ if ([obj] != this.$store.state.mapLayers.disasterSnow.val) {
+ this.$store.state.mapLayers.disasterSnow.val = [obj]
+ }
} else if (obj.type == "fire") {
- this.$store.state.mapLayers.disasterFire.val = [obj]
+ if ([obj] != this.$store.state.mapLayers.disasterFire.val) {
+ this.$store.state.mapLayers.disasterFire.val = [obj]
+ }
} else if (obj.type == "error") {
- this.$store.state.mapLayers.msgList
+
if (this.$store.state.mapLayers.msgList.length == 0) {
this.$store.state.mapLayers.msgList.push(obj)
} else {
@@ -173,7 +205,7 @@
}
.leftMenu {
- width: 12%;
+ width: 14%;
top: 90px;
left: 10px;
height: calc(100% - 180px);
@@ -182,7 +214,7 @@
}
.rightMenu {
- width: 12%;
+ width: 14%;
top: 90px;
right: 10px;
height: calc(100% - 180px);
@@ -215,13 +247,53 @@
}
}
+ .wearthList {
+ width: 15%;
+ top: 90px;
+ left: 15%;
+ z-index: 40;
+ position: absolute;
+ background: url(~@/assets/images/Screen/chartbg.png) no-repeat;
+ background-size: 100% 100%;
+ height: 20%;
+ padding: 10px;
+ color: white;
+ display: flex;
+ flex-direction: column;
+
+ .weatherHeader {
+ line-height: 10px;
+ font-size: 16px;
+ padding-left: 20px;
+ }
+
+ .weatherBox {
+ flex: 1;
+ padding: 10px;
+ overflow: auto;
+
+ li {
+ line-height: 30px;
+ font-size: 16px;
+ }
+ }
+ }
+
.msgList {
width: 15%;
top: 90px;
right: 16%;
z-index: 40;
position: absolute;
+ height: 30%;
+ }
+ .msgListinfo {
+ width: 15%;
+ top: calc(30% + 100px);
+ right: 16%;
+ z-index: 40;
+ position: absolute;
height: 30%;
}
@@ -268,6 +340,21 @@
}
}
}
+
+/* 鑷畾涔夋粴鍔ㄦ潯杞ㄩ亾 */
+::-webkit-scrollbar-track {
+ background-color: rgba(0, 0, 0, 0);
+}
+
+/* 鑷畾涔夋粴鍔ㄦ潯鐨勬粦鍧� */
+::-webkit-scrollbar-thumb {
+ background-color: rgba(0, 0, 0, 0);
+}
+
+/* 璁剧疆婊氬姩鏉＄殑瀹藉害 */
+::-webkit-scrollbar {
+ width: 1px;
+}
</style>
<style>
::v-deep.map-info-bar {
diff --git a/src/views/visualization/list/chart.vue b/src/views/visualization/list/chart.vue
index 73df6d7..94ec44c 100644
--- a/src/views/visualization/list/chart.vue
+++ b/src/views/visualization/list/chart.vue
@@ -27,9 +27,9 @@
<td>{{ roadItem.line }}</td>
<td style="color:#f56c6c">{{ roadItem.level }}</td>
<td style="color:#409eff">
- <el-button v-show="flagData != roadItem.address" class="elButton" type="primary" plain
+ <el-button v-show="flagData != roadItem.type" class="elButton" type="primary" plain
size="mini" @click="setChangeItem()">璇︽儏</el-button>
- <el-button v-show="flagData == roadItem.address" class="elButton" type="danger" plain
+ <el-button v-show="flagData == roadItem.type" class="elButton" type="danger" plain
size="mini" @click="setCannelItem()">閲嶇疆</el-button>
</td>
</tr>
@@ -82,6 +82,8 @@
},
methods: {
setCannelItem() {
+ this.$store.state.mapLayers.weatherFlag = false;
+ this.$store.state.mapLayers.weatherFlag = 2
this.flagData = null;
mapWeather.closeRegionWeather()
},
@@ -91,8 +93,10 @@
},
setChangeItem() {
var res = this.roadItem;
- window.regionWeather = res.address;
+ window.regionWeather = res.type;
var event = new Event('POIDetailDataChange');
+ this.$store.state.mapLayers.weatherMsg = mapWeather.getWearData(res);
+ this.$store.state.mapLayers.weatherFlag = 1;
window.dispatchEvent(event);
mapWeather.setRegionWeatherType(res);
},
diff --git a/src/views/visualization/list/chart1.vue b/src/views/visualization/list/chart1.vue
index 6ee422b..afa4e70 100644
--- a/src/views/visualization/list/chart1.vue
+++ b/src/views/visualization/list/chart1.vue
@@ -1,6 +1,6 @@
<template>
<div class="chartListBox" :childData="childData">
- <div class="aside-title"> 闆�</div>
+ <div class="aside-title">闆风數</div>
<div class="echartBox" v-show="roadItem.address">
<table class="chartTable">
<tr>
@@ -27,9 +27,9 @@
<td>{{ roadItem.line }}</td>
<td style="color:#f56c6c">{{ roadItem.level }}</td>
<td style="color:#409eff">
- <el-button v-show="flagData != roadItem.address" class="elButton" type="primary" plain
+ <el-button v-show="flagData != roadItem.type" class="elButton" type="primary" plain
size="mini" @click="setChangeItem()">璇︽儏</el-button>
- <el-button v-show="flagData == roadItem.address" class="elButton" type="danger" plain
+ <el-button v-show="flagData == roadItem.type" class="elButton" type="danger" plain
size="mini" @click="setCannelItem()">閲嶇疆</el-button>
</td>
</tr>
@@ -84,6 +84,8 @@
},
methods: {
setCannelItem() {
+ this.$store.state.mapLayers.weatherFlag = false;
+ this.$store.state.mapLayers.weatherFlag = 2
this.flagData = null;
mapWeather.closeRegionWeather()
},
@@ -93,8 +95,10 @@
},
setChangeItem() {
var res = this.roadItem;
- window.regionWeather = res.address;
+ window.regionWeather = res.type;
var event = new Event('POIDetailDataChange');
+ this.$store.state.mapLayers.weatherMsg = mapWeather.getWearData(res);
+ this.$store.state.mapLayers.weatherFlag = 1;
window.dispatchEvent(event);
mapWeather.setRegionWeatherType(res);
},
diff --git a/src/views/visualization/list/chart2.vue b/src/views/visualization/list/chart2.vue
index 221ec60..378f832 100644
--- a/src/views/visualization/list/chart2.vue
+++ b/src/views/visualization/list/chart2.vue
@@ -27,9 +27,9 @@
<td>{{ roadItem.line }}</td>
<td style="color:#f56c6c">{{ roadItem.level }}</td>
<td style="color:#409eff">
- <el-button v-show="flagData != roadItem.address" class="elButton" type="primary" plain
+ <el-button v-show="flagData != roadItem.type" class="elButton" type="primary" plain
size="mini" @click="setChangeItem()">璇︽儏</el-button>
- <el-button v-show="flagData == roadItem.address" class="elButton" type="danger" plain
+ <el-button v-show="flagData == roadItem.type" class="elButton" type="danger" plain
size="mini" @click="setCannelItem()">閲嶇疆</el-button>
</td>
</tr>
@@ -84,6 +84,8 @@
},
methods: {
setCannelItem() {
+ this.$store.state.mapLayers.weatherFlag = false;
+ this.$store.state.mapLayers.weatherFlag = 2
this.flagData = null;
mapWeather.closeRegionWeather()
},
@@ -93,8 +95,10 @@
},
setChangeItem() {
var res = this.roadItem;
- window.regionWeather = res.address;
+ window.regionWeather = res.type;
var event = new Event('POIDetailDataChange');
+ this.$store.state.mapLayers.weatherMsg = mapWeather.getWearData(res);
+ this.$store.state.mapLayers.weatherFlag = 1;
window.dispatchEvent(event);
mapWeather.setRegionWeatherType(res);
},
diff --git a/src/views/visualization/list/mapWeather.js b/src/views/visualization/list/mapWeather.js
index 21f8beb..088eefa 100644
--- a/src/views/visualization/list/mapWeather.js
+++ b/src/views/visualization/list/mapWeather.js
@@ -1,9 +1,40 @@
-import mapServer from '../../../assets/js/mapSdk/mapServe';
+import mapServer from '@/assets/js/mapSdk/mapServe.js';
import * as turf from '@turf/turf';
const mapWeather = {
regionWeather: null,
particle: null,
showRain: 'ShowRain',
+ wallLayer: null,
+ pathLayer: null,
+ listBiildBord: [],
+ listParticle: [],
+ getWearData(res) {
+ return {
+ name: res.address,
+ data: [
+ {
+ name: '鍚嶇О',
+ val: res.address,
+ },
+ {
+ name: '姘旇薄绾у埆',
+ val: res.level,
+ },
+ {
+ name: '鎵�灞炵嚎璺�',
+ val: res.line,
+ },
+ {
+ name: '鏁版嵁鏉ユ簮',
+ val: res.source,
+ },
+ {
+ name: '鍙戝竷鏃堕棿',
+ val: res.time,
+ },
+ ],
+ };
+ },
closeRegionWeather() {
if (this.regionWeather) {
this.regionWeather.enableWeatherType = SmartEarth.Cesium.RegionWeather.TYPE_NONE;
@@ -19,6 +50,24 @@
Viewer.scene.primitives.remove(Viewer.scene.primitives._primitives[i]);
}
}
+ if (this.wallLayer) {
+ Viewer.entities.remove(this.wallLayer);
+ this.wallLayer = null;
+ // this.wallLayer.removeFromMap();
+ // this.wallLayer = null;
+ }
+ if (this.pathLayer) {
+ this.pathLayer.deleteObject();
+ this.pathLayer = null;
+ }
+ for (var i in this.listBiildBord) {
+ this.listBiildBord[i].removeFromMap();
+ }
+ this.listBiildBord = [];
+ for (var i in this.listParticle) {
+ this.listParticle[i].deleteObject();
+ }
+ this.listParticle = [];
},
setRegionWeatherType(response) {
this.closeRegionWeather();
@@ -32,51 +81,166 @@
case 'rain':
// earthCtrl.camera.flyTo(coord[0], coord[1], 8000, 0, -90, 0, 0);
this.showRain(response);
-
break;
case 'fire':
this.showFire(response);
- earthCtrl.camera.flyTo(coord[0], coord[1], 1000, 0, -90, 0, 0);
+ // earthCtrl.camera.flyTo(coord[0], coord[1], 1000, 0, -90, 0, 0);
break;
case 'snow':
this.showSnow();
- earthCtrl.camera.flyTo(coord[0], coord[1], 1000, 0, -90, 0, 0);
+ break;
+ case 'thunder':
+ this.showThunder(response);
break;
}
},
- showFire(res) {
- const coord = this.getCoord(res);
+ showThunder(response) {
+ if (response.geom) {
+ this.addWatherGeom(response.geom, 'thunder2.png');
+ }
+ // const points = this.chunkArray(response.point.split(','), 2);
+
+ // for (var i in points) {
+ // const billboardEntity = earthCtrl.factory.createBillboard({
+ // name: '鏍囩鐐�',
+ // id: earthCtrl.factory.createUUID(),
+ // image: config.images + 'thunder.png', // 璐村浘,
+ // width: 40,
+ // height: 40,
+ // lon: parseFloat(points[i][0]),
+ // lat: parseFloat(points[i][1]),
+ // alt: 1,
+ // scale: 6,
+ // });
+ // this.listBiildBord.push(billboardEntity);
+ // }
+ },
+ addWatherGeom(response, image) {
+ if (response.ploygon) {
+ this.addWatherPloygon(this.chunkArray(response.ploygon, 2), image);
+ }
+ if (response.line) {
+ this.addWatherLine(this.chunkArray(response.line, 2));
+ }
+ },
+ addWatherLine(response) {
const obj = {
- x: coord[0],
- y: coord[1],
- z: 0,
+ type: 'FeatureCollection',
+ features: [
+ {
+ type: 'Feature',
+ geometry: {
+ type: 'LineString',
+ coordinates: response,
+ },
+ },
+ ],
};
- this.particle = earthCtrl.factory.createParticleEffect(
- 'flame',
- obj,
- {
- translation: SmartEarth.Cesium.Cartesian3.fromElements(0, 0, 0), //骞崇Щ
- particleSize: 10,
+ this.pathLayer = earthCtrl.factory.createPathLayer({
+ url: obj,
+ color: '#ff0000', //绾跨殑棰滆壊
+ width: 5.0, //绾跨殑瀹藉害
+ pointColor: '#FFFFFF', //绉诲姩鐐圭殑棰滆壊
+ speed: 1,
+ far: 50000,
+ });
+ },
+ addWatherPloygon(response, image) {
+ response.push(response[0]);
+ const coord = this.getCentroid(response);
+ earthCtrl.camera.flyTo(coord[0], coord[1], 80000, 0, -90, 0, 0);
+ var geom = [];
+ for (var i = 0; i < response.length; i++) {
+ geom.push(response[i][0], response[i][1]);
+ }
+
+ this.wallLayer = Viewer.entities.add({
+ polygon: {
+ hierarchy: Cesium.Cartesian3.fromDegreesArray(geom),
+ material: new Cesium.ImageMaterialProperty({
+ image: config.images + image,
+ alpha: 0.2, // 璁剧疆閫忔槑搴︿负0.5
+ repeat: Cesium.Cartesian2(1.0, 1.0), // 涓嶉噸澶�
+ transparent: true, // 鍚敤png閫忔槑
+ color: new Cesium.Color(1.0, 1.0, 1.0, 0.3), // 璁剧疆棰滆壊鍜岄�忔槑搴�
+ }),
+ stRotation: Cesium.Math.toRadians(0),
},
- function (data) {}
- );
+ });
+ // this.wallLayer = earthCtrl.factory.createPolygon({
+ // name: '闈�',
+ // id: earthCtrl.factory.createUUID(),
+ // material: Cesium.Color.fromCssColorString('rgba(128,128,128, .2)'),
+ // outlineColor: Cesium.Color.fromCssColorString('rgba(128,128,128, .5)'),
+ // lineWidth: 3,
+ // height: 10,
+ // outline: true,
+ // outlineWidth: 2,
+ // positions: SmartEarth.Cesium.Cartesian3.fromDegreesArrayHeights(geom),
+ // });
+
+ // const obj = { type: 'GeometryCollection', geometries: [{ type: 'LineString', coordinates: response }] };
+ // // 娴佸姩澧欏浘灞�
+ // this.wallLayer = earthCtrl.factory.createTrailWallLayer({
+ // url: obj,
+ // color: '#0000ff05', //棰滆壊
+ // height: 20, //楂樺害
+ // speed: 2,
+ // });
+ },
+ showFire(response) {
+ if (response.geom) {
+ this.addWatherGeom(response.geom, 'filre.png');
+ }
+ // const points = this.chunkArray(response.point.split(','), 2);
+ // for (var i in points) {
+ // const particle = earthCtrl.factory.createParticleEffect(
+ // 'flame',
+ // {
+ // x: parseFloat(points[i][0]),
+ // y: parseFloat(points[i][1]),
+ // z: 0,
+ // },
+ // {
+ // translation: SmartEarth.Cesium.Cartesian3.fromElements(0, 0, 0), //骞崇Щ
+ // particleSize: 10,
+ // },
+ // function (data) {}
+ // );
+
+ // this.listParticle.push(particle);
+ // }
+ // const coord = this.getCoord(res);
+ // const obj = {
+ // x: coord[0],
+ // y: coord[1],
+ // z: 0,
+ // };
+ // this.particle = earthCtrl.factory.createParticleEffect(
+ // 'flame',
+ // obj,
+ // {
+ // translation: SmartEarth.Cesium.Cartesian3.fromElements(0, 0, 0), //骞崇Щ
+ // particleSize: 10,
+ // },
+ // function (data) {}
+ // );
},
showRain(res) {
var area = [];
- var std =[];
- for (var i = 0; i < res.area.length; i += 3) {
+ var std = [];
+ for (var i = 0; i < res.area.length; i += 2) {
area.push(res.area[i]);
area.push(res.area[i + 1]);
- std.push([res.area[i],res.area[i + 1]])
+ std.push([res.area[i], res.area[i + 1]]);
}
- std.push(std[0])
-
-
+ std.push(std[0]);
+
const polygon = turf.polygon([std]);
const centerPoint = turf.center(polygon);
- const coord= centerPoint.geometry.coordinates;
+ const coord = centerPoint.geometry.coordinates;
earthCtrl.camera.flyTo(coord[0], coord[1], 8000, 0, -90, 0, 0);
const geometry = new Cesium.PolygonGeometry({
@@ -115,13 +279,6 @@
});
primitive.name = this.showRain;
Viewer.scene.primitives.add(primitive);
-
- // Viewer.camera.lookAt(primitive.boundingSphere.center, new Cesium.HeadingPitchRange(0.0, Cesium.Math.toRadians(-90), 5000));
- // if (this.regionWeather) {
- // this.regionWeather.enableWeatherType = SmartEarth.Cesium.RegionWeather.TYPE_RAIN;
- // this.regionWeather.regionAlpha = 0.6;
- // this.regionWeather.regionGradientDistance = 300;
- // }
},
showSnow() {
@@ -135,6 +292,23 @@
const coord = res.point.split(',');
return coord;
},
+ getCentroid(response) {
+ var centroid = turf.centroid(turf.polygon([response]));
+ return centroid.geometry.coordinates;
+ },
+ chunkArray(array, size) {
+ return array.reduce((chunks, current, index) => {
+ const chunkIndex = Math.floor(index / size);
+
+ if (!chunks[chunkIndex]) {
+ chunks[chunkIndex] = [];
+ }
+
+ chunks[chunkIndex].push(current);
+
+ return chunks;
+ }, []);
+ },
getRegionWather(res) {
if (res.type == 'fire') return;
const coord = this.getCoord(res);
diff --git a/src/views/visualization/mapView.vue b/src/views/visualization/mapView.vue
index 270738d..9affe4e 100644
--- a/src/views/visualization/mapView.vue
+++ b/src/views/visualization/mapView.vue
@@ -52,6 +52,9 @@
}
// 榛樿璁剧疆搴曞浘
this.addImageLayer();
+
+
+
},
addImageLayer() {
const baseLayer = mapData.baseLayer;
@@ -70,7 +73,7 @@
},
setdefaultPerspective() {
mapConfig.sertCameraTo(mapData.defaultPerspective);
- if (config.baseModel.url) {
+ if (config.baseModel.flag) {
mapServer.addLayer(config.baseModel);
}
this.getSelectLayers();
@@ -84,7 +87,7 @@
if (item.cnName != "閰嶇綉绾�") {
mapServer.addLayer(item)
}
- }
+ }
})
this.$nextTick(() => {
@@ -97,7 +100,7 @@
earthCtrl.factory.createPathLayer({
url: road,
// color: "#00FA9A", //绾跨殑棰滆壊
- color: "#ff0000", //绾跨殑棰滆壊
+ color: "#ff0000", //绾跨殑棰滆壊
width: 5.0, //绾跨殑瀹藉害
pointColor: "#FFFFFF", //绉诲姩鐐圭殑棰滆壊
speed: 1,
diff --git a/src/views/visualization/msgList.js b/src/views/visualization/msgList.js
new file mode 100644
index 0000000..d939684
--- /dev/null
+++ b/src/views/visualization/msgList.js
@@ -0,0 +1,116 @@
+
+import * as turf from "@turf/turf";
+const msgList = {
+ label: null,
+ circle: undefined,
+ line: [],
+ startLine: [],
+ backLine: [],
+ point: null,
+ removeLabel() {
+ if (this.label) {
+ this.label.removeFromMap();
+ this.label = null;
+ }
+ if (this.circle) {
+ this.circle.removeFromMap();
+ this.circle = undefined;
+ }
+ if (this.pathLine) {
+ Viewer.entities.remove(this.pathLine);
+ this.pathLine = null;
+ }
+ this.startLine = [];
+ this.line = [];
+ this.backLine = [];
+ },
+ setInit(item) {
+ const point = item.point.split(',');
+ this.point = point;
+ this.label = earthCtrl.factory.createLabel({
+ lon: point[0],
+ lat: point[1],
+ alt: 40,
+ text: item.msg,
+ image: config.sdkImg + 'Workers/image/mark.png',
+ // 鏂囨湰鍋忕Щ閲�
+ pixelOffset: new SmartEarth.Cesium.Cartesian2(0, -50),
+ // 鍥剧墖鍋忕Щ閲�
+ iPixelOffset: new SmartEarth.Cesium.Cartesian2(0, -20),
+ });
+ this.showCircle(point, '#ff0000');
+ if (!item.geom.line) return;
+ this.line = this.chunkArray(item.geom.line, 2);
+ var center_Coord = [];
+
+ for (var i = 0; i < this.line.length; i++) {
+ center_Coord.push(turf.point([this.line[i][0], this.line[i][1]]));
+ var coord_start =this.getCartesianCoord(this.line[i][0], this.line[i][1], 1);
+ this.startLine.push(coord_start);
+ }
+ var features = turf.featureCollection(center_Coord);
+
+ var center = turf.center(features).geometry.coordinates;
+
+ earthCtrl.camera.flyTo(center[0], center[1], 8000, 0, -90, 0, 0);
+ var backGeom = this.line.reverse();
+ for (var i = 0; i < backGeom.length; i++) {
+ var coord_back =this.getCartesianCoord(backGeom[i][0], backGeom[i][1], 1);
+ this.backLine.push(coord_back);
+ }
+ // this.$nextTick(() => {
+
+ this.showPathLine(this.startLine, true);
+ // });
+ },
+ getCartesianCoord(longitude, latitude, height) {
+ return Cesium.Cartesian3.fromDegrees(longitude, latitude, height);
+ },
+ showCircle(res, color) {
+ if (this.circle) {
+ this.circle.removeFromMap();
+ this.circle = undefined;
+ }
+ this.circle = earthCtrl.factory.createCircleScan({
+ lon: res[0],
+ lat: res[1],
+ color: SmartEarth.Cesium.Color.fromCssColorString(color),
+ height: 1,
+ maxRadius: 100,
+ duration: 5000,
+ });
+ },
+ chunkArray(array, size) {
+ return array.reduce((chunks, current, index) => {
+ const chunkIndex = Math.floor(index / size);
+
+ if (!chunks[chunkIndex]) {
+ chunks[chunkIndex] = [];
+ }
+
+ chunks[chunkIndex].push(current);
+
+ return chunks;
+ }, []);
+ },
+ showPathLine(degreesArr, boolen) {
+ this.pathLine = Viewer.entities.add({
+ polyline: {
+ clampToGround: true,
+ //杞ㄨ抗绾跨殑鍒嗗竷浣嶇疆
+ positions: degreesArr,
+ material: new Cesium.ImageMaterialProperty({
+ //鍥剧墖鐨勯鑹�
+ //杞ㄨ抗杩愯鐨勯�熺巼
+ speed: 10,
+ //闅忔剰涓�寮犲浘鐗�
+ image: config.images + '鍚戝彸.png',
+ //灏嗚建杩瑰垎鎴愪竴琛�50涓浘鐗�
+ repeat: { x: 40, y: 1 },
+ }),
+ width: 20,
+ },
+ });
+ },
+};
+export default msgList;
diff --git a/src/views/visualization/msgList.vue b/src/views/visualization/msgList.vue
index 34b1cb0..348e901 100644
--- a/src/views/visualization/msgList.vue
+++ b/src/views/visualization/msgList.vue
@@ -1,18 +1,15 @@
<template>
<div class="msgBox">
-
<div class="aside-title">
<div>鏁呴殰淇℃伅</div>
- <div @click="sendDataToParent()" class="closeMsg">
- X
- </div>
+ <div @click="sendDataToParent()" class="closeMsg">X</div>
</div>
<div class="menuTable">
<table>
<tr>
- <th style="width: 100px;">璁惧鍚嶇О</th>
+ <th style="width: 80px">璁惧鍚嶇О</th>
<th>璁惧浣嶇疆</th>
- <th style="width: 100px;">鎿嶄綔</th>
+ <th style="width: 40px">鎿嶄綔</th>
</tr>
<tr v-for="(item, indx) in $store.state.mapLayers.msgList" :key="indx">
<td>{{ item.msg }}</td>
@@ -24,72 +21,39 @@
</tr>
</table>
</div>
-
</div>
</template>
<script>
+
import mapConfig from '../../assets/js/mapSdk/mapConfig';
+import menuManager from '../../assets/js/mapSdk/menuManager';
-
+import msgList from './msgList.js';
export default {
- components: {
-
- },
- props: {
-
- },
+ components: {},
+ props: {},
data() {
return {
- label: null,
- }
+
+ };
},
- watch: {
-
- },
- mounted() {
-
- },
+ watch: {},
+ mounted() { },
methods: {
sendDataToParent() {
- this.removeLabel();
- console.log(23);
-
- this.$emit('childData', '瀛愮粍浠舵暟鎹�');
-
+ msgList.removeLabel();
+ this.$emit('childData', 'close');
},
- removeLabel() {
- if (this.label) {
- this.label.removeFromMap()
- this.label = null;
- }
- },
+
handleClick(item) {
- this.removeLabel();
- // const point = mapConfig.getWKTParse(item.point)
- const point = item.point.split(",")
- this.label = earthCtrl.factory.createLabel({
- lon: point[0],
- lat: point[1],
- alt: 40,
- text: item.msg,
- image: config.sdkImg + 'Workers/image/mark.png',
- // 鏂囨湰鍋忕Щ閲�
- pixelOffset: new SmartEarth.Cesium.Cartesian2(0, -50),
- // 鍥剧墖鍋忕Щ閲�
- iPixelOffset: new SmartEarth.Cesium.Cartesian2(0, -20)
- });
- earthCtrl.userScene.flyTo(this.label)
+ this.$store.state.mapLayers.msgInfoData = {...item};
+ this.$emit('childData', 'showMsgInfoFlag');
+ msgList.removeLabel();
+ msgList.setInit(item)
},
- handleClick2(item) {
-
- },
- setMsgClose() {
-
- }
-
- }
-}
+ },
+};
</script>
<style lang="scss" scoped>
@@ -111,7 +75,7 @@
color: #fff;
width: 100%;
height: 45px;
- line-height: 45px;
+ line-height: 35px;
background-size: 100% 100%;
background-repeat: no-repeat;
display: flex;
@@ -122,9 +86,8 @@
}
.closeMsg :hover {
- color: #409EFF;
+ color: #409eff;
}
-
}
.menuTable {
@@ -140,13 +103,15 @@
th {
text-align: center;
-
+ word-wrap: break-word;
+ word-break: break-all;
}
td {
+ word-wrap: break-word;
+ word-break: break-all;
line-height: 30px;
- border-bottom: 1px solid #409EFF;
- ;
+ border-bottom: 1px solid #409eff;
}
}
}
@@ -163,13 +128,13 @@
::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
- background: #409EFF;
+ background: #409eff;
}
/*婊氬姩鏉￠噷闈㈣建閬�*/
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
border-radius: 10px;
- background: rgba(237, 237, 237, .1);
+ background: rgba(237, 237, 237, 0.1);
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/visualization/msgListInfo.vue b/src/views/visualization/msgListInfo.vue
new file mode 100644
index 0000000..62f951a
--- /dev/null
+++ b/src/views/visualization/msgListInfo.vue
@@ -0,0 +1,141 @@
+<template>
+ <div class="msgBox">
+ <div class="aside-title">
+ <div>{{ this.$store.state.mapLayers.msgInfoData.line }}</div>
+ <div @click="sendDataToParent()" class="closeMsg">X</div>
+ </div>
+ <div class="menuTable">
+ <table>
+ <tr>
+ <td>寮傚父淇℃伅锛�</td>
+ <td>{{ this.$store.state.mapLayers.msgInfoData.msg }}</td>
+ </tr>
+ <tr>
+ <td>寮傚父鍦扮偣锛�</td>
+ <td>{{ this.$store.state.mapLayers.msgInfoData.point }}</td>
+ </tr>
+ <tr>
+ <td>寮傚父鏃堕棿锛�</td>
+ <td>{{ this.$store.state.mapLayers.msgInfoData.time }}</td>
+ </tr>
+ <tr>
+ <td>鏁版嵁鏉ユ簮锛�</td>
+ <td>{{ this.$store.state.mapLayers.msgInfoData.source }}</td>
+ </tr>
+
+
+ </table>
+
+ </div>
+ </div>
+</template>
+
+<script>
+import msgList from './msgList.js';
+
+
+
+export default {
+ components: {},
+ props: {},
+ data() {
+ return {
+
+ };
+ },
+ watch: {},
+ mounted() {
+
+ },
+ methods: {
+ sendDataToParent() {
+ msgList.removeLabel();
+ this.$emit('childData', '瀛愮粍浠舵暟鎹�');
+ },
+
+ },
+};
+</script>
+
+<style lang="scss" scoped>
+.msgBox {
+ width: 100%;
+ height: 100%;
+ background: url(~@/assets/images/Screen/chartbg.png) no-repeat;
+ background-size: 100% 100%;
+ position: relative;
+ border-radius: 5px;
+ display: flex;
+ flex-direction: column;
+
+ .aside-title {
+ box-sizing: border-box;
+ padding-left: 30px;
+ font-size: 15px;
+ font-family: YouSheBiaoTiHei, YouSheBiaoTiHei-Regular;
+ color: #fff;
+ width: 100%;
+ height: 45px;
+ line-height: 35px;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ display: flex;
+
+ .closeMsg {
+ margin-left: 64%;
+ cursor: pointer;
+ }
+
+ .closeMsg :hover {
+ color: #409eff;
+ }
+ }
+
+ .menuTable {
+ margin: 5px;
+ margin-top: 10px;
+ text-align: center;
+ flex: 1;
+ overflow: auto;
+
+ table {
+ width: 100%;
+ color: white;
+
+ th {
+ text-align: center;
+ word-wrap: break-word;
+ word-break: break-all;
+ }
+
+ td {
+ word-wrap: break-word;
+ word-break: break-all;
+ line-height: 30px;
+ border-bottom: 1px solid #409eff;
+ }
+ }
+ }
+}
+
+/*婊氬姩鏉℃暣浣撴牱寮�*/
+::-webkit-scrollbar {
+ /*楂樺鍒嗗埆瀵瑰簲妯珫婊氬姩鏉＄殑灏哄*/
+ width: 5px;
+ height: 1px;
+}
+
+/*婊氬姩鏉￠噷闈㈠皬鏂瑰潡*/
+::-webkit-scrollbar-thumb {
+ border-radius: 5px;
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+ background: #409eff;
+}
+
+/*婊氬姩鏉￠噷闈㈣建閬�*/
+::-webkit-scrollbar-track {
+ -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
+ border-radius: 10px;
+ background: rgba(237, 237, 237, 0.1);
+}
+</style>
diff --git a/vue.config.js b/vue.config.js
index 8f7f3ee..5349cba 100644
--- a/vue.config.js
+++ b/vue.config.js
@@ -8,7 +8,7 @@
const CompressionPlugin = require('compression-webpack-plugin');
const { log } = require('console');
-const name = process.env.VUE_APP_TITLE || '灞辫タ閰嶇綉'; // 缃戦〉鏍囬
+const name = process.env.VUE_APP_TITLE || '涓�浣撳寲鏅烘収鎸囨尌鑸�'; // 缃戦〉鏍囬
const port = process.env.port || process.env.npm_config_port || 80; // 绔彛
console.log( "123",process.env.VUE_APP_SERVER_API_URL);
--
Gitblit v1.9.3