From 653c004b4f44396cdb4dce04c17152c7563e37f8 Mon Sep 17 00:00:00 2001
From: yangdelong <828900aaa>
Date: 星期五, 09 四月 2021 11:02:38 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/develop' into develop
---
.gitignore | 2
src/components/panel/BaseNavMenuItem.vue | 118
src/assets/css/map/map-panel-style.less | 95
src/components/panel/ToolBoxPanel.vue | 20
src/components/LayerController/modules/LcServiceLayerFilter.vue | 24
src/conf/layers/LayerVideo.js | 8
src/api/mapApi.js | 19
src/components/LayerController/logic/Company.js | 23
src/conf/LayerPipeLine.js | 1
public/assets/images/map/company_oil.png | 0
src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue | 28
src/components/plugin/MakeTation.js | 250 +-
src/conf/layers/LayerBasin.js | 1
src/components/plugin/leaflet-measure-path/leaflet-measure-path.css | 44
src/assets/css/map/_map-variable.less | 1
src/components/LayerController/service/WfsLayerService.js | 6
src/conf/Constants.js | 2
src/conf/layers/LayerEnvRisk.js | 15
public/assets/images/map/company_sales.png | 0
src/components/plugin/FullScreen.js | 350 +-
src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue | 22
src/components/panel/RightSearchPanel.vue | 133
src/components/LayerController/logic/WasteGas.js | 14
src/components/plugin/MeaSure.js | 340 +-
src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue | 40
src/conf/LayerTopic.js | 6
src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue | 476 ++++
src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue | 213 ++
src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue | 5
src/views/MapTemplate.vue | 7
src/api/mapUrl.js | 11
src/components/LayerController/LayerController.vue | 42
src/components/BaseNav/PublicBounced/PublicBounced.vue | 58
src/components/LayerController/modules/LcServiceLayer.vue | 79
src/components/plugin/DownLoad.js | 1410 ++++++------
src/components/table/components/SolidWaste.vue | 279 +
/dev/null | 257 --
src/components/table/summarySheets.vue | 142 +
src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue | 5
src/components/table/components/tabHandover.vue | 7
src/conf/MapConfig.js | 3
package.json | 2
public/assets/images/map/company_refining.png | 0
src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue | 397 +++
src/components/LayerController/logic/WasteWater.js | 26
src/components/plugin/leaflet-measure-path/leaflet-measure-path.js | 840 ++++----
src/components/panel/bounced/TextBounced.vue | 262 +-
src/components/LayerController/logic/SolidWaste.js | 4
48 files changed, 3,653 insertions(+), 2,434 deletions(-)
diff --git a/.DS_Store b/.DS_Store
deleted file mode 100644
index 85bb87e..0000000
--- a/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/.gitignore b/.gitignore
index cc27dc9..3ba1c88 100644
--- a/.gitignore
+++ b/.gitignore
@@ -29,4 +29,4 @@
.DS_Store
package-lock.json
.idea
-.dist
+/dist
diff --git a/package.json b/package.json
index 40e1977..aa3ea33 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"core-js": "^3.6.5",
- "dayjs": "^1.9.6",
+ "dayjs": "^1.10.4",
"echarts": "^4.2.1",
"element-ui": "^2.14.1",
"esri-leaflet": "^3.0.1",
diff --git a/public/assets/.DS_Store b/public/assets/.DS_Store
deleted file mode 100644
index 66f4848..0000000
--- a/public/assets/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/public/assets/images/.DS_Store b/public/assets/images/.DS_Store
deleted file mode 100644
index 7554b5e..0000000
--- a/public/assets/images/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/public/assets/images/map-pages/.DS_Store b/public/assets/images/map-pages/.DS_Store
deleted file mode 100644
index a039990..0000000
--- a/public/assets/images/map-pages/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/public/assets/images/map-pages/icon/.DS_Store b/public/assets/images/map-pages/icon/.DS_Store
deleted file mode 100644
index 4911e55..0000000
--- a/public/assets/images/map-pages/icon/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/public/assets/images/map/company.png b/public/assets/images/map/company.png
deleted file mode 100644
index a48d213..0000000
--- a/public/assets/images/map/company.png
+++ /dev/null
Binary files differ
diff --git a/public/assets/images/map/company_oil.png b/public/assets/images/map/company_oil.png
new file mode 100644
index 0000000..cec6627
--- /dev/null
+++ b/public/assets/images/map/company_oil.png
Binary files differ
diff --git a/public/assets/images/map/company_refining.png b/public/assets/images/map/company_refining.png
new file mode 100644
index 0000000..faa99c1
--- /dev/null
+++ b/public/assets/images/map/company_refining.png
Binary files differ
diff --git a/public/assets/images/map/company_sales.png b/public/assets/images/map/company_sales.png
new file mode 100644
index 0000000..28a279a
--- /dev/null
+++ b/public/assets/images/map/company_sales.png
Binary files differ
diff --git a/src/.DS_Store b/src/.DS_Store
deleted file mode 100644
index c521892..0000000
--- a/src/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/src/api/mapApi.js b/src/api/mapApi.js
index a621754..51e2068 100644
--- a/src/api/mapApi.js
+++ b/src/api/mapApi.js
@@ -36,6 +36,10 @@
getWasteGasDetails (data) {
return axios.get(mapUrl.getWasteGasDetails, data)
},
+ // 搴熸皵鐐瑰皬鏃舵棩鏁版嵁
+ getWasteGasMonData (data) {
+ return axios.get(mapUrl.getWasteGasMonData, data)
+ },
// 搴熸按鐐�
getWasteWater (data) {
return axios.get(mapUrl.getWasteWater, data)
@@ -48,7 +52,22 @@
getWasteWaterMonitoringDetails (data) {
return axios.get(mapUrl.getWasteWaterMonitoringDetails, data)
},
+ // 搴熸按鏃ユ暟鎹拰灏忔椂鏁版嵁鍙婃槑缁嗚〃
+ getQueryOnlineMonData (data) {
+ return axios.get(mapUrl.getQueryOnlineMonData, data)
+ },
+ // 搴熸按浜哄伐鏁版嵁
+ getQueryLabMonData (data) {
+ return axios.get(mapUrl.getQueryLabMonData, data)
+ },
+ // 搴熸按瀹炴椂鏁版嵁
+ getDataItems (data) {
+ return axios.get(mapUrl.getDataItems, data)
+ },
getCompany (data) {
return axios.get(mapUrl.getCompany, data)
+ },
+ DataItems (data) {
+ return axios.get(mapUrl.DataItems, data)
}
}
diff --git a/src/api/mapUrl.js b/src/api/mapUrl.js
index c2493a8..ef1af63 100644
--- a/src/api/mapUrl.js
+++ b/src/api/mapUrl.js
@@ -12,9 +12,14 @@
export const getWasteGas = $HOST + '/wasteGas/getWasteGas'
export const getWasteGasDetails = $HOST + '/wasteGas/getWasteGasMonitoringDetails'
+export const DataItems = $HOST + '/wasteWater/RTDB/DataItems'
+export const getWasteGasMonData = $HOST + '/wasteGas/QueryOnlineMonData'
-export const getWasteWater = $HOST + '/wasteWater/getWasteWater'
-export const getWasteWaterMonitoring = $HOST + '/wasteWater/getWasteWaterMonitoring'
-export const getWasteWaterMonitoringDetails = $HOST + '/wasteWater/getWasteWaterMonitoringDetails'
+export const getWasteWater = $HOST + '/wasteWater/getWasteWater' // 搴熸按鐐逛俊鎭�
+export const getWasteWaterMonitoring = $HOST + '/wasteWater/getWasteWaterMonitoring' // 搴熸按鐩戞祴鏁版嵁
+export const getWasteWaterMonitoringDetails = $HOST + '/wasteWater/getWasteWaterMonitoringDetails' // 搴熸按鐩戞祴鏁版嵁鏄庣粏琛�
+export const getQueryOnlineMonData = $HOST + '/wasteWater/QueryOnlineMonData' // 搴熸按鏃ユ暟鎹皬鏃舵暟鎹強鏄庣粏琛ㄦ暟鎹�
+export const getQueryLabMonData = $HOST + '/wasteWater/QueryLabMonMonData' // 浜哄伐鏁版嵁
+export const getDataItems = $HOST + '/wasteWater/RTDB/DataItems' // 瀹炴椂鏁版嵁
export const getCompany = $HOST + '/company/getCompany'
diff --git a/src/assets/.DS_Store b/src/assets/.DS_Store
deleted file mode 100644
index 66f4848..0000000
--- a/src/assets/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/src/assets/css/map/_map-variable.less b/src/assets/css/map/_map-variable.less
index 8ef5f52..64c7e30 100644
--- a/src/assets/css/map/_map-variable.less
+++ b/src/assets/css/map/_map-variable.less
@@ -6,6 +6,7 @@
@color-tool: #C0C4CC;//宸ュ叿鑹�
@color-shadow: #00fff6;//鏄剧ず棰滆壊
@background-color: rgba(0, 16, 30, .7);//鑳屾櫙濉厖鑹�
+@background-color4: rgba(0, 16, 30, .4);//鑳屾櫙濉厖鑹�
@background-color-light: rgba(40, 50, 100, .4);//鍏夋檿
@background-color-split: rgba(0, 255, 246, .14);//鍒嗗壊绾�
@background-color-tools: #1A4951;//宸ュ叿绠�
diff --git a/src/assets/css/map/map-panel-style.less b/src/assets/css/map/map-panel-style.less
index 3545ff7..46bf141 100644
--- a/src/assets/css/map/map-panel-style.less
+++ b/src/assets/css/map/map-panel-style.less
@@ -1,5 +1,9 @@
@import "_map-variable";
-
+.leaflet-container,
+html,body{
+ // font-family: 'Microsoft YaHei';
+ font: 12px/1.5 "Microsoft YaHei", Arial, Helvetica, sans-serif;
+}
/*鍏ㄥ眬璁剧疆***********/
h1, h2, h3, h4, h5, h6, ul, li, p {
padding: 0;
@@ -242,19 +246,68 @@
}
/***************Company 鍥惧眰 鎮诞妗嗘牱寮忋��*********************************/
-.company-bindTooltip {
- background: @background-color-split;
+.company-bindTooltip{
+ position: absolute;
+ top:0;
+ left: 0;
+ display: flex;
+ justify-content: center;
+ justify-items: center;
+ img{display: block;width: 30px;height: 30px;margin-left: -15px;margin-top: -15px}
+ ul{
+ width: 120px;
+ margin-left: -60px;
+ text-align: center;
+ display: flex;
+ position: absolute;
+ top:20px;
+ left:0;
+ li{
+ position: absolute;
+ top:0;
+ left:0;
+ width: 100%;
+ font-weight: 900;
+ text-shadow: 0 0 4px #fff;
+ color: red;
+ font-size: 16px;
+ height: 20px;
+ line-height: 18px;
+ overflow: visible;
+ }
+ }
+}
+/*.company-bindTooltip {
+ //background: @background-color-split;
+ background: none;
border: none;
color: red;
- font-size: 16px;
- font-weight: 900 !important;
- text-shadow: 0 0 5px #fff;
- //filter:Dropshadow(offx=1,offy=0,color=white)
- //Dropshadow(offx=0,offy=1,color=white)
- //Dropshadow(offx=0,offy=-1,color=white)
- //Dropshadow(offx=-1,offy=0,color=white);
+ //font-size: 16px;
box-shadow: none;
- -webkit-text-stroke: .5px #fff;
+ text-shadow: 0 0 5px #fff;
+ filter:Dropshadow(offx=1,offy=0,color=white)
+ Dropshadow(offx=0,offy=1,color=white)
+ Dropshadow(offx=0,offy=-1,color=white)
+ Dropshadow(offx=-1,offy=0,color=white);
+ box-shadow: none;
+ -webkit-text-stroke: 0.1px #fff;
+ font: 16px "Microsoft YaHei", Arial, Helvetica, sans-serif;
+ ul{
+ position: relative;
+ li:not(:first-child){
+ position: absolute;
+ top:0;
+ left:0;
+ width: 100%;
+ font-weight: 900;
+ }
+ li{
+ text-shadow: 0 0 4px #fff;
+ }
+ }
+}*/
+.company-bindTooltip:before{
+ display: none;
}
.company-bindTooltip-hover h3 {
@@ -268,15 +321,15 @@
list-style: none;
margin: 0;
padding: 0;
- width: 260px;
- display: flex;
+ //width: 260px;
+ //display: flex;
flex-wrap: wrap;
}
.company-bindTooltip-hover ul li {
margin: 0;
padding: 3px 0;
- width: 50%;
+ //width: 50%;
}
/*************** PublicTable 琛ㄦ牸鏍峰紡銆�*********************************/
@@ -310,6 +363,13 @@
}
.el-table tbody tr:hover>td {
background-color:#28304d !important;
+}
+//淇敼琛ㄦ牸楂樺害
+.el-table td {
+ padding: 0!important;
+ height: 30px;
+ line-height: 30px;
+ font-size: 0.01rem !important;
}
/***********************************************鍔ㄧ敾鏁堟灉************/
.transition{
@@ -345,6 +405,7 @@
.icon{
width: 20px;
margin: 0 auto;
+ font-size: 20px;
}
}
@@ -354,4 +415,8 @@
padding: 10px;
text-align: center;
border-bottom: 1px solid @background-color-split;
-}
\ No newline at end of file
+}
+
+.el-tabs__header .is-top {
+
+}
diff --git a/src/assets/images/.DS_Store b/src/assets/images/.DS_Store
deleted file mode 100644
index 7554b5e..0000000
--- a/src/assets/images/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/src/assets/images/map-pages/.DS_Store b/src/assets/images/map-pages/.DS_Store
deleted file mode 100644
index a039990..0000000
--- a/src/assets/images/map-pages/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/src/assets/images/map-pages/icon/.DS_Store b/src/assets/images/map-pages/icon/.DS_Store
deleted file mode 100644
index 4911e55..0000000
--- a/src/assets/images/map-pages/icon/.DS_Store
+++ /dev/null
Binary files differ
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue b/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue
deleted file mode 100644
index ce510b7..0000000
--- a/src/components/BaseNav/PublicBounced/GasComponents/ECharts.vue
+++ /dev/null
@@ -1,257 +0,0 @@
-<template>
- <div id="Tab">
- <div class="Infomation">
- <el-tag>姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</el-tag>
- <el-tag>浜屾哀鍖栫～ : 17.34 鏍囧噯 : 50</el-tag>
- <el-tag>鐑熷皹 : 6.93 鏍囧噯 : 30</el-tag>
- <el-tag>搴熸皵娴侀噺 : 120343.18</el-tag>
- </div>
- <div class="form-echrts">
- <div>
- <el-button size="mini" round @click="dialogVisible = true">鏄庣粏琛�</el-button>
- <el-dialog :visible.sync="dialogVisible"
- :append-to-body="true"
- :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName"
- width="68%"
- center
- v-dialogDrag
- >
- <div class="el-dialog-div" style="height: 500px">
- <public-detailed-list v-bind="$attrs"></public-detailed-list>
- </div>
- </el-dialog>
- </div>
- <div style="width:100%;height:1rem;margin-top:-0.1rem;position:absolute;" id="echarts" ref="main">
- </div>
- </div>
- </div>
-</template>
-
-<script>
-import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
-
-export default {
- name: 'ECharts',
- components: {
- PublicDetailedList
- },
- data () {
- return {
- watchData: [],
- dialogVisible: false,
- dataDate: [],
- options: {
- title: {
- // text: '鎶樼嚎鍥惧爢鍙�'
- },
- color: ['#5470c6', '#91CC75', '#EE6666', '#FF0087'],
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'cross',
- label: {
- color: '#1a4245'
- }
- }
- },
- legend: {
- x: '200px',
- y: '30px',
- data: [{
- name: '姘哀鍖栫墿',
- textStyle: {
- color: '#00d0f9'
- }
- },
- {
- name: '浜屾哀鍖栫～',
- textStyle: {
- color: '#00d0f9'
- }
- },
- {
- name: '鐑熷皹',
- textStyle: {
- color: '#00d0f9'
- }
- },
- {
- name: '搴熸皵娴侀噺',
- textStyle: {
- color: '#00d0f9'
- }
- }]
- // pageTextStyle: {
- // color: '#fff'
- // }
- },
- grid: {
- left: '3%',
- right: '1%',
- bottom: '3%',
- // top: '1%',
- containLabel: true
- },
- toolbox: {
- feature: {
- saveAsImage: {}
- }
- },
- // 鍥炬爣缂╂斁璁剧疆
- dataZoom: [{
- type: 'inside',
- start: 0,
- end: 100
- }, {
- start: 0,
- end: 100,
- show: false,
- // handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
- handleSize: '80%',
- handleStyle: {
- color: '#fff',
- shadowBlur: 3,
- shadowColor: 'rgba(0, 0, 0, 0.6)',
- shadowOffsetX: 2,
- shadowOffsetY: 2
- }
- }],
- // x杞寸殑璁剧疆
- xAxis: {
- type: 'category',
- boundaryGap: false,
- data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄥ叚'],
- axisLabel: { // x杞村叏閮ㄦ樉绀�
- rotate: 20,
- interval: 0,
- textStyle: {
- color: '#fff'
- }
- },
- splitLine: { // 缃戞牸鍨傜洿绾夸负铏氱嚎
- show: true,
- lineStyle: {
- type: 'dashed'
- }
- },
- axisTick: { // x 杞村埢搴︽樉绀�
- show: false
- },
- axisLine: {
- lineStyle: {
- color: '#FFFFFF',
- width: 1 // 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑
- }
- }
- },
- // Y 杞寸殑璁剧疆
- yAxis: [{
- type: 'value',
- // position: 'left', // 澶� Y 杞翠娇鐢�
- // name: yname, // 鍚庢湡鍥炬爣Y杞存樉绀哄崟浣�
- name: '娴撳害(mg/m鲁)',
- axisLabel: {
- formatter: '{value}',
- textStyle: {
- color: '#fff' // 鍧愭爣鐨勫瓧浣撻鑹�
- }
- },
- axisPointer: {
- snap: true // 鑷姩鍚搁檮鏈�杩戠殑鐐�
- },
- splitLine: {
- show: false // y杞� 缃戞牸绾夸笉鏄剧ず
- },
- axisLine: {
- lineStyle: {
- color: '#ffffff', // 鍧愭爣杞寸殑棰滆壊
- width: 1
- }
- }
- }],
- series: [
- {
- name: '姘哀鍖栫墿',
- type: 'line',
- stack: '鎬婚噺',
- data: [120, 132, 101, 134, 90, 230, 210]
- },
- {
- name: '浜屾哀鍖栫～',
- type: 'line',
- stack: '鎬婚噺',
- data: [150, 232, 201, 154, 190, 330, 410]
- },
- {
- name: '鐑熷皹',
- type: 'line',
- stack: '鎬婚噺',
- data: [320, 332, 301, 334, 390, 330, 320]
- },
- {
- name: '搴熸皵娴侀噺',
- type: 'line',
- stack: '鎬婚噺',
- data: [820, 932, 901, 934, 1290, 1330, 1320]
- }
- ]
- }
- }
- },
- methods: {
- drawChart: function () {
- const myChart = this.$echarts.init(this.$refs.main)
- myChart.setOption(this.options)
- }
- },
- mounted () {
- this.$nextTick(() => {
- this.drawChart()
- const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getWasteWaterMonitoring))
- // console.log(dataWatch)
- for (var i = 0; i < dataWatch.length; i++) {
- this.dataDate.push(dataWatch[i].MonTimeStr.substring(10, 17))
- }
- // console.log(this.dataDate)
- })
- }
-}
-</script>
-
-<style scoped lang="less">
-.Infomation {
- margin-left: 10px;
- height: 0.2rem;
-}
-
-.el-tag {
- height: 25px;
- line-height: 25px;
- margin-right: 10px;
- font-size: 10px;
- background-color: rgba(0, 255, 246, 0.14);
- color: #00d0f9;
- border: none;
- padding: 0 15px;
-}
-
-.form-echrts {
- width: 100%;
- height: 1rem;
- border-top: 1px solid #396d83;
- //margin: 10px 10px 10px 10px;
- .el-dialog-div {
- //height: 50vh!important;
- overflow: auto;
- //overflow: hidden;
- }
-
- #echarts {
- margin: 0;
- padding: 0;
- //height: 3rem;
- //border: 1px solid #396d83;
- //margin: 10px 10px 10px 10px;
- }
-}
-</style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue
new file mode 100644
index 0000000..712cff4
--- /dev/null
+++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsDate.vue
@@ -0,0 +1,397 @@
+<!-- 鏃ユ暟鎹� -->
+<template>
+ <div id="Tab">
+ <div class="infomation">
+ <!-- <el-tag>姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</el-tag>-->
+ <!-- <el-tag>浜屾哀鍖栫～ : 17.34 鏍囧噯 : 50</el-tag>-->
+ <!-- <el-tag>鐑熷皹 : 6.93 鏍囧噯 : 30</el-tag>-->
+ <!-- <el-tag>搴熸皵娴侀噺 : 120343.18</el-tag>-->
+ <el-row>
+ <el-col :span="6"><div class="grid-content bg-purple">姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">浜屾哀鍖栫～ : 17.34 鏍囧噯 : 50</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">鐑熷皹 : 6.93 鏍囧噯 : 30</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">搴熸皵娴侀噺 : 120343.18</div></el-col>
+ <!-- <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>-->
+ </el-row>
+ </div>
+ <div class="form-echrts">
+ <div class="from-search">
+ <el-row type="flex">
+ <el-col :span="14">
+ <div class="pickerMon">
+ <div class="pickerData">
+ <span> 寮�濮嬫椂闂�:</span>
+ <span class="pickerTable"><el-date-picker
+ type="datetime"
+ v-model="value1">
+ </el-date-picker></span>
+ </div>
+ <div class="pickerData">
+ <span >缁撴潫鏃堕棿:</span>
+ <span class="pickerTable">
+ <el-date-picker
+ type="datetime"
+ v-model="value2"
+ >
+ </el-date-picker>
+ </span>
+ </div>
+ </div>
+ </el-col>
+ <el-col :span="5">
+ 閲囨牱鐐规暟:
+ <input list="source" id="ipt" class="echatsInput">
+ <datalist id="source">
+ <option value="0" />
+ <option value="25" />
+ <option value="50" />
+ <option value="75" />
+ <option value="100" />
+ </datalist>
+ </el-col>
+ <el-col class="detailbtn" :span="2" @click="onSubmit">鏌ヨ</el-col>
+ <el-col :span="3">
+ <div class="detailbtn" @click="dialogVisible = true" >鏄庣粏琛�</div>
+ <el-dialog :visible.sync="dialogVisible"
+ :append-to-body="true"
+ :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName"
+ width="68%"
+ center
+ v-dialogDrag
+ >
+ <div class="el-dialog-div" style="height: 500px">
+ <public-detailed-list v-bind="$attrs"></public-detailed-list>
+ </div>
+ </el-dialog>
+ </el-col>
+ </el-row>
+ </div>
+ <div style="width:5rem;height:2rem;" id="echarts" ref="main">
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
+
+export default {
+ name: 'ECharts',
+ components: {
+ PublicDetailedList
+ },
+ data () {
+ return {
+ watchData: [],
+ dialogVisible: false,
+ myChar: null,
+ value: '',
+ formInline: {
+ user: '',
+ region: ''
+ }
+ }
+ },
+ methods: {
+ onSubmit () {
+ console.log('submit!')
+ },
+ drawChart: function () {
+ window.onresize = function () {
+ var h1 = document.documentElement.clientHeight// 鑾峰彇灞忓箷鐨勯珮搴�
+ if (h1 > 700) {
+ this.myChart.getDom().style.height = 3 + 'rem'
+ this.myChart.getDom().style.width = 6 + 'rem'
+ } else {
+ this.myChart.getDom().style.height = 3 + 'rem'
+ this.myChart.getDom().style.width = 6 + 'rem'
+ }
+ this.myChart.resize()
+ }
+ },
+ initOptions: function (dataDate, dataValue1, dataValue2, dataValue3) {
+ var options = {
+ title: {
+ // text: '鎶樼嚎鍥惧爢鍙�'
+ },
+ color: ['#5470c6', '#91CC75', '#EE6666', '#FF0087'],
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ label: {
+ color: '#1a4245'
+ }
+ }
+ },
+ legend: {
+ x: '200px',
+ y: '30px',
+ data: [{
+ name: 'COD',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ },
+ {
+ name: '姘ㄦ爱',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ },
+ {
+ name: '搴熸按娴侀噺',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ }]
+ },
+ grid: {
+ left: '3%',
+ right: '3%',
+ bottom: '3%',
+ containLabel: true
+ },
+ toolbox: {},
+ // 鍥炬爣缂╂斁璁剧疆
+ dataZoom: [{
+ type: 'inside',
+ start: 0,
+ end: 100
+ }, {
+ start: 0,
+ end: 100,
+ show: false,
+ // handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+ handleSize: '80%',
+ handleStyle: {
+ color: '#fff',
+ shadowBlur: 3,
+ shadowColor: 'rgba(0, 0, 0, 0.6)',
+ shadowOffsetX: 2,
+ shadowOffsetY: 2
+ }
+ }],
+ // x杞寸殑璁剧疆
+ xAxis: {
+ type: 'category',
+ boundaryGap: ['10%', '10%'],
+ data: dataDate,
+ axisLabel: { // x杞村叏閮ㄦ樉绀�
+ rotate: 20,
+ interval: 0,
+ textStyle: {
+ color: '#fff',
+ fontSize: 10
+ }
+ },
+ splitLine: { // 缃戞牸鍨傜洿绾夸负铏氱嚎
+ show: true,
+ lineStyle: {
+ type: 'dashed'
+ }
+ },
+ axisTick: { // x 杞村埢搴︽樉绀�
+ show: false
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#FFFFFF',
+ width: 1 // 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑
+ }
+ }
+ },
+ // Y 杞寸殑璁剧疆
+ yAxis: [{
+ type: 'value',
+ position: 'left', // 澶� Y 杞翠娇鐢�
+ name: '娴撳害(mg/m鲁)',
+ axisLabel: {
+ formatter: '{value}',
+ textStyle: {
+ color: '#fff' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisPointer: {
+ snap: true // 鑷姩鍚搁檮鏈�杩戠殑鐐�
+ },
+ splitLine: {
+ show: false // y杞� 缃戞牸绾夸笉鏄剧ず
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#ffffff', // 鍧愭爣杞寸殑棰滆壊
+ width: 1
+ }
+ }
+ },
+ {
+ type: 'value',
+ position: 'right', // 澶� Y 杞翠娇鐢�
+ name: '娴侀噺(m鲁/h鲁)',
+ axisLabel: {
+ formatter: '{value}',
+ textStyle: {
+ color: '#fff' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisPointer: {
+ snap: true // 鑷姩鍚搁檮鏈�杩戠殑鐐�
+ },
+ splitLine: {
+ show: false // y杞� 缃戞牸绾夸笉鏄剧ず
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#ffffff', // 鍧愭爣杞寸殑棰滆壊
+ width: 1
+ }
+ }
+ }],
+ series: [
+ {
+ name: 'COD',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue1,
+ yAxisIndex: 0
+ },
+ {
+ name: '姘ㄦ爱',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue2,
+ yAxisIndex: 0
+ },
+ {
+ name: '搴熸按娴侀噺',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue3,
+ yAxisIndex: 1
+ }
+ ]
+ }
+ return options
+ }
+ },
+ mounted () {
+ this.$nextTick(() => {
+ this.drawChart()
+ const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getQueryOnlineMonData)).reverse()
+ console.log(dataWatch)
+ var dataValue1 = []
+ var dataValue2 = []
+ var dataValue3 = []
+ var dataDate = []
+ for (var i = 0; i < 24; i++) {
+ dataDate.push(dataWatch[i].MonTimeStr.substring(0, 8))
+ }
+ for (var n = 0; n < dataWatch.length; n++) {
+ if (dataWatch[n].PoltmtrlName === 'COD') {
+ dataValue1.push(dataWatch[n].MonQty)
+ } else if (dataWatch[n].PoltmtrlName === '姘ㄦ爱') {
+ dataValue2.push(dataWatch[n].MonQty)
+ } else if (dataWatch[n].PoltmtrlName === '搴熸按娴侀噺') {
+ dataValue3.push(dataWatch[n].MonQty)
+ }
+ }
+ const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3)
+ this.myChart = this.$echarts.init(this.$refs.main)
+ this.myChart.setOption(opitons)
+ })
+ }
+}
+</script>
+
+<style scoped lang="less">
+ .grid-content{
+ font-size: 8px!important;
+ background-color:#2e4967;
+ text-align: center;
+ margin: 0 2px 4px 2px;
+ border-radius: 2px;
+ }
+ .Infomation {
+ margin-left: 10px;
+ }
+
+ .el-tag {
+ height: 25px;
+ width: 140px;
+ line-height: 25px;
+ margin-right: 10px;
+ font-size: 10px;
+ background-color: rgba(0, 255, 246, 0.14);
+ color: #00d0f9;
+ border: none;
+ padding: 0 15px;
+ }
+
+ .form-echrts {
+ width: 100%;
+ border-top: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ .from-search{
+ margin-top: 6px;
+ .pickerMon{
+ display: flex;
+ .pickerData{
+ flex: 1;
+ display: flex;
+ .pickerTable{
+ margin-left: 6px;
+ width: 40px;
+
+ /deep/.el-input__icon {
+ width: 0.9rem;
+ font-size: 0;
+ }
+ }
+ }
+ }
+ /deep/.el-date-editor--datetime{
+ width: 100%;
+ }
+ /deep/.el-input__inner{
+ position: relative;
+ width: 0.9rem!important;
+ height: 0.125rem!important;
+ background-color: #2e4967;
+ color: #ffffff;
+ font-size: 8px;
+ padding: 0;
+ //padding-left:20px ;
+ //padding: 0!important;
+ }
+ .echatsInput{
+ color: #00ffff;
+ background-color: #2e4967;
+ border: none;
+ border-radius: 6px;
+ width: 40px;
+ }
+ .detailbtn{
+ background-color:#2e4967;
+ text-align: center;
+ padding: 0 7px;
+ line-height: 20px;
+ border-radius: 4px;
+ margin-right: 6px;
+ }
+ }
+ .el-dialog-div {
+ //height: 50vh!important;
+ overflow: auto;
+ //overflow: hidden;
+ }
+
+ #echarts {
+ margin: 0;
+ padding: 0;
+ //height: 3rem;
+ //border: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ }
+ }
+</style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
new file mode 100644
index 0000000..03d5345
--- /dev/null
+++ b/src/components/BaseNav/PublicBounced/GasComponents/EChartsHour.vue
@@ -0,0 +1,476 @@
+<!-- 灏忔椂鏁版嵁 -->
+<template>
+ <div id="Tab">
+ <div class="infomation">
+<!-- <el-tag>姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</el-tag>-->
+<!-- <el-tag>浜屾哀鍖栫～ : 17.34 鏍囧噯 : 50</el-tag>-->
+<!-- <el-tag>鐑熷皹 : 6.93 鏍囧噯 : 30</el-tag>-->
+<!-- <el-tag>搴熸皵娴侀噺 : 120343.18</el-tag>-->
+ <el-row>
+ <el-col :span="6"><div class="grid-content bg-purple">姘哀鍖栫墿 : 29.93 鏍囧噯 : 100</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">浜屾哀鍖栫～ : 17.34 鏍囧噯 : 50</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">鐑熷皹 : 6.93 鏍囧噯 : 30</div></el-col>
+ <el-col :span="6"><div class="grid-content bg-purple">搴熸皵娴侀噺 : 120343.18</div></el-col>
+<!-- <el-col :span="6"><div class="grid-content bg-purple"></div></el-col>-->
+ </el-row>
+ </div>
+ <div class="form-echrts">
+ <!-- :title="this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName" -->
+ <div class="from-search">
+<!-- <el-form :inline="true" :model="formInline" class="demo-form-inline">-->
+<!-- <el-form-item label="瀹℃壒浜�">-->
+<!-- <el-input v-model="formInline.user" placeholder="瀹℃壒浜�"></el-input>-->
+<!-- </el-form-item>-->
+<!-- <div class="block">-->
+<!-- <el-date-picker-->
+<!-- size="'mini"-->
+<!-- class="date"-->
+<!-- v-model="value"-->
+<!-- type="datetimerange"-->
+<!-- range-separator="鑷�"-->
+<!-- start-placeholder="寮�濮嬫棩鏈�"-->
+<!-- end-placeholder="缁撴潫鏃ユ湡">-->
+<!-- </el-date-picker>-->
+<!-- </div>-->
+<!-- <el-form-item label="閲囨牱鐐规暟" class="text-size">-->
+<!-- <el-select v-model="formInline.region" placeholder="0">-->
+<!-- <el-option label="0" value="shanghai"></el-option>-->
+<!-- <el-option label="25" value="beijing"></el-option>-->
+<!-- <el-option label="50" value="beijing"></el-option>-->
+<!-- <el-option label="75" value="beijing"></el-option>-->
+<!-- <el-option label="100" value="beijing"></el-option>-->
+<!-- </el-select>-->
+<!-- </el-form-item>-->
+<!-- <el-form-item>-->
+<!-- <el-button type="primary" @click="onSubmit">鏌ヨ</el-button>-->
+<!-- </el-form-item>-->
+
+<!-- </el-form>-->
+ <div class="layoutFrom">
+ <div class="pickerMon">
+ <div class="pickerData pickerDataLeft">
+ <span> 寮�濮嬫椂闂�:</span>
+ <span class="pickerTable"><el-date-picker
+ type="datetime"
+ v-model="value1">
+ </el-date-picker></span>
+ </div>
+ <div class="pickerData">
+ <span >缁撴潫鏃堕棿:</span>
+ <span class="pickerTable">
+ <el-date-picker
+ type="datetime"
+ v-model="value2"
+ >
+ </el-date-picker>
+ </span>
+ </div>
+ </div>
+ <div class="sampling">
+ <span>
+ 閲囨牱鐐规暟:
+ </span>
+ <input list="source" id="ipt" class="echatsInput">
+ <datalist id="source">
+ <option value="0" />
+ <option value="25" />
+ <option value="50" />
+ <option value="75" />
+ <option value="100" />
+ </datalist>
+ </div>
+ <div class="InquiryBtn">
+ <div>鏌ヨ</div>
+ </div>
+ <div class="detailBox">
+ <div class="detailbtn" @click="dialogVisible = true" >鏄庣粏琛�</div>
+ <el-dialog :visible.sync="dialogVisible"
+ :append-to-body="true"
+ :title="this.$attrs.value==='feiqi'?this.$attrs.getWasteGasDetails[0].OnLineMonEmissPointName:this.$attrs.getWasteWaterMonitoringDetails[0].OnLineMonEmissPointName"
+ width="68%"
+ center
+ v-dialogDrag
+ >
+ <div class="el-dialog-div" style="height: 500px">
+ <public-detailed-list v-bind="$attrs"></public-detailed-list>
+ </div>
+ </el-dialog>
+ </div>
+ </div>
+ </div>
+ <div style="width:5rem;height:2rem;" id="echarts" ref="main">
+ </div>
+ </div>
+ </div>
+</template>
+
+<script>
+import PublicDetailedList from '@components/BaseNav/PublicBounced/GasComponents/PublicDetailedList'
+
+export default {
+ name: 'ECharts',
+ components: {
+ PublicDetailedList
+ },
+ data () {
+ return {
+ value1: '',
+ value2: '',
+ watchData: [],
+ dialogVisible: false,
+ myChar: null,
+ value: '',
+ formInline: {
+ user: '',
+ region: ''
+ }
+ }
+ },
+ methods: {
+ onSubmit () {
+ console.log('submit!')
+ },
+ drawChart: function () {
+ window.onresize = function () {
+ var h1 = document.documentElement.clientHeight// 鑾峰彇灞忓箷鐨勯珮搴�
+ if (h1 > 700) {
+ this.myChart.getDom().style.height = 3 + 'rem'
+ this.myChart.getDom().style.width = 6 + 'rem'
+ } else {
+ this.myChart.getDom().style.height = 3 + 'rem'
+ this.myChart.getDom().style.width = 6 + 'rem'
+ }
+ this.myChart.resize()
+ }
+ },
+ initOptions: function (dataDate, dataValue1, dataValue2, dataValue3) {
+ var options = {
+ title: {
+ // text: '鎶樼嚎鍥惧爢鍙�'
+ },
+ color: ['#5470c6', '#91CC75', '#EE6666', '#FF0087'],
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'cross',
+ label: {
+ color: '#1a4245'
+ }
+ }
+ },
+ legend: {
+ x: '200px',
+ y: '30px',
+ data: [{
+ name: 'COD',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ },
+ {
+ name: '姘ㄦ爱',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ },
+ {
+ name: '搴熸按娴侀噺',
+ textStyle: {
+ color: '#00d0f9'
+ }
+ }]
+ },
+ grid: {
+ left: '3%',
+ right: '3%',
+ bottom: '3%',
+ containLabel: true
+ },
+ toolbox: {},
+ // 鍥炬爣缂╂斁璁剧疆
+ dataZoom: [{
+ type: 'inside',
+ start: 0,
+ end: 100
+ }, {
+ start: 0,
+ end: 100,
+ show: false,
+ // handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
+ handleSize: '80%',
+ handleStyle: {
+ color: '#fff',
+ shadowBlur: 3,
+ shadowColor: 'rgba(0, 0, 0, 0.6)',
+ shadowOffsetX: 2,
+ shadowOffsetY: 2
+ }
+ }],
+ // x杞寸殑璁剧疆
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ data: dataDate,
+ axisLabel: { // x杞村叏閮ㄦ樉绀�
+ rotate: 20,
+ interval: 0,
+ textStyle: {
+ color: '#fff',
+ fontSize: 10
+ }
+ },
+ splitLine: { // 缃戞牸鍨傜洿绾夸负铏氱嚎
+ show: true,
+ lineStyle: {
+ type: 'dashed'
+ }
+ },
+ axisTick: { // x 杞村埢搴︽樉绀�
+ show: false
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#FFFFFF',
+ width: 1 // 杩欓噷鏄负浜嗙獊鍑烘樉绀哄姞涓婄殑
+ }
+ }
+ },
+ // Y 杞寸殑璁剧疆
+ yAxis: [{
+ type: 'value',
+ position: 'left', // 澶� Y 杞翠娇鐢�
+ name: '娴撳害(mg/m鲁)',
+ axisLabel: {
+ formatter: '{value}',
+ textStyle: {
+ color: '#fff' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisPointer: {
+ snap: true // 鑷姩鍚搁檮鏈�杩戠殑鐐�
+ },
+ splitLine: {
+ show: false // y杞� 缃戞牸绾夸笉鏄剧ず
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#ffffff', // 鍧愭爣杞寸殑棰滆壊
+ width: 1
+ }
+ }
+ },
+ {
+ type: 'value',
+ position: 'right', // 澶� Y 杞翠娇鐢�
+ name: '娴侀噺(m鲁/h鲁)',
+ axisLabel: {
+ formatter: '{value}',
+ textStyle: {
+ color: '#fff' // 鍧愭爣鐨勫瓧浣撻鑹�
+ }
+ },
+ axisPointer: {
+ snap: true // 鑷姩鍚搁檮鏈�杩戠殑鐐�
+ },
+ splitLine: {
+ show: false // y杞� 缃戞牸绾夸笉鏄剧ず
+ },
+ axisLine: {
+ lineStyle: {
+ color: '#ffffff', // 鍧愭爣杞寸殑棰滆壊
+ width: 1
+ }
+ }
+ }],
+ series: [
+ {
+ name: 'COD',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue1,
+ yAxisIndex: 0
+ },
+ {
+ name: '姘ㄦ爱',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue2,
+ yAxisIndex: 0
+ },
+ {
+ name: '搴熸按娴侀噺',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: dataValue3,
+ yAxisIndex: 1
+ }
+ ]
+ }
+ return options
+ }
+ },
+ // methods: {
+ // // onSubmit () {
+ // // console.log('submit!')
+ // // },
+ // drawChart: function () {
+ // const myChart = this.$echarts.init(this.$refs.main)
+ // myChart.setOption(this.options)
+ // window.onresize = function () {
+ // var h1 = document.documentElement.clientHeight// 鑾峰彇灞忓箷鐨勯珮搴�
+ // if (h1 > 700) {
+ // myChart.getDom().style.height = 3 + 'rem'
+ // myChart.getDom().style.width = 6 + 'rem'
+ // } else {
+ // myChart.getDom().style.height = 3 + 'rem'
+ // myChart.getDom().style.width = 6 + 'rem'
+ // }
+ // myChart.resize()
+ // }
+ // }
+ // },
+ mounted () {
+ this.$nextTick(() => {
+ this.drawChart()
+ const dataWatch = JSON.parse(JSON.stringify(this.$attrs.getQueryOnlineMonData)).reverse()
+ console.log(dataWatch)
+ var dataValue1 = []
+ var dataValue2 = []
+ var dataValue3 = []
+ var dataDate = []
+ for (var i = 0; i < 24; i++) {
+ dataDate.push(dataWatch[i].MonTimeStr.substring(9))
+ }
+ for (var n = 0; n < dataWatch.length; n++) {
+ if (dataWatch[n].PoltmtrlName === 'COD') {
+ dataValue1.push(dataWatch[n].MonQty)
+ } else if (dataWatch[n].PoltmtrlName === '姘ㄦ爱') {
+ dataValue2.push(dataWatch[n].MonQty)
+ } else if (dataWatch[n].PoltmtrlName === '搴熸按娴侀噺') {
+ dataValue3.push(dataWatch[n].MonQty)
+ }
+ }
+ const opitons = this.initOptions(dataDate, dataValue1, dataValue2, dataValue3)
+ this.myChart = this.$echarts.init(this.$refs.main)
+ this.myChart.setOption(opitons)
+ })
+ }
+}
+</script>
+
+<style scoped lang="less">
+.grid-content{
+ font-size: 8px!important;
+ background-color:#2e4967;
+ text-align: center;
+ margin: 0 2px 4px 2px;
+ border-radius: 2px;
+}
+.Infomation {
+ margin-left: 10px;
+}
+
+.el-tag {
+ height: 25px;
+ width: 140px;
+ line-height: 25px;
+ margin-right: 10px;
+ font-size: 10px;
+ background-color: rgba(0, 255, 246, 0.14);
+ color: #00d0f9;
+ border: none;
+ padding: 0 15px;
+}
+
+.form-echrts {
+ width: 100%;
+ border-top: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ .from-search{
+ margin-top: 6px;
+ .layoutFrom{
+ display: flex;
+ .sampling{
+ margin-left: 100px;
+ >span{
+ margin-right: 10px;
+ }
+ }
+ .InquiryBtn{
+ margin-left: 30px;
+ width: 36px;
+ height: 20px;
+ font-size: 8px;
+ background-color:#2e4967 ;
+ text-align: center;
+ border-radius: 3px;
+ }
+ .detailBox{
+ margin-left: 30px;
+ }
+ .pickerMon{
+ display: flex;
+ .pickerDataLeft{
+ margin-left: 10px;
+ margin-right: 90px;
+ }
+ .pickerData{
+ flex: 1;
+ display: flex;
+ >span{
+ margin-right: 15px;
+ }
+ .pickerTable{
+ margin-left: 6px;
+ width: 40px;
+
+ /deep/.el-input__icon {
+ width: 1rem;
+ font-size: 0;
+ }
+ }
+ }
+ }
+ }
+ /deep/.el-input__inner{
+ position: relative;
+ width: 0.9rem!important;
+ height: 0.125rem!important;
+ background-color: #2e4967;
+ color: #ffffff;
+ font-size: 8px;
+ padding: 0;
+ //padding-left:20px ;
+ //padding: 0!important;
+ }
+ .echatsInput{
+ color: #00ffff;
+ background-color: #2e4967;
+ border: none;
+ border-radius: 6px;
+ width: 40px;
+ }
+ .detailbtn{
+ background-color:#2e4967;
+ text-align: center;
+ padding: 0 7px;
+ line-height: 20px;
+ border-radius: 4px;
+ margin-right: 6px;
+ }
+ }
+ .el-dialog-div {
+ //height: 50vh!important;
+ overflow: auto;
+ //overflow: hidden;
+ }
+
+ #echarts {
+ margin: 0;
+ padding: 0;
+ //height: 3rem;
+ //border: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ }
+}
+</style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue b/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue
new file mode 100644
index 0000000..ad97760
--- /dev/null
+++ b/src/components/BaseNav/PublicBounced/GasComponents/Echarts.vue
@@ -0,0 +1,213 @@
+<template>
+ <div style="width:100%;height:2rem;margin-top: 0.3rem" ref="echarts"></div>
+</template>
+
+<script>
+
+import mapApi from '@/api/mapApi'
+import 'dayjs/locale/es'
+import dayjs from 'dayjs'
+
+export default {
+ name: 'ECharts',
+ data () {
+ return {
+ myChart: [],
+ result: [],
+ days: dayjs(new Date()).format('YYYYMMDDHHmmss'),
+ value: '',
+ seriesData: [],
+ aseries: ''
+ }
+ },
+ methods: {
+ drawChart () {
+ this.myChart = this.$echarts.init(this.$refs.echarts)
+
+ const option = {
+ tooltip: {
+ trigger: 'axis'
+ },
+ legend: {
+ data: ['閭欢钀ラ攢', '鑱旂洘骞垮憡', '瑙嗛骞垮憡', '鐩存帴璁块棶', '鎼滅储寮曟搸']
+ },
+ grid: {
+ containLabel: false
+ },
+ toolbox: {
+ feature: {
+ saveAsImage: {
+ show: false
+ }
+ }
+ },
+ xAxis: {
+ type: 'category',
+ boundaryGap: false,
+ splitLine: {
+ show: false
+ },
+ // data: this.seriesData,
+ data: ['鍛ㄤ竴', '鍛ㄤ簩', '鍛ㄤ笁', '鍛ㄥ洓', '鍛ㄤ簲', '鍛ㄥ叚', '鍛ㄦ棩'],
+ axisLine: {
+ lineStyle: {
+ color: '#FFFFFF',
+ // width: 1
+ show: false
+ }
+ }
+ },
+ yAxis: {
+ type: 'value',
+ boundaryGap: [0, '100%'],
+ axisLine: {
+ lineStyle: {
+ color: '#FFFFFF',
+ width: 1
+ }
+ }
+ },
+ series: [
+ {
+ name: '妯℃嫙鏁版嵁',
+ type: 'line',
+ // showSymbol: false,
+ // hoverAnimation: false,
+ data: this.seriesData
+ },
+ {
+ name: '鑱旂洘骞垮憡',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [220, 182, 191, 234, 290, 330, 310]
+ },
+ {
+ name: '瑙嗛骞垮憡',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [150, 232, 201, 154, 190, 330, 410]
+ },
+ {
+ name: '鐩存帴璁块棶',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [320, 332, 301, 334, 390, 330, 320]
+ },
+ {
+ name: '鎼滅储寮曟搸',
+ type: 'line',
+ stack: '鎬婚噺',
+ data: [820, 932, 901, 934, 1290, 1330, 1320]
+ }
+ ]
+ }
+ this.myChart.setOption(option)
+ },
+ async echartsData () {
+ const addDays = dayjs().add(300, 'day')
+ const data = {
+ $tagCodeList: 'TJIP45.yyqAI90305,TJIP45.yyqAI90303,TJIP45.yyqFI_90310N,TJIP45.yyqAI90304,TJIP45.yyqAIR001',
+ $startTime: this.dayjs,
+ $endTime: addDays,
+ $step: 15
+ }
+ const result = await mapApi.DataItems(data)
+ this.result = result.data
+ for (let i = 0; i < result.length; i++) {
+ // // console.log(result[i])
+
+ // const seriesData = []
+ const aseries = []
+ // let nameData = ''
+
+ this.seriesData.push(result[i].ReadTime)
+ aseries.push(result[i].TagValue)
+ // nameData = result[i].UnionTagCode
+ this.aseries = result[i].UnionTagCode
+ }
+ this.myChart.setOption({
+ series: [{
+ data: this.seriesData
+ }]
+ })
+ },
+ // 鏁版嵁鐨勮姹�
+ requestEcharts () {
+ setInterval(async () => {
+ const addDays = dayjs().add(300, 'day')
+ const data = {
+ $tagCodeList: 'TJIP45.yyqAI90305,TJIP45.yyqAI90303,TJIP45.yyqFI_90310N,TJIP45.yyqAI90304,TJIP45.yyqAIR001',
+ $startTime: this.dayjs,
+ $endTime: addDays,
+ $step: 15
+ }
+ const result = await mapApi.DataItems(data)
+ this.result = result.data
+ for (let i = 0; i < result.length; i++) {
+ // // console.log(result[i])
+
+ // const seriesData = []
+ const aseries = []
+ // let nameData = ''
+
+ this.seriesData.push(result[i].ReadTime)
+ aseries.push(result[i].TagValue)
+ // nameData = result[i].UnionTagCode
+ this.aseries = result[i].UnionTagCode
+ }
+ this.myChart.setOption({
+ series: [{
+ data: this.seriesData
+ }]
+ })
+ }, 3000)
+ }
+ },
+ mounted () {
+ this.$nextTick(() => {
+ this.requestEcharts()
+ this.drawChart()
+ this.echartsData()
+ })
+ }
+}
+</script>
+
+<style scoped lang="less">
+.Infomation {
+ margin-left: 10px;
+ height: 0.2rem;
+}
+
+.el-tag {
+ height: 25px;
+ width: 140px;
+ line-height: 25px;
+ margin-right: 10px;
+ font-size: 10px;
+ background-color: rgba(0, 255, 246, 0.14);
+ color: #00d0f9;
+ border: none;
+ padding: 0 15px;
+}
+
+.form-echrts {
+ width: 100%;
+ height: 1rem;
+ border-top: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ .el-dialog-div {
+ //height: 50vh!important;
+ overflow: auto;
+ //overflow: hidden;
+ }
+
+ #echarts {
+ margin: 0;
+ padding: 0;
+ //height: 3rem;
+ //border: 1px solid #396d83;
+ //margin: 10px 10px 10px 10px;
+ }
+}
+</style>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
index a17a64a..b2788bb 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicChart.vue
@@ -1,36 +1,38 @@
<template>
- <div class="win">
- <div class="border_corner border_corner_left_top"></div>
- <div class="border_corner border_corner_right_top"></div>
- <div class="border_corner border_corner_left_bottom"></div>
- <div class="border_corner border_corner_right_bottom"></div>
- <ul class="tab">
- <li @click='tabTaggle("ECharts")'>瀹炴椂鏁版嵁</li>
- <li @click='tabTaggle("ECharts")'>灏忔椂鏁版嵁</li>
- <li @click='tabTaggle("ECharts")'>鏃ユ暟鎹�</li>
- <li @click='tabTaggle("ECharts")'>浜哄伐鏁版嵁</li>
- </ul>
- <component :is="currentTab" v-bind="$attrs"></component>
- </div>
+ <div class="win">
+ <div class="border_corner border_corner_left_top"></div>
+ <div class="border_corner border_corner_right_top"></div>
+ <div class="border_corner border_corner_left_bottom"></div>
+ <div class="border_corner border_corner_right_bottom"></div>
+ <ul class="tab">
+ <li @click='tabTaggle("ECharts")'>瀹炴椂鏁版嵁</li>
+ <li @click='tabTaggle("EChartsHour")'>灏忔椂鏁版嵁</li>
+ <li @click='tabTaggle("EChartsDate")'>鏃ユ暟鎹�</li>
+ <li @click='tabTaggle("ECharts")'>浜哄伐鏁版嵁</li>
+ </ul>
+ <component :is="currentTab" v-bind="$attrs"></component>
+ </div>
</template>
<script>
-import ECharts from './ECharts'
+import EChartsHour from './EChartsHour'
+import EChartsDate from './EChartsDate'
export default {
name: 'PublicChart',
components: {
- ECharts
+ EChartsHour,
+ EChartsDate
},
data () {
return {
- currentTab: 'ECharts'
+ currentTab: 'EChartsHour'
}
},
methods: {
tabTaggle (taggleMenu) {
this.currentTab = taggleMenu
- debugger
+ // debugger
}
}
}
@@ -46,10 +48,10 @@
.win {
position: relative;
- margin-bottom: 13px;
+ /*margin-bottom: 13px;*/
background-color: rgba(33, 41, 69, 0.9);
border: 0.8px solid #396d83;
- height: 1.5rem;
+ /*height: 1.5rem;*/
}
.border_corner {
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue
index 5da2a6f..0ca567b 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicDetailedList.vue
@@ -1,29 +1,31 @@
<template>
<div class="PublicDetailedList">
- <el-table :data="tableData" max-height="500px">
+ <el-table :data="tableData" max-height="500px" border>
+ <el-scrollbar style="height: 50vh">
<el-table-column prop="OnLineMonEmissPointName" label="鎺掓斁鐐�"></el-table-column>
<el-table-column prop="MonTimeStr" label="鐩戞祴鏃堕棿"></el-table-column>
<el-table-column label="姘哀鍖栫墿">
- <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
- <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)" width="60"></el-table-column>
</el-table-column>
<el-table-column label="浜屾哀鍖栫～">
- <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
- <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)" width="60"></el-table-column>
</el-table-column>
<el-table-column label="鐑熷皹">
- <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)"></el-table-column>
- <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)"></el-table-column>
- <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)"></el-table-column>
+ <el-table-column prop="MonQty" label="娴撳害(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="OrglQty" label="鎶樼畻鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="ConvertQty" label="鏍囧噯鍊�(mg/m鲁)" width="60"></el-table-column>
+ <el-table-column prop="EmissQty" label="鎺掓斁閲�(kg/h)" width="60"></el-table-column>
</el-table-column>
<el-table-column label="搴熸皵娴侀噺">
<el-table-column prop="StdValue" label="姘旈噺"></el-table-column>
</el-table-column>
+ </el-scrollbar>
</el-table>
</div>
</template>
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue
index fed1e41..65558af 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicTable.vue
@@ -7,8 +7,7 @@
<div class="border_corner border_corner_right_bottom"></div>
<div class="main">
<div class="main-table">
- <el-table :data="listData" style="width: 100%" stripe='stripe'
- tooltip-effect="dark" :row-class-name="tableRowClassName">
+ <el-table :data="listData" style="width: 100%" height="200px" :row-class-name="tableRowClassName">
<el-table-column v-for="(item, index) in listLabel" :key="index" :prop="item.prop"
:label="item.label"></el-table-column>
</el-table>
@@ -84,8 +83,6 @@
.win {
position: relative;
background-color: rgba(33, 41, 69, 0.9);
- //width: 6rem;
- height: 1.5rem;
}
.main {
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
index 3aa7f07..3df30bb 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicTabs.vue
@@ -14,7 +14,7 @@
<el-col :span="8">鐢熶骇鍗曚綅:{{ setWasteGasdata.porltName }}</el-col>
<el-col :span="8">鎺掓斁绫诲瀷鍚嶇О:{{ setWasteGasdata.MonTypeName }}</el-col>
</el-row>
- <el-row type="flex" class="row-bg" justify="space-around">
+ <el-row type="flex" class="row-bg row-item-two" justify="space-around">
<el-col :span="8">鎺掓斁鍘诲悜:{{ setWasteGasdata.EmissDirecti }}</el-col>
<el-col :span="18">鎺у埗绾у埆鍚嶇О:{{ setWasteGasdata.ContrLevelShowName }}</el-col>
<el-col :span="18">鍐�/澶栨帓鍙�:{{ setWasteGasdata.OrOutPortName }}</el-col>
@@ -36,7 +36,7 @@
<el-col :span="8">鐢熶骇鍗曚綅:{{ setWasteWaterdata.porltName }}</el-col>
<el-col :span="8">鎺掓斁绫诲瀷鍚嶇О:{{ setWasteWaterdata.MonTypeName }}</el-col>
</el-row>
- <el-row type="flex" class="row-bg" justify="space-around">
+ <el-row type="flex" class="row-bg row-item-two" justify="space-around">
<el-col :span="8">鎺掓斁鍘诲悜:{{ setWasteWaterdata.EmissDirecti }}</el-col>
<el-col :span="8">鎺у埗绾у埆鍚嶇О:{{ setWasteWaterdata.ContrLevelShowName }}</el-col>
<el-col :span="8">鍐�/澶栨帓鍙�:{{ setWasteWaterdata.OrOutPortName }}</el-col>
@@ -77,7 +77,7 @@
margin-bottom: 10px;
background-color: rgba(33, 41, 69, 0.9);
//width: 6rem;
- height: 0.5rem;
+ //height: 0.5rem;
}
.main {
@@ -87,25 +87,31 @@
.main-matter {
font-size: 13px;
font-weight: normal;
- //padding: 10px 6px;
+ padding: 0 6px;
border: 1px solid #396d83;
.row-item-one {
+ //flex-wrap: nowrap;
+ overflow: hidden;
+ margin-top: 6px;
margin-bottom: 7px;
+ //margin-left: 10px;
}
-
+ .row-item-two{
+ margin-bottom: 6px;
+ }
.el-row {
width: 100%;
color: #00d0f9;
display: flex;
font-size: 12px !important;
+ text-align: center;
.el-col {
+ text-align: center;
flex: 1;
width: 100%;
background-color: #243a55;
- text-align: center;
- line-height: 28px;
margin-left: 6px;
border-radius: 4px;
@@ -122,7 +128,7 @@
align-items: center;
justify-content: space-around;
flex-wrap: wrap;
- line-height: 35px;
+ line-height: 30px;
li {
text-align: center;
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue b/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue
index 426879e..1e67f2f 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/PublicVideo.vue
@@ -26,12 +26,13 @@
.win {
position: relative;
background-color: rgba(33, 41, 69, 0.9);
- height: 2.1rem;
+ //height: 2rem;
+ width: 3rem;
}
.main {
border: 1px solid #396d83;
- padding: 5px;
+ //padding: 5px;
height: 2rem;
video {
diff --git a/src/components/BaseNav/PublicBounced/PublicBounced.vue b/src/components/BaseNav/PublicBounced/PublicBounced.vue
index b8ab6bf..5a43649 100644
--- a/src/components/BaseNav/PublicBounced/PublicBounced.vue
+++ b/src/components/BaseNav/PublicBounced/PublicBounced.vue
@@ -1,5 +1,6 @@
<template>
<div class="public-bounced" v-drag v-if="flag">
+ <!-- <Echarts></Echarts>-->
<div class="public-bounced-title">
<span>{{ displayContentTitle }}</span>
<i class="el-icon-circle-close" @click="closePopup"></i>
@@ -13,44 +14,21 @@
:displayContentTable="displayContentTable"></public-table>
<public-chart v-else :getWasteGasDetails="getWasteGasDetails"
:value="value"
- :getWasteWaterMonitoring="getWasteWaterMonitoring"
- :getWasteWaterMonitoringDetails="getWasteWaterMonitoringDetails
-"></public-chart>
+ :getQueryOnlineMonData="getQueryOnlineMonData"
+ :getWasteWaterMonitoringDetails="getWasteWaterMonitoringDetails">
+ </public-chart>
</div>
</div>
<div class="public-bounced-content-right">
<public-video></public-video>
</div>
</div>
- <!-- <el-dialog-->
- <!-- :visible.sync="flag"-->
- <!-- width="70%"-->
- <!-- v-drag-->
- <!-- :modal="false">-->
- <!-- <div class="public-bounced-title">-->
- <!-- <span>{{ displayContentTitle }}</span>-->
- <!-- <i class="el-icon-circle-close" @click="closePopup"></i>-->
- <!-- </div>-->
- <!-- <div class="public-bounced-content">-->
- <!-- <div class="public-bounced-content-left">-->
- <!-- <public-tabs :displayContentTab="displayContentTab" :value="value"-->
- <!-- :setWasteGasdata="setWasteGasdata" :setWasteWaterdata="setWasteWaterdata"></public-tabs>-->
- <!-- <div class="public-bounced-content-left-bottom">-->
- <!-- <public-table v-if="value === 'gufei'"-->
- <!-- :displayContentTable="displayContentTable"></public-table>-->
- <!-- <public-chart v-else :getWasteGasDetails="getWasteGasDetails"-->
- <!-- :getWasteWaterMonitoring="getWasteWaterMonitoring"></public-chart>-->
- <!-- </div>-->
- <!-- </div>-->
- <!-- <div class="public-bounced-content-right">-->
- <!-- <public-video></public-video>-->
- <!-- </div>-->
- <!-- </div>-->
- <!-- </el-dialog>-->
</div>
</template>
<script>
+
+// import Echarts from '@components/BaseNav/PublicBounced/GasComponents/Echarts'
import '@/components/BaseNav/SolidWaste/directive/dir'
import PublicTabs from '@components/BaseNav/PublicBounced/GasComponents/PublicTabs'
@@ -61,6 +39,7 @@
export default {
name: 'PublicBounced',
components: {
+ // Echarts,
PublicTabs,
PublicTable,
PublicChart,
@@ -77,7 +56,7 @@
value: '',
getWasteGasDetails: [],
getWasteWaterMonitoringDetails: [],
- getWasteWaterMonitoring: []
+ getQueryOnlineMonData: []
}
},
methods: {
@@ -103,10 +82,10 @@
this.flag = true
this.value = value
},
- setWaterData (dataWater, dataDetail, drawData, value) {
+ setWaterData (dataWater, dataDetail, hourData, value) {
this.setWasteWaterdata = dataWater
// console.log(data)
- this.getWasteWaterMonitoring = drawData
+ this.getQueryOnlineMonData = hourData
// console.log(drawData)
this.getWasteWaterMonitoringDetails = dataDetail
this.displayContentTitle = dataWater.Name
@@ -119,14 +98,10 @@
<style lang="less" scoped>
.public-bounced {
- width: 10rem;
- //height: 2.6rem;
- //width: 70vw;
- //height: 30vh;
z-index: 999;
position: absolute;
- top: 5%;
- left: 5%;
+ top: 15%;
+ left: 20%;
background-color: #002432;
border: 1px #9fc5c8 solid;
@@ -153,17 +128,18 @@
}
.public-bounced-content {
- margin: 0.2rem auto !important;
+ padding: 0.1rem;
display: flex;
//align-items: center;
- justify-content: space-around;
+ //justify-content: space-around;
.public-bounced-content-left {
- width: 6.8rem;
+ //width: 4.8rem;
}
.public-bounced-content-right {
- width: 3rem;
+ //width: 3rem;
+ margin-left: 0.1rem;
}
}
}
diff --git a/src/components/LayerController/LayerController.vue b/src/components/LayerController/LayerController.vue
index ce4d496..fe80364 100644
--- a/src/components/LayerController/LayerController.vue
+++ b/src/components/LayerController/LayerController.vue
@@ -7,7 +7,7 @@
<!-- <span class="icon-name">鍥惧眰</span>-->
</div>
</el-tooltip>
- <transition name="animationChange">
+ <transition name="layerChange">
<div :class="'legend-content map-background'" v-show="layerControllerVisible">
<lc-service-layer></lc-service-layer>
<button @click="showPanel" type="button" class="el-button special-button el-button--default el-icon-d-arrow-left"></button>
@@ -74,14 +74,27 @@
</script>
<style lang="less">
- .animationChange-enter-active, .animationChange-leave-active {
+
+ .layerChange-enter-active {
+ transform-origin: top left;
+ animation: bounce-in .2s;
+ }
+ .layerChange-leave-active {
+ transform-origin: top left;
+ animation: bounce-in .2s reverse;
+ }
+ /*
+
+ .layerChange-enter-active,
+ .layerChange-leave-active {
transition: all 0.5s;
}
- .animationChange-enter, .animationChange-leave-to {
+ .layerChange-enter,
+ .layerChange-leave-to {
opacity: 0;
transform: translateX(-100px);
- }
+ }*/
.float-panel.active{
overflow: visible;
}
@@ -234,17 +247,26 @@
background: #0E3565;
}
.el-button--default{
- padding: 15px 3px;
- background:@background-color;
+ padding: 0;
+ background:@background-color4;
color:@color-tool;
position: absolute;
- top:0;
- left: 100%;
- margin-left: .02rem;
- border-radius: 0.03rem 50% 50% 0.03rem;
+ top:24px;
+ right:0.02rem;
+ border:none;//1px solid @color-tool;
+ width: 0.2rem;
+ height: 0.2rem;
+ text-align: center;
+ line-height: 0.2rem;
+ margin-top: -0.1rem;
+ border-radius: 50%;
+ // border-radius: 0.03rem 50% 50% 0.03rem;
}
.el-button--default:hover{
background:@background-color;
+ border:1px solid @color;
+ box-shadow: 0 0 2px @color;
+ color:@color;
}
.legend-content{
width: 1.79167rem;
diff --git a/src/components/LayerController/logic/Company.js b/src/components/LayerController/logic/Company.js
index ae08aa5..6c68380 100644
--- a/src/components/LayerController/logic/Company.js
+++ b/src/components/LayerController/logic/Company.js
@@ -2,7 +2,7 @@
* 鍥哄簾
*/
// 鍖哄垎涓嶅悓绫诲瀷 浣跨敤涓嶅悓img
-const companyImg = '/assets/images/map/company.png'
+const companyImg = '/assets/images/map/company_refining.png'
const mapApi = require('../../../api/mapApi').default
const AnimalService = require('../service/AnimalService').default
@@ -28,20 +28,29 @@
const positionY = data[i].Longitude
var iconUrl = companyImg
+ const htmls = '<div><img src="' + iconUrl + '"><ul><li>' + data[i].name + '</li><li>' + data[i].name + '</li><li>' + data[i].name + '</li><li>' + data[i].name + '</li><li>' + data[i].name + '</li><li>' + data[i].name + '</li></ul></div>'
+ var myIcon = L.divIcon({
+ html: htmls,
+ className: 'company-bindTooltip',
+ iconSize: 16
+ })
+
const marker = L.marker([positionX, positionY], {
- icon: L.icon({
+ /* icon: L.icon({
iconUrl: iconUrl,
iconSize: [30, 30],
- iconAnchor: [13, 5]
- }),
+ iconAnchor: [15, 15]
+ }), */
+ icon: myIcon,
test: data[i]
})
- marker.bindTooltip(data[i].name, {
+ /* const htmls = '<ul><li>' + data[i].name + '</li></ul>'
+ marker.bindTooltip(htmls, {
permanent: true,
- offset: [0, 14],
+ offset: [0, 5],
direction: 'bottom',
className: 'company-bindTooltip'
- })
+ }) */
layer.addLayer(marker)
}
}
diff --git a/src/components/LayerController/logic/SolidWaste.js b/src/components/LayerController/logic/SolidWaste.js
index ea995ac..91a6455 100644
--- a/src/components/LayerController/logic/SolidWaste.js
+++ b/src/components/LayerController/logic/SolidWaste.js
@@ -39,8 +39,8 @@
totransferData: getSolidWasteData[i],
icon: L.icon({
iconUrl: iconUrl,
- iconSize: [20, 20],
- iconAnchor: [10, 10]
+ iconSize: [30, 30],
+ iconAnchor: [15, 15]
})
})
layer.addLayer(marker)
diff --git a/src/components/LayerController/logic/WasteGas.js b/src/components/LayerController/logic/WasteGas.js
index 2ac1651..7db2156 100644
--- a/src/components/LayerController/logic/WasteGas.js
+++ b/src/components/LayerController/logic/WasteGas.js
@@ -40,8 +40,8 @@
test: data[i],
icon: L.icon({
iconUrl: iconUrl,
- iconSize: [20, 20],
- iconAnchor: [10, 10]
+ iconSize: [30, 38],
+ iconAnchor: [15, 19]
})
})
layer.addLayer(marker)
@@ -59,6 +59,16 @@
const dataValue = {
StoragePlaceId: e.layer.options.test.StoragePlaceId
}
+ // const GasOnlinedata = {
+ // onLineMonEmissPointId: 23,
+ // monItemId: 28,
+ // emissTypeld: 2,
+ // beginTime: 2020/0o4/0o6 15:13:20,
+ // endTime=2020/0o4/0o7;15:13:20,
+ // dataType:1
+ // }
+ // const Mondata = await mapApi.getWasteGasMonData(GasOnlinedata)
+ // console.log(Mondata)
const result = await mapApi.getWasteGasDetails(dataValue)
// console.log(result.Result.DataInfo)
const PublicBounced = window.Vue.extend(publicBounced)
diff --git a/src/components/LayerController/logic/WasteWater.js b/src/components/LayerController/logic/WasteWater.js
index c3bccaf..d8abe79 100644
--- a/src/components/LayerController/logic/WasteWater.js
+++ b/src/components/LayerController/logic/WasteWater.js
@@ -37,8 +37,8 @@
test: data[i],
icon: L.icon({
iconUrl: iconUrl,
- iconSize: [20, 20],
- iconAnchor: [10, 10]
+ iconSize: [35, 35],
+ iconAnchor: [18, 18]
})
})
layer.addLayer(marker)
@@ -55,12 +55,28 @@
const dataValue = {
StoragePlaceId: e.layer.options.test.StoragePlaceId
}
- const drawback = await mapApi.getWasteWaterMonitoring()
- console.log(drawback)
+ const hourValue = {
+ onLineMonEmissPointId: '23',
+ monItemId: '28,31',
+ beginTime: '2020-04-06 15:13:20',
+ endTime: '2020-04-07 15:13:20',
+ dataType: '2'
+ }
+ // const dateValue = {
+ // onLineMonEmissPointId: '23',
+ // monItemId: '28,31',
+ // beginTime: '2020-04-06 15:13:20',
+ // endTime: '2020-04-07',
+ // dataType: '1'
+ // }
+ const hourData = await mapApi.getQueryOnlineMonData(hourValue)
+ // const dateData = await mapApi.getQueryOnlineMonData(dateValue)
+ // const drawback = await mapApi.getWasteWaterMonitoring()
+ // console.log(drawback)
const result = await mapApi.getWasteWaterMonitoringDetails(dataValue)
const PublicBounced = window.Vue.extend(publicBounced)
const instance = new PublicBounced()
- instance.setWaterData(e.layer.options.test, result.Result.DataInfo, drawback.Result.DataInfo, 'feishui')
+ instance.setWaterData(e.layer.options.test, result.Result.DataInfo, hourData.Result.DataInfo, 'feishui')
// console.log(e.layer.options.test)
instance.$mount()
document.body.appendChild(instance.$el)
diff --git a/src/components/LayerController/modules/LcServiceLayer.vue b/src/components/LayerController/modules/LcServiceLayer.vue
index 3308d0e..f6af058 100644
--- a/src/components/LayerController/modules/LcServiceLayer.vue
+++ b/src/components/LayerController/modules/LcServiceLayer.vue
@@ -4,19 +4,19 @@
<div class="wms-panel">
<el-scrollbar class="wms-panel-scrollbar">
<div v-for="item in serviceLayers" :key="item.code" class="layerbox">
+ <i class="downUp el-icon-caret-bottom" @click="item.isShow=!item.isShow" :class="item.isShow?'':'active'" ></i><!-- el-icon-arrow-down -->
<!-- 涓�绾у浘灞傞亶鍘� -->
- <div style="padding-left:10px;padding-top:10px">
- <input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code"
- @change="swAllLayers(item)"/>{{ item.name }}
+ <div style="padding-left:25px;padding-top:10px;color:#fff">
+ <input type="checkbox" :name="'wmsLayer_'+item.code" :checked="item.checked" :value="item.code" @change="swAllLayers(item)"/>{{ item.name }}
</div>
- <div class="layerbox-item">
+ <div class="layerbox-item" v-show="item.isShow">
<!-- 浜岀骇鍥惧眰閬嶅巻 -->
<div class="basemap-layer-item" v-for="itm in item.layers" :key="itm.code">
<input type="checkbox"
:name="'wmsSublayers_'+item.code+'_'+itm.code"
:checked="itm.checked"
:value="itm.code"
- @change="swWmsLayer(itm)"/>{{ itm.name }}
+ @change="swAllLayers(itm)"/>{{ itm.name }}
<!-- 涓夌骇鍥惧眰閬嶅巻 -->
<div class="layerbox-item-3">
<div class="basemap-layer-item" v-for="layer in itm.layers" :key="layer.code">
@@ -24,7 +24,8 @@
:name="'wmsSublayers_'+item.code+'_'+layer.code"
:checked="layer.checked"
:value="layer.code"
- @change="swWmsLayer(layer)"/>{{ layer.name }}
+ @change="swAllLayers(layer)"/>
+ <span :style="'color:'+layer.color">{{ layer.name }}</span>
</div>
</div>
</div>
@@ -37,9 +38,7 @@
</template>
<script>
-import WfsHelper from '../../helpers/WfsHelper'
import LcServiceLayerFilter from '@components/LayerController/modules/LcServiceLayerFilter'
-import AjaxUtils from '../../../utils/AjaxUtils'
export default {
name: 'LcServiceLayer',
@@ -50,52 +49,33 @@
}
},
mounted () {
- // console.log('03姝ラ锛�', this.helper)
- this.updateServiceLayerList()
},
methods: {
swAllLayers (item) {
// eslint-disable-next-line no-debugger
item.checked = !item.checked
- for (let i = 0, len = item.layers.length; i < len; ++i) {
- item.layers[i].checked = item.checked
+ this.toggleLayer(item)
+ this.swLayers(item.layers, item.checked)
+ },
+ swLayers (layers, checked) {
+ if (layers) {
+ for (let i = 0, len = layers.length; i < len; ++i) {
+ var layer = layers[i]
+ layer.checked = checked
+ this.toggleLayer(layer)
+ if (layer.layers) {
+ this.swLayers(layer.layers, checked)
+ }
+ }
}
- this.updateWms()
},
- loadWfs () {
- var wfsHelper = new WfsHelper()
- wfsHelper.addTypeName('绠＄嚎鐐�')
- wfsHelper.addEquals('pipename', '鐮旂┒闄�01璺痀S000001')
-
- AjaxUtils.GetDataAsynByUrl(wfsHelper.getUrl(), {}, (res) => {
- console.log(res)
- })
- },
- swWmsLayer (itm) {
- itm.checked = !itm.checked
+ toggleLayer (itm) {
if (itm.checked) {
window.layerFactory.show(itm)
} else {
window.layerFactory.hide(itm)
}
// this.updateWms()
- },
- updateServiceLayerList () {
-
- },
- updateWms () {
- var mapConfig = this.mapConfig
- var wmsHelper = new WfsHelper()
- wmsHelper.initMapConfig(mapConfig)
- var wmsLayersMap = wmsHelper.getWmsLayersMap()
- for (var k in wmsLayersMap) {
- var layers = wmsLayersMap[k]
- var tileLayer = window.serviceLayerHelper.getTileLayer(k)
- if (tileLayer) {
- tileLayer.setParams({ layers: layers.join(',') }, false)
- tileLayer.setUrl(tileLayer.config.url, false)
- }
- }
}
}
}
@@ -117,6 +97,23 @@
}
.layerbox {
width: 100%;
+ position: relative;
+ .downUp{
+ position: absolute;
+ top:3px;
+ left: -2px;
+ height: 30px;
+ width: 30px;
+ text-align: center;
+ line-height: 30px;
+ cursor: pointer;
+ font-size: 20px;
+ transition: all 1.5s;
+ }
+ .downUp.active{
+ transform: rotate(-90deg);
+ }
+ .downUp:hover{font-size: 26px;font-weight: 900}
.layerbox-item {
padding-left: 30px;
padding-top: 5px;
diff --git a/src/components/LayerController/modules/LcServiceLayerFilter.vue b/src/components/LayerController/modules/LcServiceLayerFilter.vue
index 2e4d80d..9f36a5e 100644
--- a/src/components/LayerController/modules/LcServiceLayerFilter.vue
+++ b/src/components/LayerController/modules/LcServiceLayerFilter.vue
@@ -9,7 +9,7 @@
<div class="content">
<div v-for="filter in item.layers" :key="filter.code">
<input type="checkbox" :value="filter.code" :checked="filter.checked"
- @change="swSubFilter(item.url,filter)"><label
+ @change="swAllSubFilter(filter)"><label
:title="filter.name">{{filter.name}}</label>
</div>
</div>
@@ -20,7 +20,6 @@
</template>
<script>
-import { mapMutations } from 'vuex'
import { LayerSewersPoint } from '@src/conf/layers/LayerSewers'
export default {
@@ -43,12 +42,26 @@
}
},
methods: {
- ...mapMutations([]),
swAllSubFilter (item) {
+ // eslint-disable-next-line no-debugger
item.checked = !item.checked
- // window.serviceLayerHelper.loadLayers()
+ this.toggleLayer(item)
+ this.swLayers(item.layers, item.checked)
+ },
+ swLayers (layers, checked) {
+ if (layers) {
+ for (let i = 0, len = layers.length; i < len; ++i) {
+ var layer = layers[i]
+ layer.checked = checked
+ this.toggleLayer(layer)
+ if (layer.layers) {
+ this.swLayers(layer.layers, checked)
+ }
+ }
+ }
},
// todo 杩橀渶瑕佷紭鍖栵紝鍦ㄦ湁澶氫釜闇�瑕佸瓙鍥惧眰鐙珛寮圭獥鎯呭喌涓嬫棤鏁�
+ // 鐩戝惉涓婄骇鍥惧眰瀛樺湪鐙珛寮圭獥鐨勯�変腑鎯呭喌
toggle (serviceLayers) {
if (serviceLayers) {
for (var i = 0; i < serviceLayers.length; i++) {
@@ -76,8 +89,7 @@
}
}
},
- swSubFilter (url, item) {
- item.checked = !item.checked
+ toggleLayer (item) {
if (item.checked) {
window.layerFactory.show(item)
} else {
diff --git a/src/components/LayerController/service/WfsLayerService.js b/src/components/LayerController/service/WfsLayerService.js
index 3aae541..b263e46 100644
--- a/src/components/LayerController/service/WfsLayerService.js
+++ b/src/components/LayerController/service/WfsLayerService.js
@@ -45,9 +45,9 @@
fillColor: STYLES.FILL_COLOR,
color: STYLES.COLOR,
fillOpacity: STYLES.FILL_OPACITY,
- opacity: STYLES.OPACITY,
- dashArray: STYLES.DASH_ARRAY,
- dashSpeed: STYLES.DASH_SPPED
+ opacity: STYLES.OPACITY
+ // dashArray: STYLES.DASH_ARRAY,
+ // dashSpeed: STYLES.DASH_SPPED
}
},
pointToLayer: (geoJsonPoint, latlng) => {
diff --git a/src/components/panel/BaseNavMenuItem.vue b/src/components/panel/BaseNavMenuItem.vue
index 9b497ae..a525ec4 100644
--- a/src/components/panel/BaseNavMenuItem.vue
+++ b/src/components/panel/BaseNavMenuItem.vue
@@ -1,59 +1,59 @@
-<template>
- <div class="base-nav-menu">
- <template v-for="(item,index) in menuList">
- <template v-if="item.items && item.items.length">
- <el-submenu :index="item.index" :key="index">
- <template slot="title" v-if="item.icon">
- <img :src="item.icon" :title="item.label"/>
- </template>
- <template slot="title" v-else>{{ item.label }}</template>
- <base-nav-menu-item v-for="child in item.items" :key="child.title" :menuList='[child]'></base-nav-menu-item>
- </el-submenu>
- </template>
- <template v-else>
- <el-menu-item :index="item.index" :key="index">
- <!-- <el-radio></el-radio>-->
- {{ item.label }}
- </el-menu-item>
- </template>
- </template>
- </div>
-</template>
-
-<script>
-
-export default {
- name: 'BaseNavMenuItem',
- data () {
- return {}
- },
- props: {
- menuList: Array
- }
-}
-</script>
-
-<style lang="less" scoped>
-.el-menu--popup {
- min-width: 100px;
-}
-.base-nav-menu {
- height: 38px;
- display: flex;
- align-items: center;
- justify-content: center;
- outline: none;
- border: none;
- //margin-left: 20px;
- padding: 0;
- .el-menu--popup {
- min-width: 100px;
- }
-}
-
-.el-menu--horizontal {
- .el-menu--popup {
- min-width: 100px;
- }
-}
-</style>
+<template>
+ <div class="base-nav-menu">
+ <template v-for="(item,index) in menuList">
+ <template v-if="item.items && item.items.length">
+ <el-submenu :index="item.index" :key="index">
+ <template slot="title" v-if="item.icon">
+ <img :src="item.icon" :title="item.label"/>
+ </template>
+ <template slot="title" v-else>{{ item.label }}</template>
+ <base-nav-menu-item v-for="child in item.items" :key="child.title" :menuList='[child]'></base-nav-menu-item>
+ </el-submenu>
+ </template>
+ <template v-else>
+ <el-menu-item :index="item.index" :key="index">
+ <!-- <el-radio></el-radio>-->
+ {{ item.label }}
+ </el-menu-item>
+ </template>
+ </template>
+ </div>
+</template>
+
+<script>
+
+export default {
+ name: 'BaseNavMenuItem',
+ data () {
+ return {}
+ },
+ props: {
+ menuList: Array
+ }
+}
+</script>
+
+<style lang="less" scoped>
+.el-menu--popup {
+ min-width: 100px;
+}
+.base-nav-menu {
+ height: 38px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ outline: none;
+ border: none;
+ //margin-left: 20px;
+ padding: 0;
+ .el-menu--popup {
+ min-width: 100px;
+ }
+}
+
+.el-menu--horizontal {
+ .el-menu--popup {
+ min-width: 100px;
+ }
+}
+</style>
diff --git a/src/components/panel/RightSearchPanel.vue b/src/components/panel/RightSearchPanel.vue
index 30af0e3..28910bb 100644
--- a/src/components/panel/RightSearchPanel.vue
+++ b/src/components/panel/RightSearchPanel.vue
@@ -1,49 +1,47 @@
<template>
<div class="panel-right" v-show="isShow">
- <div class="panel-tab">
-<!-- <div v-for="item in topicMenu" :key="item.id" :title="item.name" class="tab-item" @click="handleGd"-->
-<!-- :class="{'B-TMT-tab-waybill-isActive': isWaybillHover}">-->
-<!-- <img :src="item.icon" style="width: 24px;height: 24px;"></div>-->
- <div class="container">
- <ul>
- <li style="text-align: right">
- <button type="button" class="el-button special-button el-button--default el-icon-d-arrow-right"></button>
- </li>
- </ul>
-
- <ul v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" >
- <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left">
- <li>
- <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
- </li>
- </el-tooltip>
- </ul>
- </div>
- </div>
-<!-- <div class="panel-fold-btn" >-->
-<!-- <div class="btn-stretch" @click="toggleMonitorPanel"></div>-->
-<!-- </div>-->
-
-<!-- <div class="panel-fold-btn" @click="toggleMonitorPanel" >-->
-<!-- <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>-->
-<!--<!– <div class="btn-stretch" v-if="isCollapse" </div>–>-->
-<!--<!– <div class="btn-shrink" v-else-if="!isCollapse" ></div>–>-->
-<!--<!– :style = "{width:isCollapse ? '290px' : '0px'}"–>-->
-<!-- </div>-->
-<!-- <div class="right-control" v-if="!isCollapse" >-->
- <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] " >
- <div class="panel-fold-btn" @click="toggleMonitorPanel">
-<!-- <div class="btn-stretch" v-if="isCollapse"></div>-->
-<!-- <div class="btn-shrink" v-else-if="!isCollapse"></div>-->
- <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>
- </div>
-
- <div :class="'search-container map-background'">
- <div class="el-message-box__content" style="padding:0 6px 6px 6px;font-size: 13px;">
- <component :title="title" :is="gcComp"></component>
- </div>
- </div>
- </div>
+ <transition name="searchPanelChange">
+ <div style=" display: inline-flex;">
+ <div class="panel-tab">
+ <div class="container">
+ <!-- <ul>
+ <li style="text-align: right">
+ <div @click="setSearchPanelChange" type="button" class="el-button special-button el-button--default">
+ <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
+ <i class=" el-icon-d-arrow-left" v-else ></i>
+ </div>
+ </li>
+ </ul> -->
+ <ul v-for="item in topicList" :key="item.name" :class="item.checked?'module-wrap map-btn-active':'module-wrap map-btn-unactive'" @click="()=>{selected(item)}" >
+ <el-tooltip :popper-class="'map-tooltip'" effect="dark" :content="item.name" placement="left">
+ <li>
+ <img src="../../assets/images/map-pages/icon/sl.png" class="icon">
+ </li>
+ </el-tooltip>
+ </ul>
+ </div>
+ </div>
+ <div class="right-control" :class="[{ 'unfold': !isCollapse },{ 'shrink': isCollapse }] " >
+ <div class="panel-fold-btn" @click="toggleMonitorPanel">
+ <div :class="[isCollapse? 'btn-stretch':'btn-shrink']" ></div>
+ </div>
+ <div :class="'search-container map-background'" v-show="selectGroup" >
+ <div @click="setSearchPanelChange" type="button" class="el-button special-button el-button--default ">
+ <i class=" el-icon-d-arrow-right" v-if="selectGroup"></i>
+ <i class=" el-icon-d-arrow-left" v-else ></i>
+ </div>
+ <div class="el-message-box__content" style="padding:0 6px 6px 6px;font-size: 13px;">
+ <component :title="title" :is="gcComp"></component>
+ </div>
+ </div>
+ </div>
+ </div>
+ </transition>
+ <!-- <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎼滅储" placement="left" v-show="!selectGroup">
+ <div :class="selectGroup === true ?'active-button':''" class="iconBtn" @click="setSearchPanelChange" style="position: absolute;top:0;right: 0" >
+ <i class="el-icon-search icon"></i>
+ </div>
+ </el-tooltip> -->
</div>
</template>
@@ -75,7 +73,8 @@
toggleMonitorStyle: 'right:0px',
title: '姹￠洦姘寸缃�',
- isCollapse: true
+ isCollapse: true,
+ selectGroup: true
}
},
computed: {},
@@ -98,9 +97,18 @@
handleClose (done) {
console.log(done)
},
+ setSearchPanelChange () {
+ this.selectGroup = !this.selectGroup
+ if (!this.selectGroup) {
+ this.topicList.forEach((itm) => {
+ itm.checked = false
+ })
+ }
+ },
selected (val) {
// console.log(val)
this.title = val.name
+ this.selectGroup = true
this.topicList.forEach((itm) => {
itm.checked = val.name === itm.name
})
@@ -180,7 +188,14 @@
</script>
<style lang="less">
-
+ .searchPanelChange-enter-active {
+ transform-origin: top right;
+ animation: bounce-in .2s;
+ }
+ .searchPanelChange-leave-active {
+ transform-origin: top right;
+ animation: bounce-in .2s reverse;
+ }
.search-container {
position: relative;
width: 1.79167rem;
@@ -247,16 +262,28 @@
// background-color: #061e51 !important;
// border: solid 1px #0e639e !important;
//}
- .el-button--default {
- padding: 15px 3px;
- background: rgba(0, 16, 30, 0.7);
- color: #C0C4CC;
- border-radius:50% 0.03rem 0.03rem 50% ;
+ .el-button--default.special-button {
+ padding: 0;
+ background:@background-color4;
+ color:@color-tool;
+ position: absolute;
+ top:24px;
+ right:0.02rem;
+ border:none;//1px solid @color-tool;
+ width: 0.2rem;
+ height: 0.2rem;
+ text-align: center;
+ line-height: 0.2rem;
+ margin-top: -0.1rem;
+ border-radius: 50%;
+ z-index: 999;
}
- .el-button--default:hover{
+ .el-button--default.special-button:hover{
background:@background-color;
+ border:1px solid @color;
+ box-shadow: 0 0 2px @color;
+ color:@color;
}
-
.el-form-item__label {
color: rgb(52, 224, 255);
color: @color;
diff --git a/src/components/panel/ToolBoxPanel.vue b/src/components/panel/ToolBoxPanel.vue
index 850d54c..9733c83 100644
--- a/src/components/panel/ToolBoxPanel.vue
+++ b/src/components/panel/ToolBoxPanel.vue
@@ -41,9 +41,9 @@
<!-- </div>-->
<lc-base-map v-show="item.index==='2'"></lc-base-map>
</el-popover>
- <el-button @click="changeSelect" class="special-button">
+ <!-- <el-button @click="changeSelect" class="special-button">
<i class="el-icon-d-arrow-left"></i>
- </el-button>
+ </el-button> -->
</el-row>
</transition>
</div>
@@ -382,12 +382,15 @@
},
changeSelect () {
this.selectGroup = false
- this.isShow = !this.isShow
- this.active = -1
},
changeSelectMouse () {
- this.selectGroup = true
- this.isShow = []
+ this.selectGroup = !this.selectGroup
+ if (this.selectGroup) {
+ this.isShow = []
+ } else {
+ this.isShow = !this.isShow
+ this.active = -1
+ }
}
}
}
@@ -489,8 +492,9 @@
.special-button {
width: 0.1362rem;
height: 0.2725rem;
- color: #C0C4CC;
- border-radius: 0.03rem 50% 50% 0.03rem;
+ background:@background-color4;
+ color:@color-tool;
+ border:1px solid @color-tool;
}
.special-button:hover{
color: #00fff6;
diff --git a/src/components/panel/bounced/TextBounced.vue b/src/components/panel/bounced/TextBounced.vue
index 6ccfe85..654f138 100644
--- a/src/components/panel/bounced/TextBounced.vue
+++ b/src/components/panel/bounced/TextBounced.vue
@@ -1,131 +1,131 @@
-<template>
- <div class="bounced-box">
- <ul>
- <li>
- <form action="" class="bounced-box-title">
- <span>鏂囧瓧鏍囨敞璁剧疆</span>
- <a @click="changeBounced()">X</a>
- </form>
- </li>
- <li>
- <form action="" class="bounced-box-content">
- <h6>鍐呭锛�</h6>
- <div><textarea v-model='bouncedText' @blur="ChangeText"></textarea></div>
- </form>
- </li>
- <li class="bounced-box-choose">
- <span>棰滆壊锛�</span>
- <select v-model='bouncedSelect' @click="changeLabelTextSelect()">
- <option v-for="(item,index) in selectOptions" :key="index" :value="item.value">{{ item.text }}</option>
- </select>
- </li>
- </ul>
- </div>
-</template>
-
-<script>
-
-import MakeTation from '@components/plugin/MakeTation'
-
-export default {
- name: 'TextBounced',
- data () {
- return {
- bouncedText: '',
- bouncedSelect: 'red',
- selectOptions: [
- {
- value: 'red',
- text: '绾㈣壊'
- },
- {
- value: 'blue',
- text: '钃濊壊'
- },
- {
- value: 'yellow',
- text: '榛勮壊'
- }
- ]
- }
- },
- methods: {
- changeBounced () {
- this.$emit('changeBounced', false)
- },
- changeLabelTextSelect () {
- // this.bouncedSelect = item
- console.log('鑾峰彇棰滆壊')
- MakeTation.setContentColor(this.bouncedSelect)
- },
- ChangeText () {
- MakeTation.setContentText(this.bouncedText)
- console.log(this.bouncedText)
- }
- }
-}
-</script>
-
-<style lang="less" scoped>
-.bounced-box {
- position: absolute;
- border: 1px solid grey;
- width: 150px;
- right: 5%;
- top: 238px;
- background-color: rgba(3, 28, 61, 0.8);
- color: white;
- cursor: default;
- left: 814px;
-
- ul {
- list-style: none;
- padding: 0;
- margin: 0;
-
- li {
- margin: 1rem 0;
- }
-
- .bounced-box-title {
- background-color: rgba(34, 83, 130, 0.8);
- cursor: move;
- display: flex;
- align-items: center;
- justify-content: space-around;
-
- a {
- color: white;
- cursor: pointer;
- }
- }
-
- .bounced-box-content {
- h6 {
- padding: 0;
- margin: 5px;
- }
-
- div {
- display: flex;
- align-items: center;
- justify-content: center;
-
- textarea {
- width: 90%;
- resize: none;
- outline: 0;
- border: 1px solid #a0b3d6;
- border-radius: 5px;
- }
- }
- }
-
- .bounced-box-choose {
- display: flex;
- align-items: center;
- justify-content: space-around;
- }
- }
-}
-</style>
+<template>
+ <div class="bounced-box">
+ <ul>
+ <li>
+ <form action="" class="bounced-box-title">
+ <span>鏂囧瓧鏍囨敞璁剧疆</span>
+ <a @click="changeBounced()">X</a>
+ </form>
+ </li>
+ <li>
+ <form action="" class="bounced-box-content">
+ <h6>鍐呭锛�</h6>
+ <div><textarea v-model='bouncedText' @blur="ChangeText"></textarea></div>
+ </form>
+ </li>
+ <li class="bounced-box-choose">
+ <span>棰滆壊锛�</span>
+ <select v-model='bouncedSelect' @click="changeLabelTextSelect()">
+ <option v-for="(item,index) in selectOptions" :key="index" :value="item.value">{{ item.text }}</option>
+ </select>
+ </li>
+ </ul>
+ </div>
+</template>
+
+<script>
+
+import MakeTation from '@components/plugin/MakeTation'
+
+export default {
+ name: 'TextBounced',
+ data () {
+ return {
+ bouncedText: '',
+ bouncedSelect: 'red',
+ selectOptions: [
+ {
+ value: 'red',
+ text: '绾㈣壊'
+ },
+ {
+ value: 'blue',
+ text: '钃濊壊'
+ },
+ {
+ value: 'yellow',
+ text: '榛勮壊'
+ }
+ ]
+ }
+ },
+ methods: {
+ changeBounced () {
+ this.$emit('changeBounced', false)
+ },
+ changeLabelTextSelect () {
+ // this.bouncedSelect = item
+ console.log('鑾峰彇棰滆壊')
+ MakeTation.setContentColor(this.bouncedSelect)
+ },
+ ChangeText () {
+ MakeTation.setContentText(this.bouncedText)
+ console.log(this.bouncedText)
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+.bounced-box {
+ position: absolute;
+ border: 1px solid grey;
+ width: 150px;
+ right: 5%;
+ top: 238px;
+ background-color: rgba(3, 28, 61, 0.8);
+ color: white;
+ cursor: default;
+ left: 814px;
+
+ ul {
+ list-style: none;
+ padding: 0;
+ margin: 0;
+
+ li {
+ margin: 1rem 0;
+ }
+
+ .bounced-box-title {
+ background-color: rgba(34, 83, 130, 0.8);
+ cursor: move;
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+
+ a {
+ color: white;
+ cursor: pointer;
+ }
+ }
+
+ .bounced-box-content {
+ h6 {
+ padding: 0;
+ margin: 5px;
+ }
+
+ div {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+
+ textarea {
+ width: 90%;
+ resize: none;
+ outline: 0;
+ border: 1px solid #a0b3d6;
+ border-radius: 5px;
+ }
+ }
+ }
+
+ .bounced-box-choose {
+ display: flex;
+ align-items: center;
+ justify-content: space-around;
+ }
+ }
+}
+</style>
diff --git a/src/components/plugin/DownLoad.js b/src/components/plugin/DownLoad.js
index b02ee30..ea0a919 100644
--- a/src/components/plugin/DownLoad.js
+++ b/src/components/plugin/DownLoad.js
@@ -1,705 +1,705 @@
-/* eslint-disable */
-const init = (L) => {
- !function (t, e) {
- 'object' == typeof exports && 'undefined' != typeof module ? e() : 'function' == typeof define && define.amd ? define(e) : e()
- }(0, function () {
- 'use strict'
-
- function t (t, e) {
- return e = { exports: {} }, t(e, e.exports), e.exports
- }
-
- var e = 'undefined' != typeof window ? window : 'undefined' != typeof global ? global : 'undefined' != typeof self ? self : {},
- n = t(function (t) {
- !function (e) {
- function n (t, e) {
- function n (t) {
- return e.bgcolor && (t.style.backgroundColor = e.bgcolor), e.width && (t.style.width = e.width + 'px'), e.height && (t.style.height = e.height + 'px'), e.style && Object.keys(e.style).forEach(function (n) {
- t.style[n] = e.style[n]
- }), t
- }
-
- return e = e || {}, s(e), Promise.resolve(t).then(function (t) {
- return u(t, e.filter, !0)
- }).then(c).then(d).then(n).then(function (n) {
- return g(n, e.width || h.width(t), e.height || h.height(t))
- })
- }
-
- function i (t, e) {
- return l(t, e || {}).then(function (e) {
- return e.getContext('2d').getImageData(0, 0, h.width(t), h.height(t)).data
- })
- }
-
- function o (t, e) {
- return l(t, e || {}).then(function (t) {
- return t.toDataURL()
- })
- }
-
- function r (t, e) {
- return e = e || {}, l(t, e).then(function (t) {
- return t.toDataURL('image/jpeg', e.quality || 1)
- })
- }
-
- function a (t, e) {
- return l(t, e || {}).then(h.canvasToBlob)
- }
-
- function s (t) {
- void 0 === t.imagePlaceholder ? w.impl.options.imagePlaceholder = M.imagePlaceholder : w.impl.options.imagePlaceholder = t.imagePlaceholder, void 0 === t.cacheBust ? w.impl.options.cacheBust = M.cacheBust : w.impl.options.cacheBust = t.cacheBust
- }
-
- function l (t, e) {
- function i (t) {
- var n = document.createElement('canvas')
- if (n.width = e.width || h.width(t), n.height = e.height || h.height(t), e.bgcolor) {
- var i = n.getContext('2d')
- i.fillStyle = e.bgcolor, i.fillRect(0, 0, n.width, n.height)
- }
- return n
- }
-
- return n(t, e).then(h.makeImage).then(h.delay(100)).then(function (e) {
- var n = i(t)
- return n.getContext('2d').drawImage(e, 0, 0), n
- })
- }
-
- function u (t, e, n) {
- function i (t) {
- return t instanceof HTMLCanvasElement ? h.makeImage(t.toDataURL()) : t.cloneNode(!1)
- }
-
- function o (t, e, n) {
- var i = t.childNodes
- return 0 === i.length ? Promise.resolve(e) : function (t, e, n) {
- var i = Promise.resolve()
- return e.forEach(function (e) {
- i = i.then(function () {
- return u(e, n)
- }).then(function (e) {
- e && t.appendChild(e)
- })
- }), i
- }(e, h.asArray(i), n).then(function () {
- return e
- })
- }
-
- function r (t, e) {
- function n () {
- !function (t, e) {
- t.cssText ? e.cssText = t.cssText : function (t, e) {
- h.asArray(t).forEach(function (n) {
- e.setProperty(n, t.getPropertyValue(n), t.getPropertyPriority(n))
- })
- }(t, e)
- }(window.getComputedStyle(t), e.style)
- }
-
- function i () {
- function n (n) {
- var i = window.getComputedStyle(t, n), o = i.getPropertyValue('content')
- if ('' !== o && 'none' !== o) {
- var r = h.uid()
- e.className = e.className + ' ' + r
- var a = document.createElement('style')
- a.appendChild(function (t, e, n) {
- var i = '.' + t + ':' + e, o = n.cssText ? function (t) {
- var e = t.getPropertyValue('content')
- return t.cssText + ' content: ' + e + ';'
- }(n) : function (t) {
- function e (e) {
- return e + ': ' + t.getPropertyValue(e) + (t.getPropertyPriority(e) ? ' !important' : '')
- }
-
- return h.asArray(t).map(e).join('; ') + ';'
- }(n)
- return document.createTextNode(i + '{' + o + '}')
- }(r, n, i)), e.appendChild(a)
- }
- }
-
- [':before', ':after'].forEach(function (t) {
- n(t)
- })
- }
-
- function o () {
- t instanceof HTMLTextAreaElement && (e.innerHTML = t.value), t instanceof HTMLInputElement && e.setAttribute('value', t.value)
- }
-
- function r () {
- e instanceof SVGElement && (e.setAttribute('xmlns', 'http://www.w3.org/2000/svg'), e instanceof SVGRectElement && ['width', 'height'].forEach(function (t) {
- var n = e.getAttribute(t)
- n && e.style.setProperty(t, n)
- }))
- }
-
- return e instanceof Element ? Promise.resolve().then(n).then(i).then(o).then(r).then(function () {
- return e
- }) : e
- }
-
- return n || !e || e(t) ? Promise.resolve(t).then(i).then(function (n) {
- return o(t, n, e)
- }).then(function (e) {
- return r(t, e)
- }) : Promise.resolve()
- }
-
- function c (t) {
- return p.resolveAll().then(function (e) {
- var n = document.createElement('style')
- return t.appendChild(n), n.appendChild(document.createTextNode(e)), t
- })
- }
-
- function d (t) {
- return f.inlineAll(t).then(function () {
- return t
- })
- }
-
- function g (t, e, n) {
- return Promise.resolve(t).then(function (t) {
- return t.setAttribute('xmlns', 'http://www.w3.org/1999/xhtml'), (new XMLSerializer).serializeToString(t)
- }).then(h.escapeXhtml).then(function (t) {
- return '<foreignObject x="0" y="0" width="100%" height="100%">' + t + '</foreignObject>'
- }).then(function (t) {
- return '<svg xmlns="http://www.w3.org/2000/svg" width="' + e + '" height="' + n + '">' + t + '</svg>'
- }).then(function (t) {
- return 'data:image/svg+xml;charset=utf-8,' + t
- })
- }
-
- var h = function () {
- function t () {
- var t = 'application/font-woff', e = 'image/jpeg'
- return {
- woff: t,
- woff2: t,
- ttf: 'application/font-truetype',
- eot: 'application/vnd.ms-fontobject',
- png: 'image/png',
- jpg: e,
- jpeg: e,
- gif: 'image/gif',
- tiff: 'image/tiff',
- svg: 'image/svg+xml'
- }
- }
-
- function e (t) {
- var e = /\.([^\.\/]*?)$/g.exec(t)
- return e ? e[1] : ''
- }
-
- function n (n) {
- var i = e(n).toLowerCase()
- return t()[i] || ''
- }
-
- function i (t) {
- return -1 !== t.search(/^(data:)/)
- }
-
- function o (t) {
- return new Promise(function (e) {
- for (var n = window.atob(t.toDataURL().split(',')[1]), i = n.length, o = new Uint8Array(i), r = 0; r < i; r++) o[r] = n.charCodeAt(r)
- e(new Blob([o], { type: 'image/png' }))
- })
- }
-
- function r (t) {
- return t.toBlob ? new Promise(function (e) {
- t.toBlob(e)
- }) : o(t)
- }
-
- function a (t, e) {
- var n = document.implementation.createHTMLDocument(), i = n.createElement('base')
- n.head.appendChild(i)
- var o = n.createElement('a')
- return n.body.appendChild(o), i.href = e, o.href = t, o.href
- }
-
- function s (t) {
- return new Promise(function (e, n) {
- var i = new Image
- i.onload = function () {
- e(i)
- }, i.onerror = n, i.src = t
- })
- }
-
- function l (t) {
- var e = 3e4
- return w.impl.options.cacheBust && (t += (/\?/.test(t) ? '&' : '?') + (new Date).getTime()), new Promise(function (n) {
- function i () {
- if (4 === a.readyState) {
- if (200 !== a.status) return void (s ? n(s) : r('cannot fetch resource: ' + t + ', status: ' + a.status))
- var e = new FileReader
- e.onloadend = function () {
- var t = e.result.split(/,/)[1]
- n(t)
- }, e.readAsDataURL(a.response)
- }
- }
-
- function o () {
- s ? n(s) : r('timeout of ' + e + 'ms occured while fetching resource: ' + t)
- }
-
- function r (t) {
- console.error(t), n('')
- }
-
- var a = new XMLHttpRequest
- a.onreadystatechange = i, a.ontimeout = o, a.responseType = 'blob', a.timeout = e, a.open('GET', t, !0), a.send()
- var s
- if (w.impl.options.imagePlaceholder) {
- var l = w.impl.options.imagePlaceholder.split(/,/)
- l && l[1] && (s = l[1])
- }
- })
- }
-
- function u (t, e) {
- return 'data:' + e + ';base64,' + t
- }
-
- function c (t) {
- return t.replace(/([.*+?^${}()|\[\]\/\\])/g, '\\$1')
- }
-
- function d (t) {
- return function (e) {
- return new Promise(function (n) {
- setTimeout(function () {
- n(e)
- }, t)
- })
- }
- }
-
- function g (t) {
- for (var e = [], n = t.length, i = 0; i < n; i++) e.push(t[i])
- return e
- }
-
- function h (t) {
- return t.replace(/#/g, '%23').replace(/\n/g, '%0A')
- }
-
- function m (t) {
- var e = f(t, 'border-left-width'), n = f(t, 'border-right-width')
- return t.scrollWidth + e + n
- }
-
- function p (t) {
- var e = f(t, 'border-top-width'), n = f(t, 'border-bottom-width')
- return t.scrollHeight + e + n
- }
-
- function f (t, e) {
- var n = window.getComputedStyle(t).getPropertyValue(e)
- return parseFloat(n.replace('px', ''))
- }
-
- return {
- escape: c,
- parseExtension: e,
- mimeType: n,
- dataAsUrl: u,
- isDataUrl: i,
- canvasToBlob: r,
- resolveUrl: a,
- getAndEncode: l,
- uid: function () {
- var t = 0
- return function () {
- return 'u' + function () {
- return ('0000' + (Math.random() * Math.pow(36, 4) << 0).toString(36)).slice(-4)
- }() + t++
- }
- }(),
- delay: d,
- asArray: g,
- escapeXhtml: h,
- makeImage: s,
- width: m,
- height: p
- }
- }(), m = function () {
- function t (t) {
- return -1 !== t.search(o)
- }
-
- function e (t) {
- for (var e, n = []; null !== (e = o.exec(t));) n.push(e[1])
- return n.filter(function (t) {
- return !h.isDataUrl(t)
- })
- }
-
- function n (t, e, n, i) {
- function o (t) {
- return new RegExp('(url\\([\'"]?)(' + h.escape(t) + ')([\'"]?\\))', 'g')
- }
-
- return Promise.resolve(e).then(function (t) {
- return n ? h.resolveUrl(t, n) : t
- }).then(i || h.getAndEncode).then(function (t) {
- return h.dataAsUrl(t, h.mimeType(e))
- }).then(function (n) {
- return t.replace(o(e), '$1' + n + '$3')
- })
- }
-
- function i (i, o, r) {
- return function () {
- return !t(i)
- }() ? Promise.resolve(i) : Promise.resolve(i).then(e).then(function (t) {
- var e = Promise.resolve(i)
- return t.forEach(function (t) {
- e = e.then(function (e) {
- return n(e, t, o, r)
- })
- }), e
- })
- }
-
- var o = /url\(['"]?([^'"]+?)['"]?\)/g
- return {
- inlineAll: i,
- shouldProcess: t,
- impl: {
- readUrls: e,
- inline: n
- }
- }
- }(), p = function () {
- function t () {
- return e(document).then(function (t) {
- return Promise.all(t.map(function (t) {
- return t.resolve()
- }))
- }).then(function (t) {
- return t.join('\n')
- })
- }
-
- function e () {
- function t (t) {
- return t.filter(function (t) {
- return t.type === CSSRule.FONT_FACE_RULE
- }).filter(function (t) {
- return m.shouldProcess(t.style.getPropertyValue('src'))
- })
- }
-
- function e (t) {
- var e = []
- return t.forEach(function (t) {
- try {
- h.asArray(t.cssRules || []).forEach(e.push.bind(e))
- } catch (e) {
- console.log('Error while reading CSS rules from ' + t.href, e.toString())
- }
- }), e
- }
-
- function n (t) {
- return {
- resolve: function () {
- var e = (t.parentStyleSheet || {}).href
- return m.inlineAll(t.cssText, e)
- },
- src: function () {
- return t.style.getPropertyValue('src')
- }
- }
- }
-
- return Promise.resolve(h.asArray(document.styleSheets)).then(e).then(t).then(function (t) {
- return t.map(n)
- })
- }
-
- return {
- resolveAll: t,
- impl: { readAll: e }
- }
- }(), f = function () {
- function t (t) {
- function e (e) {
- return h.isDataUrl(t.src) ? Promise.resolve() : Promise.resolve(t.src).then(e || h.getAndEncode).then(function (e) {
- return h.dataAsUrl(e, h.mimeType(t.src))
- }).then(function (e) {
- return new Promise(function (n, i) {
- t.onload = n, t.onerror = i, t.src = e
- })
- })
- }
-
- return { inline: e }
- }
-
- function e (n) {
- return n instanceof Element ? function (t) {
- var e = t.style.getPropertyValue('background')
- return e ? m.inlineAll(e).then(function (e) {
- t.style.setProperty('background', e, t.style.getPropertyPriority('background'))
- }).then(function () {
- return t
- }) : Promise.resolve(t)
- }(n).then(function () {
- return n instanceof HTMLImageElement ? t(n).inline() : Promise.all(h.asArray(n.childNodes).map(function (t) {
- return e(t)
- }))
- }) : Promise.resolve(n)
- }
-
- return {
- inlineAll: e,
- impl: { newImage: t }
- }
- }(), M = {
- imagePlaceholder: void 0,
- cacheBust: !1
- }, w = {
- toSvg: n,
- toPng: o,
- toJpeg: r,
- toBlob: a,
- toPixelData: i,
- impl: {
- fontFaces: p,
- images: f,
- util: h,
- inliner: m,
- options: {}
- }
- }
- t.exports = w
- }()
- }), i = t(function (t) {
- var n = n || function (t) {
- if (!(void 0 === t || 'undefined' != typeof navigator && /MSIE [1-9]\./.test(navigator.userAgent))) {
- var e = t.document, n = function () {
- return t.URL || t.webkitURL || t
- }, i = e.createElementNS('http://www.w3.org/1999/xhtml', 'a'), o = 'download' in i, r = function (t) {
- var e = new MouseEvent('click')
- t.dispatchEvent(e)
- }, a = /constructor/i.test(t.HTMLElement) || t.safari, s = /CriOS\/[\d]+/.test(navigator.userAgent),
- l = function (e) {
- (t.setImmediate || t.setTimeout)(function () {
- throw e
- }, 0)
- }, u = function (t) {
- var e = function () {
- 'string' == typeof t ? n().revokeObjectURL(t) : t.remove()
- }
- setTimeout(e, 4e4)
- }, c = function (t, e, n) {
- e = [].concat(e)
- for (var i = e.length; i--;) {
- var o = t['on' + e[i]]
- if ('function' == typeof o) {
- try {
- o.call(t, n || t)
- } catch (t) {
- l(t)
- }
- }
- }
- }, d = function (t) {
- return /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(t.type) ? new Blob([String.fromCharCode(65279), t], { type: t.type }) : t
- }, g = function (e, l, g) {
- g || (e = d(e))
- var h, m = this, p = e.type, f = 'application/octet-stream' === p, M = function () {
- c(m, 'writestart progress write writeend'.split(' '))
- }
- if (m.readyState = m.INIT, o) {
- return h = n().createObjectURL(e), void setTimeout(function () {
- i.href = h, i.download = l, r(i), M(), u(h), m.readyState = m.DONE
- })
- }
- !function () {
- if ((s || f && a) && t.FileReader) {
- var i = new FileReader
- return i.onloadend = function () {
- var e = s ? i.result : i.result.replace(/^data:[^;]*;/, 'data:attachment/file;')
- t.open(e, '_blank') || (t.location.href = e), e = void 0, m.readyState = m.DONE, M()
- }, i.readAsDataURL(e), void (m.readyState = m.INIT)
- }
- if (h || (h = n().createObjectURL(e)), f) {
- t.location.href = h
- } else {
- t.open(h, '_blank') || (t.location.href = h)
- }
- m.readyState = m.DONE, M(), u(h)
- }()
- }, h = g.prototype, m = function (t, e, n) {
- return new g(t, e || t.name || 'download', n)
- }
- return 'undefined' != typeof navigator && navigator.msSaveOrOpenBlob ? function (t, e, n) {
- return e = e || t.name || 'download', n || (t = d(t)), navigator.msSaveOrOpenBlob(t, e)
- } : (h.abort = function () {
- }, h.readyState = h.INIT = 0, h.WRITING = 1, h.DONE = 2, h.error = h.onwritestart = h.onprogress = h.onwrite = h.onabort = h.onerror = h.onwriteend = null, m)
- }
- }('undefined' != typeof self && self || 'undefined' != typeof window && window || e.content)
- t.exports && (t.exports.saveAs = n)
- })
- L.Control.EasyPrint = L.Control.extend({
- options: {
- title: 'Print map',
- position: 'topleft',
- sizeModes: ['Current'],
- filename: 'map',
- exportOnly: !1,
- hidden: !1,
- tileWait: 500,
- hideControlContainer: !0,
- customWindowTitle: window.document.title,
- spinnerBgCOlor: '#0DC5C1',
- customSpinnerClass: 'epLoader',
- defaultSizeTitles: {
- Current: 'Current Size',
- A4Landscape: 'A4 Landscape',
- A4Portrait: 'A4 Portrait'
- }
- },
- onAdd: function () {
- this.mapContainer = this._map.getContainer(), this.options.sizeModes = this.options.sizeModes.map(function (t) {
- return 'Current' === t ? {
- name: this.options.defaultSizeTitles.Current,
- className: 'CurrentSize'
- } : 'A4Landscape' === t ? {
- height: this._a4PageSize.height,
- width: this._a4PageSize.width,
- name: this.options.defaultSizeTitles.A4Landscape,
- className: 'A4Landscape page'
- } : 'A4Portrait' === t ? {
- height: this._a4PageSize.width,
- width: this._a4PageSize.height,
- name: this.options.defaultSizeTitles.A4Portrait,
- className: 'A4Portrait page'
- } : t
- }, this)
- var t = L.DomUtil.create('div', 'leaflet-control-easyPrint leaflet-bar leaflet-control')
- if (!this.options.hidden) {
- this._addCss(), L.DomEvent.addListener(t, 'mouseover', this._togglePageSizeButtons, this), L.DomEvent.addListener(t, 'mouseout', this._togglePageSizeButtons, this)
- var e = 'leaflet-control-easyPrint-button'
- this.options.exportOnly && (e += '-export'), this.link = L.DomUtil.create('a', e, t), this.link.id = 'leafletEasyPrint', this.link.title = this.options.title, this.holder = L.DomUtil.create('ul', 'easyPrintHolder', t), this.options.sizeModes.forEach(function (t) {
- var e = L.DomUtil.create('li', 'easyPrintSizeMode', this.holder)
- e.title = t.name
- L.DomUtil.create('a', t.className, e)
- L.DomEvent.addListener(e, 'click', this.printMap, this)
- }, this), L.DomEvent.disableClickPropagation(t)
- }
- return t
- },
- printMap: function (t, e) {
- e && (this.options.filename = e), this.options.exportOnly || (this._page = window.open('', '_blank', 'toolbar=no,status=no,menubar=no,scrollbars=no,resizable=no,left=10, top=10, width=200, height=250, visible=none'), this._page.document.write(this._createSpinner(this.options.customWindowTitle, this.options.customSpinnerClass, this.options.spinnerBgCOlor))), this.originalState = {
- mapWidth: this.mapContainer.style.width,
- widthWasAuto: !1,
- widthWasPercentage: !1,
- mapHeight: this.mapContainer.style.height,
- zoom: this._map.getZoom(),
- center: this._map.getCenter()
- }, 'auto' === this.originalState.mapWidth ? (this.originalState.mapWidth = this._map.getSize().x + 'px', this.originalState.widthWasAuto = !0) : this.originalState.mapWidth.includes('%') && (this.originalState.percentageWidth = this.originalState.mapWidth, this.originalState.widthWasPercentage = !0, this.originalState.mapWidth = this._map.getSize().x + 'px'), this._map.fire('easyPrint-start', { event: t }), this.options.hidden || this._togglePageSizeButtons({ type: null }), this.options.hideControlContainer && this._toggleControls()
- var n = 'string' != typeof t ? t.target.className : t
- if ('CurrentSize' === n) return this._printOpertion(n)
- this.outerContainer = this._createOuterContainer(this.mapContainer), this.originalState.widthWasAuto && (this.outerContainer.style.width = this.originalState.mapWidth), this._createImagePlaceholder(n)
- },
- _createImagePlaceholder: function (t) {
- var e = this
- n.toPng(this.mapContainer, {
- width: parseInt(this.originalState.mapWidth.replace('px')),
- height: parseInt(this.originalState.mapHeight.replace('px'))
- }).then(function (n) {
- e.blankDiv = document.createElement('div')
- var i = e.blankDiv
- e.outerContainer.parentElement.insertBefore(i, e.outerContainer), i.className = 'epHolder', i.style.backgroundImage = 'url("' + n + '")', i.style.position = 'absolute', i.style.zIndex = 1011, i.style.display = 'initial', i.style.width = e.originalState.mapWidth, i.style.height = e.originalState.mapHeight, e._resizeAndPrintMap(t)
- }).catch(function (t) {
- console.error('oops, something went wrong!', t)
- })
- },
- _resizeAndPrintMap: function (t) {
- this.outerContainer.style.opacity = 0
- var e = this.options.sizeModes.filter(function (e) {
- return e.className === t
- })
- e = e[0], this.mapContainer.style.width = e.width + 'px', this.mapContainer.style.height = e.height + 'px', this.mapContainer.style.width > this.mapContainer.style.height ? this.orientation = 'portrait' : this.orientation = 'landscape', this._map.setView(this.originalState.center), this._map.setZoom(this.originalState.zoom), this._map.invalidateSize(), this.options.tileLayer ? this._pausePrint(t) : this._printOpertion(t)
- },
- _pausePrint: function (t) {
- var e = this, n = setInterval(function () {
- e.options.tileLayer.isLoading() || (clearInterval(n), e._printOpertion(t))
- }, e.options.tileWait)
- },
- _printOpertion: function (t) {
- var e = this, o = this.mapContainer.style.width;
- (this.originalState.widthWasAuto && 'CurrentSize' === t || this.originalState.widthWasPercentage && 'CurrentSize' === t) && (o = this.originalState.mapWidth), n.toPng(e.mapContainer, {
- width: parseInt(o),
- height: parseInt(e.mapContainer.style.height.replace('px'))
- }).then(function (t) {
- var n = e._dataURItoBlob(t)
- e.options.exportOnly ? i.saveAs(n, e.options.filename + '.png') : e._sendToBrowserPrint(t, e.orientation), e._toggleControls(!0), e.outerContainer && (e.originalState.widthWasAuto ? e.mapContainer.style.width = 'auto' : e.originalState.widthWasPercentage ? e.mapContainer.style.width = e.originalState.percentageWidth : e.mapContainer.style.width = e.originalState.mapWidth, e.mapContainer.style.height = e.originalState.mapHeight, e._removeOuterContainer(e.mapContainer, e.outerContainer, e.blankDiv), e._map.invalidateSize(), e._map.setView(e.originalState.center), e._map.setZoom(e.originalState.zoom)), e._map.fire('easyPrint-finished')
- }).catch(function (t) {
- console.error('Print operation failed', t)
- })
- },
- _sendToBrowserPrint: function (t, e) {
- this._page.resizeTo(600, 800)
- var n = this._createNewWindow(t, e, this)
- this._page.document.body.innerHTML = '', this._page.document.write(n), this._page.document.close()
- },
- _createSpinner: function (t, e, n) {
- return '<html><head><title>' + t + '</title></head><body><style>\n body{\n background: ' + n + ';\n }\n .epLoader,\n .epLoader:before,\n .epLoader:after {\n border-radius: 50%;\n }\n .epLoader {\n color: #ffffff;\n font-size: 11px;\n text-indent: -99999em;\n margin: 55px auto;\n position: relative;\n width: 10em;\n height: 10em;\n box-shadow: inset 0 0 0 1em;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n }\n .epLoader:before,\n .epLoader:after {\n position: absolute;\n content: \'\';\n }\n .epLoader:before {\n width: 5.2em;\n height: 10.2em;\n background: #0dc5c1;\n border-radius: 10.2em 0 0 10.2em;\n top: -0.1em;\n left: -0.1em;\n -webkit-transform-origin: 5.2em 5.1em;\n transform-origin: 5.2em 5.1em;\n -webkit-animation: load2 2s infinite ease 1.5s;\n animation: load2 2s infinite ease 1.5s;\n }\n .epLoader:after {\n width: 5.2em;\n height: 10.2em;\n background: #0dc5c1;\n border-radius: 0 10.2em 10.2em 0;\n top: -0.1em;\n left: 5.1em;\n -webkit-transform-origin: 0px 5.1em;\n transform-origin: 0px 5.1em;\n -webkit-animation: load2 2s infinite ease;\n animation: load2 2s infinite ease;\n }\n @-webkit-keyframes load2 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n @keyframes load2 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n </style>\n <div class="' + e + '">Loading...</div></body></html>'
- },
- _createNewWindow: function (t, e, n) {
- return '<html><head>\n <style>@media print {\n img { max-width: 98%!important; max-height: 98%!important; }\n @page { size: ' + e + ';}}\n </style>\n <script>function step1(){\n setTimeout(\'step2()\', 10);}\n function step2(){window.print();window.close()}\n <\/script></head><body onload=\'step1()\'>\n <img src="' + t + '" style="display:block; margin:auto;"></body></html>'
- },
- _createOuterContainer: function (t) {
- var e = document.createElement('div')
- return t.parentNode.insertBefore(e, t), t.parentNode.removeChild(t), e.appendChild(t), e.style.width = t.style.width, e.style.height = t.style.height, e.style.display = 'inline-block', e.style.overflow = 'hidden', e
- },
- _removeOuterContainer: function (t, e, n) {
- e.parentNode && (e.parentNode.insertBefore(t, e), e.parentNode.removeChild(n), e.parentNode.removeChild(e))
- },
- _addCss: function () {
- var t = document.createElement('style')
- t.type = 'text/css', t.innerHTML = '.leaflet-control-easyPrint-button { \n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8cGF0aCBkPSJNMTI4LDMyaDI1NnY2NEgxMjhWMzJ6IE00ODAsMTI4SDMyYy0xNy42LDAtMzIsMTQuNC0zMiwzMnYxNjBjMCwxNy42LDE0LjM5OCwzMiwzMiwzMmg5NnYxMjhoMjU2VjM1Mmg5NiAgIGMxNy42LDAsMzItMTQuNCwzMi0zMlYxNjBDNTEyLDE0Mi40LDQ5Ny42LDEyOCw0ODAsMTI4eiBNMzUyLDQ0OEgxNjBWMjg4aDE5MlY0NDh6IE00ODcuMTk5LDE3NmMwLDEyLjgxMy0xMC4zODcsMjMuMi0yMy4xOTcsMjMuMiAgIGMtMTIuODEyLDAtMjMuMjAxLTEwLjM4Ny0yMy4yMDEtMjMuMnMxMC4zODktMjMuMiwyMy4xOTktMjMuMkM0NzYuODE0LDE1Mi44LDQ4Ny4xOTksMTYzLjE4Nyw0ODcuMTk5LDE3NnoiIGZpbGw9IiMwMDAwMDAiLz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K);\n background-size: 16px 16px; \n cursor: pointer; \n }\n .leaflet-control-easyPrint-button-export { \n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDQzMy41IDQzMy41IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0MzMuNSA0MzMuNTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxnIGlkPSJmaWxlLWRvd25sb2FkIj4KCQk8cGF0aCBkPSJNMzk1LjI1LDE1M2gtMTAyVjBoLTE1M3YxNTNoLTEwMmwxNzguNSwxNzguNUwzOTUuMjUsMTUzeiBNMzguMjUsMzgyLjV2NTFoMzU3di01MUgzOC4yNXoiIGZpbGw9IiMwMDAwMDAiLz4KCTwvZz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K);\n background-size: 16px 16px; \n cursor: pointer; \n }\n .easyPrintHolder a {\n background-size: 16px 16px;\n cursor: pointer;\n }\n .easyPrintHolder .CurrentSize{\n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTZweCIgdmVyc2lvbj0iMS4xIiBoZWlnaHQ9IjE2cHgiIHZpZXdCb3g9IjAgMCA2NCA2NCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNjQgNjQiPgogIDxnPgogICAgPGcgZmlsbD0iIzFEMUQxQiI+CiAgICAgIDxwYXRoIGQ9Ik0yNS4yNTUsMzUuOTA1TDQuMDE2LDU3LjE0NVY0Ni41OWMwLTEuMTA4LTAuODk3LTIuMDA4LTIuMDA4LTIuMDA4QzAuODk4LDQ0LjU4MiwwLDQ1LjQ4MSwwLDQ2LjU5djE1LjQwMiAgICBjMCwwLjI2MSwwLjA1MywwLjUyMSwwLjE1NSwwLjc2N2MwLjIwMywwLjQ5MiwwLjU5NCwwLjg4MiwxLjA4NiwxLjA4N0MxLjQ4Niw2My45NDcsMS43NDcsNjQsMi4wMDgsNjRoMTUuNDAzICAgIGMxLjEwOSwwLDIuMDA4LTAuODk4LDIuMDA4LTIuMDA4cy0wLjg5OC0yLjAwOC0yLjAwOC0yLjAwOEg2Ljg1NWwyMS4yMzgtMjEuMjRjMC43ODQtMC43ODQsMC43ODQtMi4wNTUsMC0yLjgzOSAgICBTMjYuMDM5LDM1LjEyMSwyNS4yNTUsMzUuOTA1eiIgZmlsbD0iIzAwMDAwMCIvPgogICAgICA8cGF0aCBkPSJtNjMuODQ1LDEuMjQxYy0wLjIwMy0wLjQ5MS0wLjU5NC0wLjg4Mi0xLjA4Ni0xLjA4Ny0wLjI0NS0wLjEwMS0wLjUwNi0wLjE1NC0wLjc2Ny0wLjE1NGgtMTUuNDAzYy0xLjEwOSwwLTIuMDA4LDAuODk4LTIuMDA4LDIuMDA4czAuODk4LDIuMDA4IDIuMDA4LDIuMDA4aDEwLjU1NmwtMjEuMjM4LDIxLjI0Yy0wLjc4NCwwLjc4NC0wLjc4NCwyLjA1NSAwLDIuODM5IDAuMzkyLDAuMzkyIDAuOTA2LDAuNTg5IDEuNDIsMC41ODlzMS4wMjctMC4xOTcgMS40MTktMC41ODlsMjEuMjM4LTIxLjI0djEwLjU1NWMwLDEuMTA4IDAuODk3LDIuMDA4IDIuMDA4LDIuMDA4IDEuMTA5LDAgMi4wMDgtMC44OTkgMi4wMDgtMi4wMDh2LTE1LjQwMmMwLTAuMjYxLTAuMDUzLTAuNTIyLTAuMTU1LTAuNzY3eiIgZmlsbD0iIzAwMDAwMCIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+Cg==)\n }\n .easyPrintHolder .page {\n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTguMS4xLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQ0NC44MzMgNDQ0LjgzMyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQ0LjgzMyA0NDQuODMzOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4Ij4KPGc+Cgk8Zz4KCQk8cGF0aCBkPSJNNTUuMjUsNDQ0LjgzM2gzMzQuMzMzYzkuMzUsMCwxNy03LjY1LDE3LTE3VjEzOS4xMTdjMC00LjgxNy0xLjk4My05LjM1LTUuMzgzLTEyLjQ2N0wyNjkuNzMzLDQuNTMzICAgIEMyNjYuNjE3LDEuNywyNjIuMzY3LDAsMjU4LjExNywwSDU1LjI1Yy05LjM1LDAtMTcsNy42NS0xNywxN3Y0MTAuODMzQzM4LjI1LDQzNy4xODMsNDUuOSw0NDQuODMzLDU1LjI1LDQ0NC44MzN6ICAgICBNMzcyLjU4MywxNDYuNDgzdjAuODVIMjU2LjQxN3YtMTA4LjhMMzcyLjU4MywxNDYuNDgzeiBNNzIuMjUsMzRoMTUwLjE2N3YxMzAuMzMzYzAsOS4zNSw3LjY1LDE3LDE3LDE3aDEzMy4xNjd2MjI5LjVINzIuMjVWMzR6ICAgICIgZmlsbD0iIzAwMDAwMCIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=);\n }\n .easyPrintHolder .A4Landscape { \n transform: rotate(-90deg);\n }\n\n .leaflet-control-easyPrint-button{\n display: inline-block;\n }\n .easyPrintHolder{\n margin-top:-31px;\n margin-bottom: -5px;\n margin-left: 30px;\n padding-left: 0px;\n display: none;\n }\n\n .easyPrintSizeMode {\n display: inline-block;\n }\n .easyPrintHolder .easyPrintSizeMode a {\n border-radius: 0px;\n }\n\n .easyPrintHolder .easyPrintSizeMode:last-child a{\n border-top-right-radius: 2px;\n border-bottom-right-radius: 2px;\n margin-left: -1px;\n }\n\n .easyPrintPortrait:hover, .easyPrintLandscape:hover{\n background-color: #757570;\n cursor: pointer;\n }', document.body.appendChild(t)
- },
- _dataURItoBlob: function (t) {
- for (var e = atob(t.split(',')[1]), n = t.split(',')[0].split(':')[1].split(';')[0], i = new ArrayBuffer(e.length), o = new DataView(i), r = 0; r < e.length; r++) o.setUint8(r, e.charCodeAt(r))
- return new Blob([i], { type: n })
- },
- _togglePageSizeButtons: function (t) {
- var e = this.holder.style, n = this.link.style
- 'mouseover' === t.type ? (e.display = 'block', n.borderTopRightRadius = '0', n.borderBottomRightRadius = '0') : (e.display = 'none', n.borderTopRightRadius = '2px', n.borderBottomRightRadius = '2px')
- },
- _toggleControls: function (t) {
- var e = document.getElementsByClassName('leaflet-control-container')[0]
- if (t) return e.style.display = 'block'
- e.style.display = 'none'
- },
- _a4PageSize: {
- height: 715,
- width: 1045
- }
- }), L.easyPrint = function (t) {
- return new L.Control.EasyPrint(t)
- }
- })
-//# sourceMappingURL=bundle.js.map
-}
-
-export default {
- init
-}
+/* eslint-disable */
+const init = (L) => {
+ !function (t, e) {
+ 'object' == typeof exports && 'undefined' != typeof module ? e() : 'function' == typeof define && define.amd ? define(e) : e()
+ }(0, function () {
+ 'use strict'
+
+ function t (t, e) {
+ return e = { exports: {} }, t(e, e.exports), e.exports
+ }
+
+ var e = 'undefined' != typeof window ? window : 'undefined' != typeof global ? global : 'undefined' != typeof self ? self : {},
+ n = t(function (t) {
+ !function (e) {
+ function n (t, e) {
+ function n (t) {
+ return e.bgcolor && (t.style.backgroundColor = e.bgcolor), e.width && (t.style.width = e.width + 'px'), e.height && (t.style.height = e.height + 'px'), e.style && Object.keys(e.style).forEach(function (n) {
+ t.style[n] = e.style[n]
+ }), t
+ }
+
+ return e = e || {}, s(e), Promise.resolve(t).then(function (t) {
+ return u(t, e.filter, !0)
+ }).then(c).then(d).then(n).then(function (n) {
+ return g(n, e.width || h.width(t), e.height || h.height(t))
+ })
+ }
+
+ function i (t, e) {
+ return l(t, e || {}).then(function (e) {
+ return e.getContext('2d').getImageData(0, 0, h.width(t), h.height(t)).data
+ })
+ }
+
+ function o (t, e) {
+ return l(t, e || {}).then(function (t) {
+ return t.toDataURL()
+ })
+ }
+
+ function r (t, e) {
+ return e = e || {}, l(t, e).then(function (t) {
+ return t.toDataURL('image/jpeg', e.quality || 1)
+ })
+ }
+
+ function a (t, e) {
+ return l(t, e || {}).then(h.canvasToBlob)
+ }
+
+ function s (t) {
+ void 0 === t.imagePlaceholder ? w.impl.options.imagePlaceholder = M.imagePlaceholder : w.impl.options.imagePlaceholder = t.imagePlaceholder, void 0 === t.cacheBust ? w.impl.options.cacheBust = M.cacheBust : w.impl.options.cacheBust = t.cacheBust
+ }
+
+ function l (t, e) {
+ function i (t) {
+ var n = document.createElement('canvas')
+ if (n.width = e.width || h.width(t), n.height = e.height || h.height(t), e.bgcolor) {
+ var i = n.getContext('2d')
+ i.fillStyle = e.bgcolor, i.fillRect(0, 0, n.width, n.height)
+ }
+ return n
+ }
+
+ return n(t, e).then(h.makeImage).then(h.delay(100)).then(function (e) {
+ var n = i(t)
+ return n.getContext('2d').drawImage(e, 0, 0), n
+ })
+ }
+
+ function u (t, e, n) {
+ function i (t) {
+ return t instanceof HTMLCanvasElement ? h.makeImage(t.toDataURL()) : t.cloneNode(!1)
+ }
+
+ function o (t, e, n) {
+ var i = t.childNodes
+ return 0 === i.length ? Promise.resolve(e) : function (t, e, n) {
+ var i = Promise.resolve()
+ return e.forEach(function (e) {
+ i = i.then(function () {
+ return u(e, n)
+ }).then(function (e) {
+ e && t.appendChild(e)
+ })
+ }), i
+ }(e, h.asArray(i), n).then(function () {
+ return e
+ })
+ }
+
+ function r (t, e) {
+ function n () {
+ !function (t, e) {
+ t.cssText ? e.cssText = t.cssText : function (t, e) {
+ h.asArray(t).forEach(function (n) {
+ e.setProperty(n, t.getPropertyValue(n), t.getPropertyPriority(n))
+ })
+ }(t, e)
+ }(window.getComputedStyle(t), e.style)
+ }
+
+ function i () {
+ function n (n) {
+ var i = window.getComputedStyle(t, n), o = i.getPropertyValue('content')
+ if ('' !== o && 'none' !== o) {
+ var r = h.uid()
+ e.className = e.className + ' ' + r
+ var a = document.createElement('style')
+ a.appendChild(function (t, e, n) {
+ var i = '.' + t + ':' + e, o = n.cssText ? function (t) {
+ var e = t.getPropertyValue('content')
+ return t.cssText + ' content: ' + e + ';'
+ }(n) : function (t) {
+ function e (e) {
+ return e + ': ' + t.getPropertyValue(e) + (t.getPropertyPriority(e) ? ' !important' : '')
+ }
+
+ return h.asArray(t).map(e).join('; ') + ';'
+ }(n)
+ return document.createTextNode(i + '{' + o + '}')
+ }(r, n, i)), e.appendChild(a)
+ }
+ }
+
+ [':before', ':after'].forEach(function (t) {
+ n(t)
+ })
+ }
+
+ function o () {
+ t instanceof HTMLTextAreaElement && (e.innerHTML = t.value), t instanceof HTMLInputElement && e.setAttribute('value', t.value)
+ }
+
+ function r () {
+ e instanceof SVGElement && (e.setAttribute('xmlns', 'http://www.w3.org/2000/svg'), e instanceof SVGRectElement && ['width', 'height'].forEach(function (t) {
+ var n = e.getAttribute(t)
+ n && e.style.setProperty(t, n)
+ }))
+ }
+
+ return e instanceof Element ? Promise.resolve().then(n).then(i).then(o).then(r).then(function () {
+ return e
+ }) : e
+ }
+
+ return n || !e || e(t) ? Promise.resolve(t).then(i).then(function (n) {
+ return o(t, n, e)
+ }).then(function (e) {
+ return r(t, e)
+ }) : Promise.resolve()
+ }
+
+ function c (t) {
+ return p.resolveAll().then(function (e) {
+ var n = document.createElement('style')
+ return t.appendChild(n), n.appendChild(document.createTextNode(e)), t
+ })
+ }
+
+ function d (t) {
+ return f.inlineAll(t).then(function () {
+ return t
+ })
+ }
+
+ function g (t, e, n) {
+ return Promise.resolve(t).then(function (t) {
+ return t.setAttribute('xmlns', 'http://www.w3.org/1999/xhtml'), (new XMLSerializer).serializeToString(t)
+ }).then(h.escapeXhtml).then(function (t) {
+ return '<foreignObject x="0" y="0" width="100%" height="100%">' + t + '</foreignObject>'
+ }).then(function (t) {
+ return '<svg xmlns="http://www.w3.org/2000/svg" width="' + e + '" height="' + n + '">' + t + '</svg>'
+ }).then(function (t) {
+ return 'data:image/svg+xml;charset=utf-8,' + t
+ })
+ }
+
+ var h = function () {
+ function t () {
+ var t = 'application/font-woff', e = 'image/jpeg'
+ return {
+ woff: t,
+ woff2: t,
+ ttf: 'application/font-truetype',
+ eot: 'application/vnd.ms-fontobject',
+ png: 'image/png',
+ jpg: e,
+ jpeg: e,
+ gif: 'image/gif',
+ tiff: 'image/tiff',
+ svg: 'image/svg+xml'
+ }
+ }
+
+ function e (t) {
+ var e = /\.([^\.\/]*?)$/g.exec(t)
+ return e ? e[1] : ''
+ }
+
+ function n (n) {
+ var i = e(n).toLowerCase()
+ return t()[i] || ''
+ }
+
+ function i (t) {
+ return -1 !== t.search(/^(data:)/)
+ }
+
+ function o (t) {
+ return new Promise(function (e) {
+ for (var n = window.atob(t.toDataURL().split(',')[1]), i = n.length, o = new Uint8Array(i), r = 0; r < i; r++) o[r] = n.charCodeAt(r)
+ e(new Blob([o], { type: 'image/png' }))
+ })
+ }
+
+ function r (t) {
+ return t.toBlob ? new Promise(function (e) {
+ t.toBlob(e)
+ }) : o(t)
+ }
+
+ function a (t, e) {
+ var n = document.implementation.createHTMLDocument(), i = n.createElement('base')
+ n.head.appendChild(i)
+ var o = n.createElement('a')
+ return n.body.appendChild(o), i.href = e, o.href = t, o.href
+ }
+
+ function s (t) {
+ return new Promise(function (e, n) {
+ var i = new Image
+ i.onload = function () {
+ e(i)
+ }, i.onerror = n, i.src = t
+ })
+ }
+
+ function l (t) {
+ var e = 3e4
+ return w.impl.options.cacheBust && (t += (/\?/.test(t) ? '&' : '?') + (new Date).getTime()), new Promise(function (n) {
+ function i () {
+ if (4 === a.readyState) {
+ if (200 !== a.status) return void (s ? n(s) : r('cannot fetch resource: ' + t + ', status: ' + a.status))
+ var e = new FileReader
+ e.onloadend = function () {
+ var t = e.result.split(/,/)[1]
+ n(t)
+ }, e.readAsDataURL(a.response)
+ }
+ }
+
+ function o () {
+ s ? n(s) : r('timeout of ' + e + 'ms occured while fetching resource: ' + t)
+ }
+
+ function r (t) {
+ console.error(t), n('')
+ }
+
+ var a = new XMLHttpRequest
+ a.onreadystatechange = i, a.ontimeout = o, a.responseType = 'blob', a.timeout = e, a.open('GET', t, !0), a.send()
+ var s
+ if (w.impl.options.imagePlaceholder) {
+ var l = w.impl.options.imagePlaceholder.split(/,/)
+ l && l[1] && (s = l[1])
+ }
+ })
+ }
+
+ function u (t, e) {
+ return 'data:' + e + ';base64,' + t
+ }
+
+ function c (t) {
+ return t.replace(/([.*+?^${}()|\[\]\/\\])/g, '\\$1')
+ }
+
+ function d (t) {
+ return function (e) {
+ return new Promise(function (n) {
+ setTimeout(function () {
+ n(e)
+ }, t)
+ })
+ }
+ }
+
+ function g (t) {
+ for (var e = [], n = t.length, i = 0; i < n; i++) e.push(t[i])
+ return e
+ }
+
+ function h (t) {
+ return t.replace(/#/g, '%23').replace(/\n/g, '%0A')
+ }
+
+ function m (t) {
+ var e = f(t, 'border-left-width'), n = f(t, 'border-right-width')
+ return t.scrollWidth + e + n
+ }
+
+ function p (t) {
+ var e = f(t, 'border-top-width'), n = f(t, 'border-bottom-width')
+ return t.scrollHeight + e + n
+ }
+
+ function f (t, e) {
+ var n = window.getComputedStyle(t).getPropertyValue(e)
+ return parseFloat(n.replace('px', ''))
+ }
+
+ return {
+ escape: c,
+ parseExtension: e,
+ mimeType: n,
+ dataAsUrl: u,
+ isDataUrl: i,
+ canvasToBlob: r,
+ resolveUrl: a,
+ getAndEncode: l,
+ uid: function () {
+ var t = 0
+ return function () {
+ return 'u' + function () {
+ return ('0000' + (Math.random() * Math.pow(36, 4) << 0).toString(36)).slice(-4)
+ }() + t++
+ }
+ }(),
+ delay: d,
+ asArray: g,
+ escapeXhtml: h,
+ makeImage: s,
+ width: m,
+ height: p
+ }
+ }(), m = function () {
+ function t (t) {
+ return -1 !== t.search(o)
+ }
+
+ function e (t) {
+ for (var e, n = []; null !== (e = o.exec(t));) n.push(e[1])
+ return n.filter(function (t) {
+ return !h.isDataUrl(t)
+ })
+ }
+
+ function n (t, e, n, i) {
+ function o (t) {
+ return new RegExp('(url\\([\'"]?)(' + h.escape(t) + ')([\'"]?\\))', 'g')
+ }
+
+ return Promise.resolve(e).then(function (t) {
+ return n ? h.resolveUrl(t, n) : t
+ }).then(i || h.getAndEncode).then(function (t) {
+ return h.dataAsUrl(t, h.mimeType(e))
+ }).then(function (n) {
+ return t.replace(o(e), '$1' + n + '$3')
+ })
+ }
+
+ function i (i, o, r) {
+ return function () {
+ return !t(i)
+ }() ? Promise.resolve(i) : Promise.resolve(i).then(e).then(function (t) {
+ var e = Promise.resolve(i)
+ return t.forEach(function (t) {
+ e = e.then(function (e) {
+ return n(e, t, o, r)
+ })
+ }), e
+ })
+ }
+
+ var o = /url\(['"]?([^'"]+?)['"]?\)/g
+ return {
+ inlineAll: i,
+ shouldProcess: t,
+ impl: {
+ readUrls: e,
+ inline: n
+ }
+ }
+ }(), p = function () {
+ function t () {
+ return e(document).then(function (t) {
+ return Promise.all(t.map(function (t) {
+ return t.resolve()
+ }))
+ }).then(function (t) {
+ return t.join('\n')
+ })
+ }
+
+ function e () {
+ function t (t) {
+ return t.filter(function (t) {
+ return t.type === CSSRule.FONT_FACE_RULE
+ }).filter(function (t) {
+ return m.shouldProcess(t.style.getPropertyValue('src'))
+ })
+ }
+
+ function e (t) {
+ var e = []
+ return t.forEach(function (t) {
+ try {
+ h.asArray(t.cssRules || []).forEach(e.push.bind(e))
+ } catch (e) {
+ console.log('Error while reading CSS rules from ' + t.href, e.toString())
+ }
+ }), e
+ }
+
+ function n (t) {
+ return {
+ resolve: function () {
+ var e = (t.parentStyleSheet || {}).href
+ return m.inlineAll(t.cssText, e)
+ },
+ src: function () {
+ return t.style.getPropertyValue('src')
+ }
+ }
+ }
+
+ return Promise.resolve(h.asArray(document.styleSheets)).then(e).then(t).then(function (t) {
+ return t.map(n)
+ })
+ }
+
+ return {
+ resolveAll: t,
+ impl: { readAll: e }
+ }
+ }(), f = function () {
+ function t (t) {
+ function e (e) {
+ return h.isDataUrl(t.src) ? Promise.resolve() : Promise.resolve(t.src).then(e || h.getAndEncode).then(function (e) {
+ return h.dataAsUrl(e, h.mimeType(t.src))
+ }).then(function (e) {
+ return new Promise(function (n, i) {
+ t.onload = n, t.onerror = i, t.src = e
+ })
+ })
+ }
+
+ return { inline: e }
+ }
+
+ function e (n) {
+ return n instanceof Element ? function (t) {
+ var e = t.style.getPropertyValue('background')
+ return e ? m.inlineAll(e).then(function (e) {
+ t.style.setProperty('background', e, t.style.getPropertyPriority('background'))
+ }).then(function () {
+ return t
+ }) : Promise.resolve(t)
+ }(n).then(function () {
+ return n instanceof HTMLImageElement ? t(n).inline() : Promise.all(h.asArray(n.childNodes).map(function (t) {
+ return e(t)
+ }))
+ }) : Promise.resolve(n)
+ }
+
+ return {
+ inlineAll: e,
+ impl: { newImage: t }
+ }
+ }(), M = {
+ imagePlaceholder: void 0,
+ cacheBust: !1
+ }, w = {
+ toSvg: n,
+ toPng: o,
+ toJpeg: r,
+ toBlob: a,
+ toPixelData: i,
+ impl: {
+ fontFaces: p,
+ images: f,
+ util: h,
+ inliner: m,
+ options: {}
+ }
+ }
+ t.exports = w
+ }()
+ }), i = t(function (t) {
+ var n = n || function (t) {
+ if (!(void 0 === t || 'undefined' != typeof navigator && /MSIE [1-9]\./.test(navigator.userAgent))) {
+ var e = t.document, n = function () {
+ return t.URL || t.webkitURL || t
+ }, i = e.createElementNS('http://www.w3.org/1999/xhtml', 'a'), o = 'download' in i, r = function (t) {
+ var e = new MouseEvent('click')
+ t.dispatchEvent(e)
+ }, a = /constructor/i.test(t.HTMLElement) || t.safari, s = /CriOS\/[\d]+/.test(navigator.userAgent),
+ l = function (e) {
+ (t.setImmediate || t.setTimeout)(function () {
+ throw e
+ }, 0)
+ }, u = function (t) {
+ var e = function () {
+ 'string' == typeof t ? n().revokeObjectURL(t) : t.remove()
+ }
+ setTimeout(e, 4e4)
+ }, c = function (t, e, n) {
+ e = [].concat(e)
+ for (var i = e.length; i--;) {
+ var o = t['on' + e[i]]
+ if ('function' == typeof o) {
+ try {
+ o.call(t, n || t)
+ } catch (t) {
+ l(t)
+ }
+ }
+ }
+ }, d = function (t) {
+ return /^\s*(?:text\/\S*|application\/xml|\S*\/\S*\+xml)\s*;.*charset\s*=\s*utf-8/i.test(t.type) ? new Blob([String.fromCharCode(65279), t], { type: t.type }) : t
+ }, g = function (e, l, g) {
+ g || (e = d(e))
+ var h, m = this, p = e.type, f = 'application/octet-stream' === p, M = function () {
+ c(m, 'writestart progress write writeend'.split(' '))
+ }
+ if (m.readyState = m.INIT, o) {
+ return h = n().createObjectURL(e), void setTimeout(function () {
+ i.href = h, i.download = l, r(i), M(), u(h), m.readyState = m.DONE
+ })
+ }
+ !function () {
+ if ((s || f && a) && t.FileReader) {
+ var i = new FileReader
+ return i.onloadend = function () {
+ var e = s ? i.result : i.result.replace(/^data:[^;]*;/, 'data:attachment/file;')
+ t.open(e, '_blank') || (t.location.href = e), e = void 0, m.readyState = m.DONE, M()
+ }, i.readAsDataURL(e), void (m.readyState = m.INIT)
+ }
+ if (h || (h = n().createObjectURL(e)), f) {
+ t.location.href = h
+ } else {
+ t.open(h, '_blank') || (t.location.href = h)
+ }
+ m.readyState = m.DONE, M(), u(h)
+ }()
+ }, h = g.prototype, m = function (t, e, n) {
+ return new g(t, e || t.name || 'download', n)
+ }
+ return 'undefined' != typeof navigator && navigator.msSaveOrOpenBlob ? function (t, e, n) {
+ return e = e || t.name || 'download', n || (t = d(t)), navigator.msSaveOrOpenBlob(t, e)
+ } : (h.abort = function () {
+ }, h.readyState = h.INIT = 0, h.WRITING = 1, h.DONE = 2, h.error = h.onwritestart = h.onprogress = h.onwrite = h.onabort = h.onerror = h.onwriteend = null, m)
+ }
+ }('undefined' != typeof self && self || 'undefined' != typeof window && window || e.content)
+ t.exports && (t.exports.saveAs = n)
+ })
+ L.Control.EasyPrint = L.Control.extend({
+ options: {
+ title: 'Print map',
+ position: 'topleft',
+ sizeModes: ['Current'],
+ filename: 'map',
+ exportOnly: !1,
+ hidden: !1,
+ tileWait: 500,
+ hideControlContainer: !0,
+ customWindowTitle: window.document.title,
+ spinnerBgCOlor: '#0DC5C1',
+ customSpinnerClass: 'epLoader',
+ defaultSizeTitles: {
+ Current: 'Current Size',
+ A4Landscape: 'A4 Landscape',
+ A4Portrait: 'A4 Portrait'
+ }
+ },
+ onAdd: function () {
+ this.mapContainer = this._map.getContainer(), this.options.sizeModes = this.options.sizeModes.map(function (t) {
+ return 'Current' === t ? {
+ name: this.options.defaultSizeTitles.Current,
+ className: 'CurrentSize'
+ } : 'A4Landscape' === t ? {
+ height: this._a4PageSize.height,
+ width: this._a4PageSize.width,
+ name: this.options.defaultSizeTitles.A4Landscape,
+ className: 'A4Landscape page'
+ } : 'A4Portrait' === t ? {
+ height: this._a4PageSize.width,
+ width: this._a4PageSize.height,
+ name: this.options.defaultSizeTitles.A4Portrait,
+ className: 'A4Portrait page'
+ } : t
+ }, this)
+ var t = L.DomUtil.create('div', 'leaflet-control-easyPrint leaflet-bar leaflet-control')
+ if (!this.options.hidden) {
+ this._addCss(), L.DomEvent.addListener(t, 'mouseover', this._togglePageSizeButtons, this), L.DomEvent.addListener(t, 'mouseout', this._togglePageSizeButtons, this)
+ var e = 'leaflet-control-easyPrint-button'
+ this.options.exportOnly && (e += '-export'), this.link = L.DomUtil.create('a', e, t), this.link.id = 'leafletEasyPrint', this.link.title = this.options.title, this.holder = L.DomUtil.create('ul', 'easyPrintHolder', t), this.options.sizeModes.forEach(function (t) {
+ var e = L.DomUtil.create('li', 'easyPrintSizeMode', this.holder)
+ e.title = t.name
+ L.DomUtil.create('a', t.className, e)
+ L.DomEvent.addListener(e, 'click', this.printMap, this)
+ }, this), L.DomEvent.disableClickPropagation(t)
+ }
+ return t
+ },
+ printMap: function (t, e) {
+ e && (this.options.filename = e), this.options.exportOnly || (this._page = window.open('', '_blank', 'toolbar=no,status=no,menubar=no,scrollbars=no,resizable=no,left=10, top=10, width=200, height=250, visible=none'), this._page.document.write(this._createSpinner(this.options.customWindowTitle, this.options.customSpinnerClass, this.options.spinnerBgCOlor))), this.originalState = {
+ mapWidth: this.mapContainer.style.width,
+ widthWasAuto: !1,
+ widthWasPercentage: !1,
+ mapHeight: this.mapContainer.style.height,
+ zoom: this._map.getZoom(),
+ center: this._map.getCenter()
+ }, 'auto' === this.originalState.mapWidth ? (this.originalState.mapWidth = this._map.getSize().x + 'px', this.originalState.widthWasAuto = !0) : this.originalState.mapWidth.includes('%') && (this.originalState.percentageWidth = this.originalState.mapWidth, this.originalState.widthWasPercentage = !0, this.originalState.mapWidth = this._map.getSize().x + 'px'), this._map.fire('easyPrint-start', { event: t }), this.options.hidden || this._togglePageSizeButtons({ type: null }), this.options.hideControlContainer && this._toggleControls()
+ var n = 'string' != typeof t ? t.target.className : t
+ if ('CurrentSize' === n) return this._printOpertion(n)
+ this.outerContainer = this._createOuterContainer(this.mapContainer), this.originalState.widthWasAuto && (this.outerContainer.style.width = this.originalState.mapWidth), this._createImagePlaceholder(n)
+ },
+ _createImagePlaceholder: function (t) {
+ var e = this
+ n.toPng(this.mapContainer, {
+ width: parseInt(this.originalState.mapWidth.replace('px')),
+ height: parseInt(this.originalState.mapHeight.replace('px'))
+ }).then(function (n) {
+ e.blankDiv = document.createElement('div')
+ var i = e.blankDiv
+ e.outerContainer.parentElement.insertBefore(i, e.outerContainer), i.className = 'epHolder', i.style.backgroundImage = 'url("' + n + '")', i.style.position = 'absolute', i.style.zIndex = 1011, i.style.display = 'initial', i.style.width = e.originalState.mapWidth, i.style.height = e.originalState.mapHeight, e._resizeAndPrintMap(t)
+ }).catch(function (t) {
+ console.error('oops, something went wrong!', t)
+ })
+ },
+ _resizeAndPrintMap: function (t) {
+ this.outerContainer.style.opacity = 0
+ var e = this.options.sizeModes.filter(function (e) {
+ return e.className === t
+ })
+ e = e[0], this.mapContainer.style.width = e.width + 'px', this.mapContainer.style.height = e.height + 'px', this.mapContainer.style.width > this.mapContainer.style.height ? this.orientation = 'portrait' : this.orientation = 'landscape', this._map.setView(this.originalState.center), this._map.setZoom(this.originalState.zoom), this._map.invalidateSize(), this.options.tileLayer ? this._pausePrint(t) : this._printOpertion(t)
+ },
+ _pausePrint: function (t) {
+ var e = this, n = setInterval(function () {
+ e.options.tileLayer.isLoading() || (clearInterval(n), e._printOpertion(t))
+ }, e.options.tileWait)
+ },
+ _printOpertion: function (t) {
+ var e = this, o = this.mapContainer.style.width;
+ (this.originalState.widthWasAuto && 'CurrentSize' === t || this.originalState.widthWasPercentage && 'CurrentSize' === t) && (o = this.originalState.mapWidth), n.toPng(e.mapContainer, {
+ width: parseInt(o),
+ height: parseInt(e.mapContainer.style.height.replace('px'))
+ }).then(function (t) {
+ var n = e._dataURItoBlob(t)
+ e.options.exportOnly ? i.saveAs(n, e.options.filename + '.png') : e._sendToBrowserPrint(t, e.orientation), e._toggleControls(!0), e.outerContainer && (e.originalState.widthWasAuto ? e.mapContainer.style.width = 'auto' : e.originalState.widthWasPercentage ? e.mapContainer.style.width = e.originalState.percentageWidth : e.mapContainer.style.width = e.originalState.mapWidth, e.mapContainer.style.height = e.originalState.mapHeight, e._removeOuterContainer(e.mapContainer, e.outerContainer, e.blankDiv), e._map.invalidateSize(), e._map.setView(e.originalState.center), e._map.setZoom(e.originalState.zoom)), e._map.fire('easyPrint-finished')
+ }).catch(function (t) {
+ console.error('Print operation failed', t)
+ })
+ },
+ _sendToBrowserPrint: function (t, e) {
+ this._page.resizeTo(600, 800)
+ var n = this._createNewWindow(t, e, this)
+ this._page.document.body.innerHTML = '', this._page.document.write(n), this._page.document.close()
+ },
+ _createSpinner: function (t, e, n) {
+ return '<html><head><title>' + t + '</title></head><body><style>\n body{\n background: ' + n + ';\n }\n .epLoader,\n .epLoader:before,\n .epLoader:after {\n border-radius: 50%;\n }\n .epLoader {\n color: #ffffff;\n font-size: 11px;\n text-indent: -99999em;\n margin: 55px auto;\n position: relative;\n width: 10em;\n height: 10em;\n box-shadow: inset 0 0 0 1em;\n -webkit-transform: translateZ(0);\n -ms-transform: translateZ(0);\n transform: translateZ(0);\n }\n .epLoader:before,\n .epLoader:after {\n position: absolute;\n content: \'\';\n }\n .epLoader:before {\n width: 5.2em;\n height: 10.2em;\n background: #0dc5c1;\n border-radius: 10.2em 0 0 10.2em;\n top: -0.1em;\n left: -0.1em;\n -webkit-transform-origin: 5.2em 5.1em;\n transform-origin: 5.2em 5.1em;\n -webkit-animation: load2 2s infinite ease 1.5s;\n animation: load2 2s infinite ease 1.5s;\n }\n .epLoader:after {\n width: 5.2em;\n height: 10.2em;\n background: #0dc5c1;\n border-radius: 0 10.2em 10.2em 0;\n top: -0.1em;\n left: 5.1em;\n -webkit-transform-origin: 0px 5.1em;\n transform-origin: 0px 5.1em;\n -webkit-animation: load2 2s infinite ease;\n animation: load2 2s infinite ease;\n }\n @-webkit-keyframes load2 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n @keyframes load2 {\n 0% {\n -webkit-transform: rotate(0deg);\n transform: rotate(0deg);\n }\n 100% {\n -webkit-transform: rotate(360deg);\n transform: rotate(360deg);\n }\n }\n </style>\n <div class="' + e + '">Loading...</div></body></html>'
+ },
+ _createNewWindow: function (t, e, n) {
+ return '<html><head>\n <style>@media print {\n img { max-width: 98%!important; max-height: 98%!important; }\n @page { size: ' + e + ';}}\n </style>\n <script>function step1(){\n setTimeout(\'step2()\', 10);}\n function step2(){window.print();window.close()}\n <\/script></head><body onload=\'step1()\'>\n <img src="' + t + '" style="display:block; margin:auto;"></body></html>'
+ },
+ _createOuterContainer: function (t) {
+ var e = document.createElement('div')
+ return t.parentNode.insertBefore(e, t), t.parentNode.removeChild(t), e.appendChild(t), e.style.width = t.style.width, e.style.height = t.style.height, e.style.display = 'inline-block', e.style.overflow = 'hidden', e
+ },
+ _removeOuterContainer: function (t, e, n) {
+ e.parentNode && (e.parentNode.insertBefore(t, e), e.parentNode.removeChild(n), e.parentNode.removeChild(e))
+ },
+ _addCss: function () {
+ var t = document.createElement('style')
+ t.type = 'text/css', t.innerHTML = '.leaflet-control-easyPrint-button { \n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDUxMiA1MTI7IiB4bWw6c3BhY2U9InByZXNlcnZlIj4KPGc+Cgk8cGF0aCBkPSJNMTI4LDMyaDI1NnY2NEgxMjhWMzJ6IE00ODAsMTI4SDMyYy0xNy42LDAtMzIsMTQuNC0zMiwzMnYxNjBjMCwxNy42LDE0LjM5OCwzMiwzMiwzMmg5NnYxMjhoMjU2VjM1Mmg5NiAgIGMxNy42LDAsMzItMTQuNCwzMi0zMlYxNjBDNTEyLDE0Mi40LDQ5Ny42LDEyOCw0ODAsMTI4eiBNMzUyLDQ0OEgxNjBWMjg4aDE5MlY0NDh6IE00ODcuMTk5LDE3NmMwLDEyLjgxMy0xMC4zODcsMjMuMi0yMy4xOTcsMjMuMiAgIGMtMTIuODEyLDAtMjMuMjAxLTEwLjM4Ny0yMy4yMDEtMjMuMnMxMC4zODktMjMuMiwyMy4xOTktMjMuMkM0NzYuODE0LDE1Mi44LDQ4Ny4xOTksMTYzLjE4Nyw0ODcuMTk5LDE3NnoiIGZpbGw9IiMwMDAwMDAiLz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K);\n background-size: 16px 16px; \n cursor: pointer; \n }\n .leaflet-control-easyPrint-button-export { \n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTYuMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjE2cHgiIGhlaWdodD0iMTZweCIgdmlld0JveD0iMCAwIDQzMy41IDQzMy41IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0MzMuNSA0MzMuNTsiIHhtbDpzcGFjZT0icHJlc2VydmUiPgo8Zz4KCTxnIGlkPSJmaWxlLWRvd25sb2FkIj4KCQk8cGF0aCBkPSJNMzk1LjI1LDE1M2gtMTAyVjBoLTE1M3YxNTNoLTEwMmwxNzguNSwxNzguNUwzOTUuMjUsMTUzeiBNMzguMjUsMzgyLjV2NTFoMzU3di01MUgzOC4yNXoiIGZpbGw9IiMwMDAwMDAiLz4KCTwvZz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8Zz4KPC9nPgo8L3N2Zz4K);\n background-size: 16px 16px; \n cursor: pointer; \n }\n .easyPrintHolder a {\n background-size: 16px 16px;\n cursor: pointer;\n }\n .easyPrintHolder .CurrentSize{\n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCFET0NUWVBFIHN2ZyBQVUJMSUMgIi0vL1czQy8vRFREIFNWRyAxLjEvL0VOIiAiaHR0cDovL3d3dy53My5vcmcvR3JhcGhpY3MvU1ZHLzEuMS9EVEQvc3ZnMTEuZHRkIj4KPHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTZweCIgdmVyc2lvbj0iMS4xIiBoZWlnaHQ9IjE2cHgiIHZpZXdCb3g9IjAgMCA2NCA2NCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNjQgNjQiPgogIDxnPgogICAgPGcgZmlsbD0iIzFEMUQxQiI+CiAgICAgIDxwYXRoIGQ9Ik0yNS4yNTUsMzUuOTA1TDQuMDE2LDU3LjE0NVY0Ni41OWMwLTEuMTA4LTAuODk3LTIuMDA4LTIuMDA4LTIuMDA4QzAuODk4LDQ0LjU4MiwwLDQ1LjQ4MSwwLDQ2LjU5djE1LjQwMiAgICBjMCwwLjI2MSwwLjA1MywwLjUyMSwwLjE1NSwwLjc2N2MwLjIwMywwLjQ5MiwwLjU5NCwwLjg4MiwxLjA4NiwxLjA4N0MxLjQ4Niw2My45NDcsMS43NDcsNjQsMi4wMDgsNjRoMTUuNDAzICAgIGMxLjEwOSwwLDIuMDA4LTAuODk4LDIuMDA4LTIuMDA4cy0wLjg5OC0yLjAwOC0yLjAwOC0yLjAwOEg2Ljg1NWwyMS4yMzgtMjEuMjRjMC43ODQtMC43ODQsMC43ODQtMi4wNTUsMC0yLjgzOSAgICBTMjYuMDM5LDM1LjEyMSwyNS4yNTUsMzUuOTA1eiIgZmlsbD0iIzAwMDAwMCIvPgogICAgICA8cGF0aCBkPSJtNjMuODQ1LDEuMjQxYy0wLjIwMy0wLjQ5MS0wLjU5NC0wLjg4Mi0xLjA4Ni0xLjA4Ny0wLjI0NS0wLjEwMS0wLjUwNi0wLjE1NC0wLjc2Ny0wLjE1NGgtMTUuNDAzYy0xLjEwOSwwLTIuMDA4LDAuODk4LTIuMDA4LDIuMDA4czAuODk4LDIuMDA4IDIuMDA4LDIuMDA4aDEwLjU1NmwtMjEuMjM4LDIxLjI0Yy0wLjc4NCwwLjc4NC0wLjc4NCwyLjA1NSAwLDIuODM5IDAuMzkyLDAuMzkyIDAuOTA2LDAuNTg5IDEuNDIsMC41ODlzMS4wMjctMC4xOTcgMS40MTktMC41ODlsMjEuMjM4LTIxLjI0djEwLjU1NWMwLDEuMTA4IDAuODk3LDIuMDA4IDIuMDA4LDIuMDA4IDEuMTA5LDAgMi4wMDgtMC44OTkgMi4wMDgtMi4wMDh2LTE1LjQwMmMwLTAuMjYxLTAuMDUzLTAuNTIyLTAuMTU1LTAuNzY3eiIgZmlsbD0iIzAwMDAwMCIvPgogICAgPC9nPgogIDwvZz4KPC9zdmc+Cg==)\n }\n .easyPrintHolder .page {\n background-image: url(data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTguMS4xLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDQ0NC44MzMgNDQ0LjgzMyIgc3R5bGU9ImVuYWJsZS1iYWNrZ3JvdW5kOm5ldyAwIDAgNDQ0LjgzMyA0NDQuODMzOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSIgd2lkdGg9IjUxMnB4IiBoZWlnaHQ9IjUxMnB4Ij4KPGc+Cgk8Zz4KCQk8cGF0aCBkPSJNNTUuMjUsNDQ0LjgzM2gzMzQuMzMzYzkuMzUsMCwxNy03LjY1LDE3LTE3VjEzOS4xMTdjMC00LjgxNy0xLjk4My05LjM1LTUuMzgzLTEyLjQ2N0wyNjkuNzMzLDQuNTMzICAgIEMyNjYuNjE3LDEuNywyNjIuMzY3LDAsMjU4LjExNywwSDU1LjI1Yy05LjM1LDAtMTcsNy42NS0xNywxN3Y0MTAuODMzQzM4LjI1LDQzNy4xODMsNDUuOSw0NDQuODMzLDU1LjI1LDQ0NC44MzN6ICAgICBNMzcyLjU4MywxNDYuNDgzdjAuODVIMjU2LjQxN3YtMTA4LjhMMzcyLjU4MywxNDYuNDgzeiBNNzIuMjUsMzRoMTUwLjE2N3YxMzAuMzMzYzAsOS4zNSw3LjY1LDE3LDE3LDE3aDEzMy4xNjd2MjI5LjVINzIuMjVWMzR6ICAgICIgZmlsbD0iIzAwMDAwMCIvPgoJPC9nPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=);\n }\n .easyPrintHolder .A4Landscape { \n transform: rotate(-90deg);\n }\n\n .leaflet-control-easyPrint-button{\n display: inline-block;\n }\n .easyPrintHolder{\n margin-top:-31px;\n margin-bottom: -5px;\n margin-left: 30px;\n padding-left: 0px;\n display: none;\n }\n\n .easyPrintSizeMode {\n display: inline-block;\n }\n .easyPrintHolder .easyPrintSizeMode a {\n border-radius: 0px;\n }\n\n .easyPrintHolder .easyPrintSizeMode:last-child a{\n border-top-right-radius: 2px;\n border-bottom-right-radius: 2px;\n margin-left: -1px;\n }\n\n .easyPrintPortrait:hover, .easyPrintLandscape:hover{\n background-color: #757570;\n cursor: pointer;\n }', document.body.appendChild(t)
+ },
+ _dataURItoBlob: function (t) {
+ for (var e = atob(t.split(',')[1]), n = t.split(',')[0].split(':')[1].split(';')[0], i = new ArrayBuffer(e.length), o = new DataView(i), r = 0; r < e.length; r++) o.setUint8(r, e.charCodeAt(r))
+ return new Blob([i], { type: n })
+ },
+ _togglePageSizeButtons: function (t) {
+ var e = this.holder.style, n = this.link.style
+ 'mouseover' === t.type ? (e.display = 'block', n.borderTopRightRadius = '0', n.borderBottomRightRadius = '0') : (e.display = 'none', n.borderTopRightRadius = '2px', n.borderBottomRightRadius = '2px')
+ },
+ _toggleControls: function (t) {
+ var e = document.getElementsByClassName('leaflet-control-container')[0]
+ if (t) return e.style.display = 'block'
+ e.style.display = 'none'
+ },
+ _a4PageSize: {
+ height: 715,
+ width: 1045
+ }
+ }), L.easyPrint = function (t) {
+ return new L.Control.EasyPrint(t)
+ }
+ })
+//# sourceMappingURL=bundle.js.map
+}
+
+export default {
+ init
+}
diff --git a/src/components/plugin/FullScreen.js b/src/components/plugin/FullScreen.js
index f96831e..9ef7d5a 100644
--- a/src/components/plugin/FullScreen.js
+++ b/src/components/plugin/FullScreen.js
@@ -1,175 +1,175 @@
-/* eslint-disable */
-// 鍏ㄥ睆灞曠ず鎻掍欢
-const init = (L) => {
- (function (factory) {
- if (typeof define === 'function' && define.amd) {
- // AMD
- define(['leaflet'], factory)
- } else if (typeof module !== 'undefined') {
- // Node/CommonJS
- // module.exports = factory(require('leaflet'))
- factory(L)
- } else {
- // Browser globals
- if (typeof window.L === 'undefined') {
- throw new Error('Leaflet must be loaded first')
- }
- factory(window.L)
- }
- }(function (L) {
- L.Control.Fullscreen = L.Control.extend({
- options: {
- position: 'topleft',
- title: {
- false: 'View Fullscreen',
- true: 'Exit Fullscreen'
- }
- },
-
- onAdd: function (map) {
- var container = L.DomUtil.create('div', 'leaflet-control-fullscreen leaflet-bar leaflet-control')
-
- this.link = L.DomUtil.create('a', 'leaflet-control-fullscreen-button leaflet-bar-part', container)
- this.link.href = '#'
-
- this._map = map
- this._map.on('fullscreenchange', this._toggleTitle, this)
- this._toggleTitle()
-
- L.DomEvent.on(this.link, 'click', this._click, this)
-
- return container
- },
-
- _click: function (e) {
- L.DomEvent.stopPropagation(e)
- L.DomEvent.preventDefault(e)
- this._map.toggleFullscreen(this.options)
- },
-
- _toggleTitle: function () {
- this.link.title = this.optionsthis._map.isFullscreen()]
- }
- })
-
- L.Map.include({
- isFullscreen: function () {
- return this._isFullscreen || false
- },
-
- toggleFullscreen: function (options) {
- var container = this.getContainer()
- if (this.isFullscreen()) {
- if (options && options.pseudoFullscreen) {
- this._disablePseudoFullscreen(container)
- } else if (document.exitFullscreen) {
- document.exitFullscreen()
- } else if (document.mozCancelFullScreen) {
- document.mozCancelFullScreen()
- } else if (document.webkitCancelFullScreen) {
- document.webkitCancelFullScreen()
- } else if (document.msExitFullscreen) {
- document.msExitFullscreen()
- } else {
- this._disablePseudoFullscreen(container)
- }
- } else {
- if (options && options.pseudoFullscreen) {
- this._enablePseudoFullscreen(container)
- } else if (container.requestFullscreen) {
- container.requestFullscreen()
- } else if (container.mozRequestFullScreen) {
- container.mozRequestFullScreen()
- } else if (container.webkitRequestFullscreen) {
- container.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT)
- } else if (container.msRequestFullscreen) {
- container.msRequestFullscreen()
- } else {
- this._enablePseudoFullscreen(container)
- }
- }
- },
-
- _enablePseudoFullscreen: function (container) {
- L.DomUtil.addClass(container, 'leaflet-pseudo-fullscreen')
- this._setFullscreen(true)
- this.fire('fullscreenchange')
- },
-
- _disablePseudoFullscreen: function (container) {
- L.DomUtil.removeClass(container, 'leaflet-pseudo-fullscreen')
- this._setFullscreen(false)
- this.fire('fullscreenchange')
- },
-
- _setFullscreen: function (fullscreen) {
- this._isFullscreen = fullscreen
- var container = this.getContainer()
- if (fullscreen) {
- L.DomUtil.addClass(container, 'leaflet-fullscreen-on')
- } else {
- L.DomUtil.removeClass(container, 'leaflet-fullscreen-on')
- }
- this.invalidateSize()
- },
-
- _onFullscreenChange: function (e) {
- var fullscreenElement =
- document.fullscreenElement ||
- document.mozFullScreenElement ||
- document.webkitFullscreenElement ||
- document.msFullscreenElement
-
- if (fullscreenElement === this.getContainer() && !this._isFullscreen) {
- this._setFullscreen(true)
- this.fire('fullscreenchange')
- } else if (fullscreenElement !== this.getContainer() && this._isFullscreen) {
- this._setFullscreen(false)
- this.fire('fullscreenchange')
- }
- }
- })
-
- L.Map.mergeOptions({
- fullscreenControl: false
- })
-
- L.Map.addInitHook(function () {
- if (this.options.fullscreenControl) {
- this.fullscreenControl = new L.Control.Fullscreen(this.options.fullscreenControl)
- this.addControl(this.fullscreenControl)
- }
-
- var fullscreenchange
-
- if ('onfullscreenchange' in document) {
- fullscreenchange = 'fullscreenchange'
- } else if ('onmozfullscreenchange' in document) {
- fullscreenchange = 'mozfullscreenchange'
- } else if ('onwebkitfullscreenchange' in document) {
- fullscreenchange = 'webkitfullscreenchange'
- } else if ('onmsfullscreenchange' in document) {
- fullscreenchange = 'MSFullscreenChange'
- }
-
- if (fullscreenchange) {
- var onFullscreenChange = L.bind(this._onFullscreenChange, this)
-
- this.whenReady(function () {
- L.DomEvent.on(document, fullscreenchange, onFullscreenChange)
- })
-
- this.on('unload', function () {
- L.DomEvent.off(document, fullscreenchange, onFullscreenChange)
- })
- }
- })
-
- L.control.fullscreen = function (options) {
- return new L.Control.Fullscreen(options)
- }
- }))
-}
-export default {
- init
-}
+/* eslint-disable */
+// 鍏ㄥ睆灞曠ず鎻掍欢
+const init = (L) => {
+ (function (factory) {
+ if (typeof define === 'function' && define.amd) {
+ // AMD
+ define(['leaflet'], factory)
+ } else if (typeof module !== 'undefined') {
+ // Node/CommonJS
+ // module.exports = factory(require('leaflet'))
+ factory(L)
+ } else {
+ // Browser globals
+ if (typeof window.L === 'undefined') {
+ throw new Error('Leaflet must be loaded first')
+ }
+ factory(window.L)
+ }
+ }(function (L) {
+ L.Control.Fullscreen = L.Control.extend({
+ options: {
+ position: 'topleft',
+ title: {
+ false: 'View Fullscreen',
+ true: 'Exit Fullscreen'
+ }
+ },
+
+ onAdd: function (map) {
+ var container = L.DomUtil.create('div', 'leaflet-control-fullscreen leaflet-bar leaflet-control')
+
+ this.link = L.DomUtil.create('a', 'leaflet-control-fullscreen-button leaflet-bar-part', container)
+ this.link.href = '#'
+
+ this._map = map
+ this._map.on('fullscreenchange', this._toggleTitle, this)
+ this._toggleTitle()
+
+ L.DomEvent.on(this.link, 'click', this._click, this)
+
+ return container
+ },
+
+ _click: function (e) {
+ L.DomEvent.stopPropagation(e)
+ L.DomEvent.preventDefault(e)
+ this._map.toggleFullscreen(this.options)
+ },
+
+ _toggleTitle: function () {
+ this.link.title = this.optionsthis._map.isFullscreen()]
+ }
+ })
+
+ L.Map.include({
+ isFullscreen: function () {
+ return this._isFullscreen || false
+ },
+
+ toggleFullscreen: function (options) {
+ var container = this.getContainer()
+ if (this.isFullscreen()) {
+ if (options && options.pseudoFullscreen) {
+ this._disablePseudoFullscreen(container)
+ } else if (document.exitFullscreen) {
+ document.exitFullscreen()
+ } else if (document.mozCancelFullScreen) {
+ document.mozCancelFullScreen()
+ } else if (document.webkitCancelFullScreen) {
+ document.webkitCancelFullScreen()
+ } else if (document.msExitFullscreen) {
+ document.msExitFullscreen()
+ } else {
+ this._disablePseudoFullscreen(container)
+ }
+ } else {
+ if (options && options.pseudoFullscreen) {
+ this._enablePseudoFullscreen(container)
+ } else if (container.requestFullscreen) {
+ container.requestFullscreen()
+ } else if (container.mozRequestFullScreen) {
+ container.mozRequestFullScreen()
+ } else if (container.webkitRequestFullscreen) {
+ container.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT)
+ } else if (container.msRequestFullscreen) {
+ container.msRequestFullscreen()
+ } else {
+ this._enablePseudoFullscreen(container)
+ }
+ }
+ },
+
+ _enablePseudoFullscreen: function (container) {
+ L.DomUtil.addClass(container, 'leaflet-pseudo-fullscreen')
+ this._setFullscreen(true)
+ this.fire('fullscreenchange')
+ },
+
+ _disablePseudoFullscreen: function (container) {
+ L.DomUtil.removeClass(container, 'leaflet-pseudo-fullscreen')
+ this._setFullscreen(false)
+ this.fire('fullscreenchange')
+ },
+
+ _setFullscreen: function (fullscreen) {
+ this._isFullscreen = fullscreen
+ var container = this.getContainer()
+ if (fullscreen) {
+ L.DomUtil.addClass(container, 'leaflet-fullscreen-on')
+ } else {
+ L.DomUtil.removeClass(container, 'leaflet-fullscreen-on')
+ }
+ this.invalidateSize()
+ },
+
+ _onFullscreenChange: function (e) {
+ var fullscreenElement =
+ document.fullscreenElement ||
+ document.mozFullScreenElement ||
+ document.webkitFullscreenElement ||
+ document.msFullscreenElement
+
+ if (fullscreenElement === this.getContainer() && !this._isFullscreen) {
+ this._setFullscreen(true)
+ this.fire('fullscreenchange')
+ } else if (fullscreenElement !== this.getContainer() && this._isFullscreen) {
+ this._setFullscreen(false)
+ this.fire('fullscreenchange')
+ }
+ }
+ })
+
+ L.Map.mergeOptions({
+ fullscreenControl: false
+ })
+
+ L.Map.addInitHook(function () {
+ if (this.options.fullscreenControl) {
+ this.fullscreenControl = new L.Control.Fullscreen(this.options.fullscreenControl)
+ this.addControl(this.fullscreenControl)
+ }
+
+ var fullscreenchange
+
+ if ('onfullscreenchange' in document) {
+ fullscreenchange = 'fullscreenchange'
+ } else if ('onmozfullscreenchange' in document) {
+ fullscreenchange = 'mozfullscreenchange'
+ } else if ('onwebkitfullscreenchange' in document) {
+ fullscreenchange = 'webkitfullscreenchange'
+ } else if ('onmsfullscreenchange' in document) {
+ fullscreenchange = 'MSFullscreenChange'
+ }
+
+ if (fullscreenchange) {
+ var onFullscreenChange = L.bind(this._onFullscreenChange, this)
+
+ this.whenReady(function () {
+ L.DomEvent.on(document, fullscreenchange, onFullscreenChange)
+ })
+
+ this.on('unload', function () {
+ L.DomEvent.off(document, fullscreenchange, onFullscreenChange)
+ })
+ }
+ })
+
+ L.control.fullscreen = function (options) {
+ return new L.Control.Fullscreen(options)
+ }
+ }))
+}
+export default {
+ init
+}
diff --git a/src/components/plugin/MakeTation.js b/src/components/plugin/MakeTation.js
index 311f7c9..9ad3996 100644
--- a/src/components/plugin/MakeTation.js
+++ b/src/components/plugin/MakeTation.js
@@ -1,125 +1,125 @@
-/* eslint-disable */
-// 娣诲姞鏂囧瓧鏍囨敞
-var TextAnnotation = {
- points: [],
- color: '',
- L: null,
- map: null,
- layers: null,
- polyline: null,
- marker: null,
- changeColor: '',
- changeContent: '',
- init: function (map, L) {
- // console.log(L)
- TextAnnotation.L = L
- TextAnnotation.map = map
- TextAnnotation.points = []
- TextAnnotation.polyline = null
- TextAnnotation.marker = null
- TextAnnotation.layers = L.layerGroup()
- map.on('click', TextAnnotation.click).on('dblclick', TextAnnotation.dblclick)
- },
- // 璁剧疆鏀瑰彉鏂囧瓧鍐呭
- setContent: function (changeContent) {
- // console.log(changeContent)
- TextAnnotation.changeContent = changeContent
- },
- // 璁剧疆鏀瑰彉鏂囧瓧棰滆壊
- setColor: function (changeColor) {
- // console.log(changeColor)
- TextAnnotation.changeColor = changeColor
- },
- click: function (e) {
- // console.log(TextAnnotation.changeContent)
- let labIcon = L.divIcon({
- html: '<div style="color:' + TextAnnotation.changeColor + ';font-size: 18px;">' + TextAnnotation.changeContent + '</div>',
- iconSize: [100, 40],
- iconAnchor: [0, 0],
- className: ''
- })
- let marker = L.marker(e.latlng, { icon: labIcon })
- marker.addTo(TextAnnotation.map)
- },
- dblclick: function (e) {
- TextAnnotation.map.off('click', TextAnnotation.click).off('dblclick', TextAnnotation.dblclick)
- },
- destory: function () {
- if (TextAnnotation.polyline) {
- TextAnnotation.map.removeLayer(TextAnnotation.polyline)
- }
- if (TextAnnotation.marker) {
- TextAnnotation.marker.remove()
- }
- if (TextAnnotation.layers) {
- TextAnnotation.layers.clearLayers()
- }
- }
-}
-
-// 娣诲姞 鐐� 鐨勬爣娉�
-let pointAnnotation = {
- points: [],
- color: '',
- L: null,
- map: null,
- layers: null,
- polyline: null,
- marker: null,
- init: function (map, L) {
- pointAnnotation.L = L
- pointAnnotation.map = map
- pointAnnotation.points = []
- pointAnnotation.polyline = null
- pointAnnotation.marker = null
- pointAnnotation.layers = L.layerGroup()
- map.on('click', pointAnnotation.click).on('dblclick', pointAnnotation.dblclick)
- },
- click: function (e) {
- let marker = L.marker(e.latlng)
- marker.addTo(pointAnnotation.map)
- },
- dblclick: function (e) {
- pointAnnotation.map.off('click', pointAnnotation.click).off('dblclick', pointAnnotation.dblclick)
- },
- destory: function () {
- if (pointAnnotation.polyline) {
- pointAnnotation.map.removeLayer(pointAnnotation.polyline)
- }
- if (pointAnnotation.marker) {
- pointAnnotation.marker.remove()
- }
- if (pointAnnotation.layers) {
- pointAnnotation.layers.clearLayers()
- }
- }
-}
-
-// 娣诲姞鏂囧瓧鏍囨敞
-const startMakeText = function (map, L) {
- TextAnnotation.init(map, L)
-}
-// 鏂囧瓧鏍囨敞鐨� 鍐呭绀捐缃�
-const setContentText = function (text) {
- TextAnnotation.setContent(text)
-}
-// 鏂囧瓧鏍囨敞鍐呭鐨� 棰滆壊 璁剧疆
-const setContentColor = function (color) {
- TextAnnotation.setColor(color)
-}
-
-// 鐐� 鏍囨敞
-const StartPointAnnotation = function (map, L) {
- pointAnnotation.init(map, L)
-}
-
-const clearText = function () {
- startMakeText.destory()
-}
-export default {
- clearText,
- startMakeText,
- setContentText,
- setContentColor,
- StartPointAnnotation
-}
+/* eslint-disable */
+// 娣诲姞鏂囧瓧鏍囨敞
+var TextAnnotation = {
+ points: [],
+ color: '',
+ L: null,
+ map: null,
+ layers: null,
+ polyline: null,
+ marker: null,
+ changeColor: '',
+ changeContent: '',
+ init: function (map, L) {
+ // console.log(L)
+ TextAnnotation.L = L
+ TextAnnotation.map = map
+ TextAnnotation.points = []
+ TextAnnotation.polyline = null
+ TextAnnotation.marker = null
+ TextAnnotation.layers = L.layerGroup()
+ map.on('click', TextAnnotation.click).on('dblclick', TextAnnotation.dblclick)
+ },
+ // 璁剧疆鏀瑰彉鏂囧瓧鍐呭
+ setContent: function (changeContent) {
+ // console.log(changeContent)
+ TextAnnotation.changeContent = changeContent
+ },
+ // 璁剧疆鏀瑰彉鏂囧瓧棰滆壊
+ setColor: function (changeColor) {
+ // console.log(changeColor)
+ TextAnnotation.changeColor = changeColor
+ },
+ click: function (e) {
+ // console.log(TextAnnotation.changeContent)
+ let labIcon = L.divIcon({
+ html: '<div style="color:' + TextAnnotation.changeColor + ';font-size: 18px;">' + TextAnnotation.changeContent + '</div>',
+ iconSize: [100, 40],
+ iconAnchor: [0, 0],
+ className: ''
+ })
+ let marker = L.marker(e.latlng, { icon: labIcon })
+ marker.addTo(TextAnnotation.map)
+ },
+ dblclick: function (e) {
+ TextAnnotation.map.off('click', TextAnnotation.click).off('dblclick', TextAnnotation.dblclick)
+ },
+ destory: function () {
+ if (TextAnnotation.polyline) {
+ TextAnnotation.map.removeLayer(TextAnnotation.polyline)
+ }
+ if (TextAnnotation.marker) {
+ TextAnnotation.marker.remove()
+ }
+ if (TextAnnotation.layers) {
+ TextAnnotation.layers.clearLayers()
+ }
+ }
+}
+
+// 娣诲姞 鐐� 鐨勬爣娉�
+let pointAnnotation = {
+ points: [],
+ color: '',
+ L: null,
+ map: null,
+ layers: null,
+ polyline: null,
+ marker: null,
+ init: function (map, L) {
+ pointAnnotation.L = L
+ pointAnnotation.map = map
+ pointAnnotation.points = []
+ pointAnnotation.polyline = null
+ pointAnnotation.marker = null
+ pointAnnotation.layers = L.layerGroup()
+ map.on('click', pointAnnotation.click).on('dblclick', pointAnnotation.dblclick)
+ },
+ click: function (e) {
+ let marker = L.marker(e.latlng)
+ marker.addTo(pointAnnotation.map)
+ },
+ dblclick: function (e) {
+ pointAnnotation.map.off('click', pointAnnotation.click).off('dblclick', pointAnnotation.dblclick)
+ },
+ destory: function () {
+ if (pointAnnotation.polyline) {
+ pointAnnotation.map.removeLayer(pointAnnotation.polyline)
+ }
+ if (pointAnnotation.marker) {
+ pointAnnotation.marker.remove()
+ }
+ if (pointAnnotation.layers) {
+ pointAnnotation.layers.clearLayers()
+ }
+ }
+}
+
+// 娣诲姞鏂囧瓧鏍囨敞
+const startMakeText = function (map, L) {
+ TextAnnotation.init(map, L)
+}
+// 鏂囧瓧鏍囨敞鐨� 鍐呭绀捐缃�
+const setContentText = function (text) {
+ TextAnnotation.setContent(text)
+}
+// 鏂囧瓧鏍囨敞鍐呭鐨� 棰滆壊 璁剧疆
+const setContentColor = function (color) {
+ TextAnnotation.setColor(color)
+}
+
+// 鐐� 鏍囨敞
+const StartPointAnnotation = function (map, L) {
+ pointAnnotation.init(map, L)
+}
+
+const clearText = function () {
+ startMakeText.destory()
+}
+export default {
+ clearText,
+ startMakeText,
+ setContentText,
+ setContentColor,
+ StartPointAnnotation
+}
diff --git a/src/components/plugin/MeaSure.js b/src/components/plugin/MeaSure.js
index ce67a00..a540743 100644
--- a/src/components/plugin/MeaSure.js
+++ b/src/components/plugin/MeaSure.js
@@ -1,170 +1,170 @@
-/* eslint-disable */
-// 闈㈢Н娴嬮噺鏂规硶
-var areaMeasure = {
- points: [],
-// markers:[],
- color: 'red',
- L: null,
- layers: null,
- polygon: null,
- marker: null,
- init: function (map, L) {
- areaMeasure.L = L
- areaMeasure.map = map
- areaMeasure.points = []
- areaMeasure.polygon = null
- areaMeasure.marker = null
- areaMeasure.layers = L.layerGroup()
- areaMeasure.map.on('click', areaMeasure.click).on('dblclick', areaMeasure.dblclick)
- },
- close: function (latlng) {
- /*areaMeasure.marker = L.marker(latlng, { icon: deleteIcon }).addTo(map).on("click", function (e) {
- //console.log('marker',e);
- if(areaMeasure.polygon)
- map.removeLayer(areaMeasure.polygon);
-
- if(areaMeasure.marker)
- areaMeasure.marker.remove();
- });
- //areaMeasure.markers.push(marker);
- */
-
- },
- click: function (e) {
- areaMeasure.map.doubleClickZoom.disable()
-// 娣诲姞鐐逛俊鎭�
- areaMeasure.points.push(e.latlng)
-// 娣诲姞闈�
- areaMeasure.map.on('mousemove', areaMeasure.mousemove)
- },
- mousemove: function (e) {
- areaMeasure.points.push(e.latlng)
- if (areaMeasure.polygon) {
- areaMeasure.map.removeLayer(areaMeasure.polygon)
- }
- areaMeasure.polygon = areaMeasure.L.polygon(areaMeasure.points, {
- showMeasurements: true,
- color: 'red'
- })
-//areaMeasure.polygon.addTo(map);
- areaMeasure.polygon.addTo(areaMeasure.layers)
- areaMeasure.layers.addTo(areaMeasure.map)
- areaMeasure.points.pop()
- },
- dblclick: function (e) { // 鍙屽嚮缁撴潫
- console.log('鍙屽嚮缁撴潫', e)
- areaMeasure.polygon.enableEdit()
- areaMeasure.polygon.dragging.disable()
- areaMeasure.map.on('editable:vertex:drag editable:vertex:deleted', areaMeasure.polygon.updateMeasurements, areaMeasure.polygon)
- areaMeasure.polygon.addTo(areaMeasure.layers)
- areaMeasure.close(e.latlng)
-//areaMeasure.polygon.enableEdit();
-//map.on('editable:vertex:drag editable:vertex:deleted', areaMeasure.polygon.updateMeasurements, areaMeasure.polygon);
- areaMeasure.map.off('click', areaMeasure.click).off('mousemove', areaMeasure.mousemove).off('dblclick', areaMeasure.dblclick)
- },
- destory: function () {
- if (areaMeasure.polygon) {
- areaMeasure.map.removeLayer(areaMeasure.polygon)
- }
-
- if (areaMeasure.marker) {
- areaMeasure.marker.remove()
- }
- if (areaMeasure.layers) {
- areaMeasure.layers.clearLayers()
- }
- }
-}
-
-// 璺濈娴嬮噺鏂规硶
-var distanceMeasure = {
- points: [],
-// markers:[],
- color: 'blue',
- L: null,
- map: null,
- layers: null,
- polyline: null,
- marker: null,
- init: function (map, L) {
- // console.log(L)
- distanceMeasure.L = L
- distanceMeasure.map = map
- distanceMeasure.points = []
- distanceMeasure.polyline = null
- distanceMeasure.marker = null
- distanceMeasure.layers = L.layerGroup()
- map.on('click', distanceMeasure.click).on('dblclick', distanceMeasure.dblclick)
- },
- close: function (latlng) {
- /*distanceMeasure.marker = L.marker(latlng, { icon: deleteIcon }).addTo(map).on("click", function (e) {
- //console.log('marker',e);
- if(distanceMeasure.polyline)
- map.removeLayer(distanceMeasure.polyline);
-
- if(distanceMeasure.marker)
- distanceMeasure.marker.remove();
- });*/
- },
- click: function (e) {
- distanceMeasure.map.doubleClickZoom.disable()
-// 娣诲姞鐐逛俊鎭�
- distanceMeasure.points.push(e.latlng)
-// 娣诲姞绾�
- distanceMeasure.map.on('mousemove', distanceMeasure.mousemove)
- },
- mousemove: function (e) {
- distanceMeasure.points.push(e.latlng)
- if (distanceMeasure.polyline) {
- distanceMeasure.map.removeLayer(distanceMeasure.polyline)
- }
- distanceMeasure.polyline = distanceMeasure.L.polyline(distanceMeasure.points, {
- showMeasurements: true,
- color: 'red'
- })
- distanceMeasure.polyline.addTo(distanceMeasure.layers)
- // distanceMeasure.polyline.enableEdit()
- distanceMeasure.layers.addTo(distanceMeasure.map)
- distanceMeasure.points.pop()
- },
- dblclick: function (e) { // 鍙屽嚮缁撴潫
- console.log('鍙屽嚮缁撴潫', e)
- distanceMeasure.polyline.enableEdit()
- distanceMeasure.polyline.dragging.disable()
- distanceMeasure.polyline.addTo(distanceMeasure.layers)
- distanceMeasure.map.on('editable:vertex:drag editable:vertex:deleted', distanceMeasure.polyline.updateMeasurements, distanceMeasure.polyline)
- distanceMeasure.close(e.latlng)
- distanceMeasure.map.off('click', distanceMeasure.click).off('mousemove', distanceMeasure.mousemove).off('dblclick', distanceMeasure.dblclick)
- },
- destory: function () {
- if (distanceMeasure.polyline) {
- distanceMeasure.map.removeLayer(distanceMeasure.polyline)
- }
- if (distanceMeasure.marker) {
- distanceMeasure.marker.remove()
- }
- if (distanceMeasure.layers) {
- distanceMeasure.layers.clearLayers()
- }
- }
-}
-
-const startMeasureArea = function (map, L) {
- areaMeasure.destory()
- areaMeasure.init(map, L)
-}
-
-const startMeasureLen = function (map, L) {
- distanceMeasure.destory()
- distanceMeasure.init(map, L)
-}
-
-const clearMeasure = function () {
- areaMeasure.destory()
- distanceMeasure.destory()
-}
-export default {
- startMeasureArea,
- startMeasureLen,
- clearMeasure
-}
+/* eslint-disable */
+// 闈㈢Н娴嬮噺鏂规硶
+var areaMeasure = {
+ points: [],
+// markers:[],
+ color: 'red',
+ L: null,
+ layers: null,
+ polygon: null,
+ marker: null,
+ init: function (map, L) {
+ areaMeasure.L = L
+ areaMeasure.map = map
+ areaMeasure.points = []
+ areaMeasure.polygon = null
+ areaMeasure.marker = null
+ areaMeasure.layers = L.layerGroup()
+ areaMeasure.map.on('click', areaMeasure.click).on('dblclick', areaMeasure.dblclick)
+ },
+ close: function (latlng) {
+ /*areaMeasure.marker = L.marker(latlng, { icon: deleteIcon }).addTo(map).on("click", function (e) {
+ //console.log('marker',e);
+ if(areaMeasure.polygon)
+ map.removeLayer(areaMeasure.polygon);
+
+ if(areaMeasure.marker)
+ areaMeasure.marker.remove();
+ });
+ //areaMeasure.markers.push(marker);
+ */
+
+ },
+ click: function (e) {
+ areaMeasure.map.doubleClickZoom.disable()
+// 娣诲姞鐐逛俊鎭�
+ areaMeasure.points.push(e.latlng)
+// 娣诲姞闈�
+ areaMeasure.map.on('mousemove', areaMeasure.mousemove)
+ },
+ mousemove: function (e) {
+ areaMeasure.points.push(e.latlng)
+ if (areaMeasure.polygon) {
+ areaMeasure.map.removeLayer(areaMeasure.polygon)
+ }
+ areaMeasure.polygon = areaMeasure.L.polygon(areaMeasure.points, {
+ showMeasurements: true,
+ color: 'red'
+ })
+//areaMeasure.polygon.addTo(map);
+ areaMeasure.polygon.addTo(areaMeasure.layers)
+ areaMeasure.layers.addTo(areaMeasure.map)
+ areaMeasure.points.pop()
+ },
+ dblclick: function (e) { // 鍙屽嚮缁撴潫
+ console.log('鍙屽嚮缁撴潫', e)
+ areaMeasure.polygon.enableEdit()
+ areaMeasure.polygon.dragging.disable()
+ areaMeasure.map.on('editable:vertex:drag editable:vertex:deleted', areaMeasure.polygon.updateMeasurements, areaMeasure.polygon)
+ areaMeasure.polygon.addTo(areaMeasure.layers)
+ areaMeasure.close(e.latlng)
+//areaMeasure.polygon.enableEdit();
+//map.on('editable:vertex:drag editable:vertex:deleted', areaMeasure.polygon.updateMeasurements, areaMeasure.polygon);
+ areaMeasure.map.off('click', areaMeasure.click).off('mousemove', areaMeasure.mousemove).off('dblclick', areaMeasure.dblclick)
+ },
+ destory: function () {
+ if (areaMeasure.polygon) {
+ areaMeasure.map.removeLayer(areaMeasure.polygon)
+ }
+
+ if (areaMeasure.marker) {
+ areaMeasure.marker.remove()
+ }
+ if (areaMeasure.layers) {
+ areaMeasure.layers.clearLayers()
+ }
+ }
+}
+
+// 璺濈娴嬮噺鏂规硶
+var distanceMeasure = {
+ points: [],
+// markers:[],
+ color: 'blue',
+ L: null,
+ map: null,
+ layers: null,
+ polyline: null,
+ marker: null,
+ init: function (map, L) {
+ // console.log(L)
+ distanceMeasure.L = L
+ distanceMeasure.map = map
+ distanceMeasure.points = []
+ distanceMeasure.polyline = null
+ distanceMeasure.marker = null
+ distanceMeasure.layers = L.layerGroup()
+ map.on('click', distanceMeasure.click).on('dblclick', distanceMeasure.dblclick)
+ },
+ close: function (latlng) {
+ /*distanceMeasure.marker = L.marker(latlng, { icon: deleteIcon }).addTo(map).on("click", function (e) {
+ //console.log('marker',e);
+ if(distanceMeasure.polyline)
+ map.removeLayer(distanceMeasure.polyline);
+
+ if(distanceMeasure.marker)
+ distanceMeasure.marker.remove();
+ });*/
+ },
+ click: function (e) {
+ distanceMeasure.map.doubleClickZoom.disable()
+// 娣诲姞鐐逛俊鎭�
+ distanceMeasure.points.push(e.latlng)
+// 娣诲姞绾�
+ distanceMeasure.map.on('mousemove', distanceMeasure.mousemove)
+ },
+ mousemove: function (e) {
+ distanceMeasure.points.push(e.latlng)
+ if (distanceMeasure.polyline) {
+ distanceMeasure.map.removeLayer(distanceMeasure.polyline)
+ }
+ distanceMeasure.polyline = distanceMeasure.L.polyline(distanceMeasure.points, {
+ showMeasurements: true,
+ color: 'red'
+ })
+ distanceMeasure.polyline.addTo(distanceMeasure.layers)
+ // distanceMeasure.polyline.enableEdit()
+ distanceMeasure.layers.addTo(distanceMeasure.map)
+ distanceMeasure.points.pop()
+ },
+ dblclick: function (e) { // 鍙屽嚮缁撴潫
+ console.log('鍙屽嚮缁撴潫', e)
+ distanceMeasure.polyline.enableEdit()
+ distanceMeasure.polyline.dragging.disable()
+ distanceMeasure.polyline.addTo(distanceMeasure.layers)
+ distanceMeasure.map.on('editable:vertex:drag editable:vertex:deleted', distanceMeasure.polyline.updateMeasurements, distanceMeasure.polyline)
+ distanceMeasure.close(e.latlng)
+ distanceMeasure.map.off('click', distanceMeasure.click).off('mousemove', distanceMeasure.mousemove).off('dblclick', distanceMeasure.dblclick)
+ },
+ destory: function () {
+ if (distanceMeasure.polyline) {
+ distanceMeasure.map.removeLayer(distanceMeasure.polyline)
+ }
+ if (distanceMeasure.marker) {
+ distanceMeasure.marker.remove()
+ }
+ if (distanceMeasure.layers) {
+ distanceMeasure.layers.clearLayers()
+ }
+ }
+}
+
+const startMeasureArea = function (map, L) {
+ areaMeasure.destory()
+ areaMeasure.init(map, L)
+}
+
+const startMeasureLen = function (map, L) {
+ distanceMeasure.destory()
+ distanceMeasure.init(map, L)
+}
+
+const clearMeasure = function () {
+ areaMeasure.destory()
+ distanceMeasure.destory()
+}
+export default {
+ startMeasureArea,
+ startMeasureLen,
+ clearMeasure
+}
diff --git a/src/components/plugin/leaflet-measure-path/leaflet-measure-path.css b/src/components/plugin/leaflet-measure-path/leaflet-measure-path.css
index b583261..35e46d5 100644
--- a/src/components/plugin/leaflet-measure-path/leaflet-measure-path.css
+++ b/src/components/plugin/leaflet-measure-path/leaflet-measure-path.css
@@ -1,22 +1,22 @@
-.leaflet-measure-path-measurement {
- position: absolute;
- font-size: 10px;
- color: black;
- text-shadow: -1px 0 0 white,
- -1px -1px 0 white,
- 0 -1px 0 white,
- 1px -1px 0 white,
- 1px 0 0 white,
- 1px 1px 0 white,
- 0 1px 0 white,
- -1px 1px 0 white;
- white-space: nowrap;
- transform-origin: 0;
- pointer-events: none;
-}
-
-.leaflet-measure-path-measurement > div {
- position: relative;
- margin-top: -25%;
- left: -50%;
-}
+.leaflet-measure-path-measurement {
+ position: absolute;
+ font-size: 10px;
+ color: black;
+ text-shadow: -1px 0 0 white,
+ -1px -1px 0 white,
+ 0 -1px 0 white,
+ 1px -1px 0 white,
+ 1px 0 0 white,
+ 1px 1px 0 white,
+ 0 1px 0 white,
+ -1px 1px 0 white;
+ white-space: nowrap;
+ transform-origin: 0;
+ pointer-events: none;
+}
+
+.leaflet-measure-path-measurement > div {
+ position: relative;
+ margin-top: -25%;
+ left: -50%;
+}
diff --git a/src/components/plugin/leaflet-measure-path/leaflet-measure-path.js b/src/components/plugin/leaflet-measure-path/leaflet-measure-path.js
index 2f8a696..88338eb 100644
--- a/src/components/plugin/leaflet-measure-path/leaflet-measure-path.js
+++ b/src/components/plugin/leaflet-measure-path/leaflet-measure-path.js
@@ -1,421 +1,421 @@
-/* eslint-disable */
- !(function() {
- 'use strict'
-
- L.Marker.Measurement = L[L.Layer ? 'Layer' : 'Class'].extend({
- options: {
- pane: 'markerPane'
- },
-
- initialize: function(latlng, measurement, title, rotation, options) {
- L.setOptions(this, options)
-
- this._latlng = latlng
- this._measurement = measurement
- this._title = title
- this._rotation = rotation
- },
-
- addTo: function(map) {
- map.addLayer(this)
- return this
- },
-
- onAdd: function(map) {
- this._map = map
- var pane = this.getPane ? this.getPane() : map.getPanes().markerPane
- var el = this._element = L.DomUtil.create('div', 'leaflet-zoom-animated leaflet-measure-path-measurement', pane)
- var inner = L.DomUtil.create('div', '', el)
- inner.title = this._title
- inner.innerHTML = this._measurement
-
- map.on('zoomanim', this._animateZoom, this)
-
- this._setPosition()
- },
-
- onRemove: function(map) {
- map.off('zoomanim', this._animateZoom, this)
- var pane = this.getPane ? this.getPane() : map.getPanes().markerPane
- pane.removeChild(this._element)
- this._map = null
- },
-
- _setPosition: function() {
- L.DomUtil.setPosition(this._element, this._map.latLngToLayerPoint(this._latlng))
- this._element.style.transform += ' rotate(' + this._rotation + 'rad)'
- },
-
- _animateZoom: function(opt) {
- var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center).round()
- L.DomUtil.setPosition(this._element, pos)
- this._element.style.transform += ' rotate(' + this._rotation + 'rad)'
- }
- })
-
- L.marker.measurement = function(latLng, measurement, title, rotation, options) {
- return new L.Marker.Measurement(latLng, measurement, title, rotation, options)
- }
-
- var formatDistance = function(d) {
- var unit,
- feet
-
- if (this._measurementOptions.imperial) {
- feet = d / 0.3048
- if (feet > 3000) {
- d = d / 1609.344
- unit = 'mi'
- } else {
- d = feet
- unit = 'ft'
- }
- } else {
- if (d > 1000) {
- d = d / 1000
- unit = 'km'
- } else {
- unit = 'm'
- }
- }
-
- if (d < 100) {
- return d.toFixed(1) + ' ' + unit
- } else {
- return Math.round(d) + ' ' + unit
- }
- }
-
- var formatArea = function(a) {
- var unit,
- sqfeet
-
- if (this._measurementOptions.imperial) {
- if (a > 404.685642) {
- a = a / 4046.85642
- unit = 'ac'
- } else {
- a = a / 0.09290304
- unit = 'ft虏'
- }
- } else {
- if (a > 1000000) {
- a = a / 1000000
- unit = 'km虏'
- } else {
- unit = 'm虏'
- }
- }
-
- if (a < 100) {
- return a.toFixed(1) + ' ' + unit
- } else {
- return Math.round(a) + ' ' + unit
- }
- }
-
- var RADIUS = 6378137
- // ringArea function copied from geojson-area
- // (https://github.com/mapbox/geojson-area)
- // This function is distributed under a separate license,
- // see LICENSE.md.
- var ringArea = function ringArea(coords) {
- var rad = function rad(_) {
- return _ * Math.PI / 180
- }
- var p1, p2, p3, lowerIndex, middleIndex, upperIndex,
- area = 0,
- coordsLength = coords.length
-
- if (coordsLength > 2) {
- for (var i = 0; i < coordsLength; i++) {
- if (i === coordsLength - 2) {// i = N-2
- lowerIndex = coordsLength - 2
- middleIndex = coordsLength -1
- upperIndex = 0
- } else if (i === coordsLength - 1) {// i = N-1
- lowerIndex = coordsLength - 1
- middleIndex = 0
- upperIndex = 1
- } else { // i = 0 to N-3
- lowerIndex = i
- middleIndex = i+1
- upperIndex = i+2
- }
- p1 = coords[lowerIndex]
- p2 = coords[middleIndex]
- p3 = coords[upperIndex]
- area += ( rad(p3.lng) - rad(p1.lng) ) * Math.sin( rad(p2.lat))
- }
-
- area = area * RADIUS * RADIUS / 2
- }
-
- return Math.abs(area)
- }
- /**
- * Handles the init hook for polylines and circles.
- * Implements the showOnHover functionality if called for.
- */
- var addInitHook = function() {
- var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
- if (this.options.showMeasurements && !showOnHover) {
- this.showMeasurements()
- }
- if (this.options.showMeasurements && showOnHover) {
- this.on('mouseover', function() {
- this.showMeasurements()
- })
- this.on('mouseout', function() {
- this.hideMeasurements()
- })
- }
- }
-
- var circleArea = function circleArea(d) {
- var rho = d / RADIUS
- return 2 * Math.PI * RADIUS * RADIUS * (1 - Math.cos(rho))
- }
-
- var override = function(method, fn, hookAfter) {
- if (!hookAfter) {
- return function() {
- var originalReturnValue = method.apply(this, arguments)
- var args = Array.prototype.slice.call(arguments)
- args.push(originalReturnValue)
- return fn.apply(this, args)
- }
- } else {
- return function() {
- fn.apply(this, arguments)
- return method.apply(this, arguments)
- }
- }
- }
-
- L.Polyline.include({
- showMeasurements: function(options) {
- if (!this._map || this._measurementLayer) return this
-
- this._measurementOptions = L.extend({
- showOnHover: (options && options.showOnHover) || false,
- minPixelDistance: 30,
- showDistances: true,
- showArea: true,
- showTotalDistance: true,
- lang: {
- totalLength: 'Total length',
- totalArea: 'Total area',
- segmentLength: 'Segment length'
- }
- }, options || {})
-
- this._measurementLayer = L.layerGroup().addTo(this._map)
- this.updateMeasurements()
-
- this._map.on('zoomend', this.updateMeasurements, this)
-
- return this
- },
-
- hideMeasurements: function() {
- if (!this._map) return this
-
- this._map.off('zoomend', this.updateMeasurements, this)
-
- if (!this._measurementLayer) return this
- this._map.removeLayer(this._measurementLayer)
- this._measurementLayer = null
-
- return this
- },
-
- onAdd: override(L.Polyline.prototype.onAdd, function(originalReturnValue) {
- var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
- if (this.options.showMeasurements && !showOnHover) {
- this.showMeasurements(this.options.measurementOptions)
- }
-
- return originalReturnValue
- }),
-
- onRemove: override(L.Polyline.prototype.onRemove, function(originalReturnValue) {
- this.hideMeasurements()
-
- return originalReturnValue
- }, true),
-
- setLatLngs: override(L.Polyline.prototype.setLatLngs, function(originalReturnValue) {
- this.updateMeasurements()
-
- return originalReturnValue
- }),
-
- spliceLatLngs: override(L.Polyline.prototype.spliceLatLngs, function(originalReturnValue) {
- this.updateMeasurements()
-
- return originalReturnValue
- }),
-
- formatDistance: formatDistance,
- formatArea: formatArea,
-
- updateMeasurements: function() {
- if (!this._measurementLayer) return this
-
- var latLngs = this.getLatLngs(),
- isPolygon = this instanceof L.Polygon,
- options = this._measurementOptions,
- totalDist = 0,
- formatter,
- ll1,
- ll2,
- p1,
- p2,
- pixelDist,
- dist
-
- if (latLngs && latLngs.length && L.Util.isArray(latLngs[0])) {
- // Outer ring is stored as an array in the first element,
- // use that instead.
- latLngs = latLngs[0]
- }
-
- this._measurementLayer.clearLayers()
-
- if (this._measurementOptions.showDistances && latLngs.length > 1) {
- formatter = this._measurementOptions.formatDistance || L.bind(this.formatDistance, this)
-
- for (var i = 1, len = latLngs.length; (isPolygon && i <= len) || i < len; i++) {
- ll1 = latLngs[i - 1]
- ll2 = latLngs[i % len]
- dist = ll1.distanceTo(ll2)
- totalDist += dist
-
- p1 = this._map.latLngToLayerPoint(ll1)
- p2 = this._map.latLngToLayerPoint(ll2)
-
- pixelDist = p1.distanceTo(p2)
-
- if (pixelDist >= options.minPixelDistance) {
- L.marker.measurement(
- this._map.layerPointToLatLng([(p1.x + p2.x) / 2, (p1.y + p2.y) / 2]),
- formatter(dist), options.lang.segmentLength, this._getRotation(ll1, ll2), options)
- .addTo(this._measurementLayer)
- }
- }
-
- // Show total length for polylines
- if (!isPolygon && this._measurementOptions.showTotalDistance) {
- L.marker.measurement(ll2, formatter(totalDist), options.lang.totalLength, 0, options)
- .addTo(this._measurementLayer)
- }
- }
-
- if (isPolygon && options.showArea && latLngs.length > 2) {
- formatter = options.formatArea || L.bind(this.formatArea, this)
- var area = ringArea(latLngs)
- L.marker.measurement(this.getBounds().getCenter(),
- formatter(area), options.lang.totalArea, 0, options)
- .addTo(this._measurementLayer)
- }
-
- return this
- },
-
- _getRotation: function(ll1, ll2) {
- var p1 = this._map.project(ll1),
- p2 = this._map.project(ll2)
-
- return Math.atan((p2.y - p1.y) / (p2.x - p1.x))
- }
- })
-
- L.Polyline.addInitHook(function() {
- addInitHook.call(this)
- })
-
- L.Circle.include({
- showMeasurements: function(options) {
- if (!this._map || this._measurementLayer) return this
-
- this._measurementOptions = L.extend({
- showOnHover: false,
- showArea: true,
- lang: {
- totalArea: 'Total area',
- }
- }, options || {})
-
- this._measurementLayer = L.layerGroup().addTo(this._map)
- this.updateMeasurements()
-
- this._map.on('zoomend', this.updateMeasurements, this)
-
- return this
- },
-
- hideMeasurements: function() {
- if (!this._map) return this
-
- this._map.on('zoomend', this.updateMeasurements, this)
-
- if (!this._measurementLayer) return this
- this._map.removeLayer(this._measurementLayer)
- this._measurementLayer = null
-
- return this
- },
-
- onAdd: override(L.Circle.prototype.onAdd, function(originalReturnValue) {
- var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
- if (this.options.showMeasurements && !showOnHover) {
- this.showMeasurements(this.options.measurementOptions)
- }
-
- return originalReturnValue
- }),
-
- onRemove: override(L.Circle.prototype.onRemove, function(originalReturnValue) {
- this.hideMeasurements()
-
- return originalReturnValue
- }, true),
-
- setLatLng: override(L.Circle.prototype.setLatLng, function(originalReturnValue) {
- this.updateMeasurements()
-
- return originalReturnValue
- }),
-
- setRadius: override(L.Circle.prototype.setRadius, function(originalReturnValue) {
- this.updateMeasurements()
-
- return originalReturnValue
- }),
-
- formatArea: formatArea,
-
- updateMeasurements: function() {
- if (!this._measurementLayer) return
-
- var latLng = this.getLatLng(),
- options = this._measurementOptions,
- formatter = options.formatArea || L.bind(this.formatArea, this)
-
- this._measurementLayer.clearLayers()
-
- if (options.showArea) {
- formatter = options.formatArea || L.bind(this.formatArea, this)
- var area = circleArea(this.getRadius())
- L.marker.measurement(latLng,
- formatter(area), options.lang.totalArea, 0, options)
- .addTo(this._measurementLayer)
- }
- }
- })
-
- L.Circle.addInitHook(function() {
- addInitHook.call(this)
- })
+/* eslint-disable */
+ !(function() {
+ 'use strict'
+
+ L.Marker.Measurement = L[L.Layer ? 'Layer' : 'Class'].extend({
+ options: {
+ pane: 'markerPane'
+ },
+
+ initialize: function(latlng, measurement, title, rotation, options) {
+ L.setOptions(this, options)
+
+ this._latlng = latlng
+ this._measurement = measurement
+ this._title = title
+ this._rotation = rotation
+ },
+
+ addTo: function(map) {
+ map.addLayer(this)
+ return this
+ },
+
+ onAdd: function(map) {
+ this._map = map
+ var pane = this.getPane ? this.getPane() : map.getPanes().markerPane
+ var el = this._element = L.DomUtil.create('div', 'leaflet-zoom-animated leaflet-measure-path-measurement', pane)
+ var inner = L.DomUtil.create('div', '', el)
+ inner.title = this._title
+ inner.innerHTML = this._measurement
+
+ map.on('zoomanim', this._animateZoom, this)
+
+ this._setPosition()
+ },
+
+ onRemove: function(map) {
+ map.off('zoomanim', this._animateZoom, this)
+ var pane = this.getPane ? this.getPane() : map.getPanes().markerPane
+ pane.removeChild(this._element)
+ this._map = null
+ },
+
+ _setPosition: function() {
+ L.DomUtil.setPosition(this._element, this._map.latLngToLayerPoint(this._latlng))
+ this._element.style.transform += ' rotate(' + this._rotation + 'rad)'
+ },
+
+ _animateZoom: function(opt) {
+ var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center).round()
+ L.DomUtil.setPosition(this._element, pos)
+ this._element.style.transform += ' rotate(' + this._rotation + 'rad)'
+ }
+ })
+
+ L.marker.measurement = function(latLng, measurement, title, rotation, options) {
+ return new L.Marker.Measurement(latLng, measurement, title, rotation, options)
+ }
+
+ var formatDistance = function(d) {
+ var unit,
+ feet
+
+ if (this._measurementOptions.imperial) {
+ feet = d / 0.3048
+ if (feet > 3000) {
+ d = d / 1609.344
+ unit = 'mi'
+ } else {
+ d = feet
+ unit = 'ft'
+ }
+ } else {
+ if (d > 1000) {
+ d = d / 1000
+ unit = 'km'
+ } else {
+ unit = 'm'
+ }
+ }
+
+ if (d < 100) {
+ return d.toFixed(1) + ' ' + unit
+ } else {
+ return Math.round(d) + ' ' + unit
+ }
+ }
+
+ var formatArea = function(a) {
+ var unit,
+ sqfeet
+
+ if (this._measurementOptions.imperial) {
+ if (a > 404.685642) {
+ a = a / 4046.85642
+ unit = 'ac'
+ } else {
+ a = a / 0.09290304
+ unit = 'ft虏'
+ }
+ } else {
+ if (a > 1000000) {
+ a = a / 1000000
+ unit = 'km虏'
+ } else {
+ unit = 'm虏'
+ }
+ }
+
+ if (a < 100) {
+ return a.toFixed(1) + ' ' + unit
+ } else {
+ return Math.round(a) + ' ' + unit
+ }
+ }
+
+ var RADIUS = 6378137
+ // ringArea function copied from geojson-area
+ // (https://github.com/mapbox/geojson-area)
+ // This function is distributed under a separate license,
+ // see LICENSE.md.
+ var ringArea = function ringArea(coords) {
+ var rad = function rad(_) {
+ return _ * Math.PI / 180
+ }
+ var p1, p2, p3, lowerIndex, middleIndex, upperIndex,
+ area = 0,
+ coordsLength = coords.length
+
+ if (coordsLength > 2) {
+ for (var i = 0; i < coordsLength; i++) {
+ if (i === coordsLength - 2) {// i = N-2
+ lowerIndex = coordsLength - 2
+ middleIndex = coordsLength -1
+ upperIndex = 0
+ } else if (i === coordsLength - 1) {// i = N-1
+ lowerIndex = coordsLength - 1
+ middleIndex = 0
+ upperIndex = 1
+ } else { // i = 0 to N-3
+ lowerIndex = i
+ middleIndex = i+1
+ upperIndex = i+2
+ }
+ p1 = coords[lowerIndex]
+ p2 = coords[middleIndex]
+ p3 = coords[upperIndex]
+ area += ( rad(p3.lng) - rad(p1.lng) ) * Math.sin( rad(p2.lat))
+ }
+
+ area = area * RADIUS * RADIUS / 2
+ }
+
+ return Math.abs(area)
+ }
+ /**
+ * Handles the init hook for polylines and circles.
+ * Implements the showOnHover functionality if called for.
+ */
+ var addInitHook = function() {
+ var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
+ if (this.options.showMeasurements && !showOnHover) {
+ this.showMeasurements()
+ }
+ if (this.options.showMeasurements && showOnHover) {
+ this.on('mouseover', function() {
+ this.showMeasurements()
+ })
+ this.on('mouseout', function() {
+ this.hideMeasurements()
+ })
+ }
+ }
+
+ var circleArea = function circleArea(d) {
+ var rho = d / RADIUS
+ return 2 * Math.PI * RADIUS * RADIUS * (1 - Math.cos(rho))
+ }
+
+ var override = function(method, fn, hookAfter) {
+ if (!hookAfter) {
+ return function() {
+ var originalReturnValue = method.apply(this, arguments)
+ var args = Array.prototype.slice.call(arguments)
+ args.push(originalReturnValue)
+ return fn.apply(this, args)
+ }
+ } else {
+ return function() {
+ fn.apply(this, arguments)
+ return method.apply(this, arguments)
+ }
+ }
+ }
+
+ L.Polyline.include({
+ showMeasurements: function(options) {
+ if (!this._map || this._measurementLayer) return this
+
+ this._measurementOptions = L.extend({
+ showOnHover: (options && options.showOnHover) || false,
+ minPixelDistance: 30,
+ showDistances: true,
+ showArea: true,
+ showTotalDistance: true,
+ lang: {
+ totalLength: 'Total length',
+ totalArea: 'Total area',
+ segmentLength: 'Segment length'
+ }
+ }, options || {})
+
+ this._measurementLayer = L.layerGroup().addTo(this._map)
+ this.updateMeasurements()
+
+ this._map.on('zoomend', this.updateMeasurements, this)
+
+ return this
+ },
+
+ hideMeasurements: function() {
+ if (!this._map) return this
+
+ this._map.off('zoomend', this.updateMeasurements, this)
+
+ if (!this._measurementLayer) return this
+ this._map.removeLayer(this._measurementLayer)
+ this._measurementLayer = null
+
+ return this
+ },
+
+ onAdd: override(L.Polyline.prototype.onAdd, function(originalReturnValue) {
+ var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
+ if (this.options.showMeasurements && !showOnHover) {
+ this.showMeasurements(this.options.measurementOptions)
+ }
+
+ return originalReturnValue
+ }),
+
+ onRemove: override(L.Polyline.prototype.onRemove, function(originalReturnValue) {
+ this.hideMeasurements()
+
+ return originalReturnValue
+ }, true),
+
+ setLatLngs: override(L.Polyline.prototype.setLatLngs, function(originalReturnValue) {
+ this.updateMeasurements()
+
+ return originalReturnValue
+ }),
+
+ spliceLatLngs: override(L.Polyline.prototype.spliceLatLngs, function(originalReturnValue) {
+ this.updateMeasurements()
+
+ return originalReturnValue
+ }),
+
+ formatDistance: formatDistance,
+ formatArea: formatArea,
+
+ updateMeasurements: function() {
+ if (!this._measurementLayer) return this
+
+ var latLngs = this.getLatLngs(),
+ isPolygon = this instanceof L.Polygon,
+ options = this._measurementOptions,
+ totalDist = 0,
+ formatter,
+ ll1,
+ ll2,
+ p1,
+ p2,
+ pixelDist,
+ dist
+
+ if (latLngs && latLngs.length && L.Util.isArray(latLngs[0])) {
+ // Outer ring is stored as an array in the first element,
+ // use that instead.
+ latLngs = latLngs[0]
+ }
+
+ this._measurementLayer.clearLayers()
+
+ if (this._measurementOptions.showDistances && latLngs.length > 1) {
+ formatter = this._measurementOptions.formatDistance || L.bind(this.formatDistance, this)
+
+ for (var i = 1, len = latLngs.length; (isPolygon && i <= len) || i < len; i++) {
+ ll1 = latLngs[i - 1]
+ ll2 = latLngs[i % len]
+ dist = ll1.distanceTo(ll2)
+ totalDist += dist
+
+ p1 = this._map.latLngToLayerPoint(ll1)
+ p2 = this._map.latLngToLayerPoint(ll2)
+
+ pixelDist = p1.distanceTo(p2)
+
+ if (pixelDist >= options.minPixelDistance) {
+ L.marker.measurement(
+ this._map.layerPointToLatLng([(p1.x + p2.x) / 2, (p1.y + p2.y) / 2]),
+ formatter(dist), options.lang.segmentLength, this._getRotation(ll1, ll2), options)
+ .addTo(this._measurementLayer)
+ }
+ }
+
+ // Show total length for polylines
+ if (!isPolygon && this._measurementOptions.showTotalDistance) {
+ L.marker.measurement(ll2, formatter(totalDist), options.lang.totalLength, 0, options)
+ .addTo(this._measurementLayer)
+ }
+ }
+
+ if (isPolygon && options.showArea && latLngs.length > 2) {
+ formatter = options.formatArea || L.bind(this.formatArea, this)
+ var area = ringArea(latLngs)
+ L.marker.measurement(this.getBounds().getCenter(),
+ formatter(area), options.lang.totalArea, 0, options)
+ .addTo(this._measurementLayer)
+ }
+
+ return this
+ },
+
+ _getRotation: function(ll1, ll2) {
+ var p1 = this._map.project(ll1),
+ p2 = this._map.project(ll2)
+
+ return Math.atan((p2.y - p1.y) / (p2.x - p1.x))
+ }
+ })
+
+ L.Polyline.addInitHook(function() {
+ addInitHook.call(this)
+ })
+
+ L.Circle.include({
+ showMeasurements: function(options) {
+ if (!this._map || this._measurementLayer) return this
+
+ this._measurementOptions = L.extend({
+ showOnHover: false,
+ showArea: true,
+ lang: {
+ totalArea: 'Total area',
+ }
+ }, options || {})
+
+ this._measurementLayer = L.layerGroup().addTo(this._map)
+ this.updateMeasurements()
+
+ this._map.on('zoomend', this.updateMeasurements, this)
+
+ return this
+ },
+
+ hideMeasurements: function() {
+ if (!this._map) return this
+
+ this._map.on('zoomend', this.updateMeasurements, this)
+
+ if (!this._measurementLayer) return this
+ this._map.removeLayer(this._measurementLayer)
+ this._measurementLayer = null
+
+ return this
+ },
+
+ onAdd: override(L.Circle.prototype.onAdd, function(originalReturnValue) {
+ var showOnHover = this.options.measurementOptions && this.options.measurementOptions.showOnHover
+ if (this.options.showMeasurements && !showOnHover) {
+ this.showMeasurements(this.options.measurementOptions)
+ }
+
+ return originalReturnValue
+ }),
+
+ onRemove: override(L.Circle.prototype.onRemove, function(originalReturnValue) {
+ this.hideMeasurements()
+
+ return originalReturnValue
+ }, true),
+
+ setLatLng: override(L.Circle.prototype.setLatLng, function(originalReturnValue) {
+ this.updateMeasurements()
+
+ return originalReturnValue
+ }),
+
+ setRadius: override(L.Circle.prototype.setRadius, function(originalReturnValue) {
+ this.updateMeasurements()
+
+ return originalReturnValue
+ }),
+
+ formatArea: formatArea,
+
+ updateMeasurements: function() {
+ if (!this._measurementLayer) return
+
+ var latLng = this.getLatLng(),
+ options = this._measurementOptions,
+ formatter = options.formatArea || L.bind(this.formatArea, this)
+
+ this._measurementLayer.clearLayers()
+
+ if (options.showArea) {
+ formatter = options.formatArea || L.bind(this.formatArea, this)
+ var area = circleArea(this.getRadius())
+ L.marker.measurement(latLng,
+ formatter(area), options.lang.totalArea, 0, options)
+ .addTo(this._measurementLayer)
+ }
+ }
+ })
+
+ L.Circle.addInitHook(function() {
+ addInitHook.call(this)
+ })
})()
\ No newline at end of file
diff --git a/src/components/table/components/SolidWaste.vue b/src/components/table/components/SolidWaste.vue
index c90311a..89be52e 100644
--- a/src/components/table/components/SolidWaste.vue
+++ b/src/components/table/components/SolidWaste.vue
@@ -1,111 +1,201 @@
<template>
- <div class="Solid-Waste">
- <el-table
- class="tableBox"
- :data="tableData"
- :header-cell-style="tableHeaderColor"
- :cell-style="rowClass"
- @cell-click="handle"
- >
- <el-table-column
- width="30px"
- label=""
- >
- <template>
- <i class="el-icon-caret-right"></i>
- <span style="margin-left: 10px"></span>
- </template>
- </el-table-column>
- <el-table-column
- label="搴忓彿"
- width="60px"
- type="index">
- </el-table-column>
- <el-table-column
- prop="UserName"
- label="浼佷笟鍚嶇О"
- width="120px">
- <template slot-scope="scope">
- <div v-if="scope.row.UserName==='闆嗗洟鍚嶇О'" style="color: #00ffff">{{scope.row.UserName}}</div>
- <div v-else-if="scope.row.UserName==='澶╂触鐭冲寲'" style="color: #00ffff">{{scope.row.UserName}}</div>
- <div v-else >{{scope.row.UserName}}</div>
- </template>
- </el-table-column>
- <el-table-column label="浜х敓閲� 锛堝惃锛�">
- <el-table-column
- prop="AddOutPut"
- label="涓�鑸浐搴�"
- width="100px">
- </el-table-column>
- <el-table-column
- prop="MonthOutPut"
- label="鍗遍櫓搴熺墿"
- width="100px">
- </el-table-column>
- </el-table-column>
- <el-table-column label="璐瓨鐘舵�侊紙涓級">
- <el-table-column
- prop="normal"
- label="姝ｅ父"
- width="100px">
- <template slot-scope="{row,$index}">
- <u v-if="$index!=1" >{{row.normal}}</u>
- <el-popover v-else
- placement="bottom-end"
- width="200"
- trigger="click"
- title="鐩戞祴鐐规帓鏀炬槑缁�"
- >
- <ChemicalWastewater></ChemicalWastewater>
- <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
- </el-popover>
- </template>
- </el-table-column>
- <el-table-column
- prop="warning"
- label="棰勮"
- width="100px">
- </el-table-column>
- </el-table-column>
- </el-table>
- </div>
+ <div class="waste-water">
+ <el-table
+ class="tableBox"
+ :data="tableData"
+ style="width: 100%"
+ :header-cell-style="tableHeaderColor"
+ :cell-style="rowClass"
+ @cell-click="handle"
+ >
+ <el-table-column
+ width="30px"
+ label=""
+ >
+ <template slot-scope="{row,$index}">
+ <!-- <i class="el-icon-caret-right" v-if="$index ===1"></i>-->
+ <el-popover
+ placement="bottom"
+ trigger="click"
+ :disabled="!isShowIcon"
+ popper-class="popovers"
+ >
+ <ChemicalWastewater v-show="$index ===1"></ChemicalWastewater>
+ <i class="el-icon-caret-right" :class="{active: isActive === $index}" slot="reference" @click="doIcon($index)"></i>
+ <!-- <i class="el-icon-caret-bottom" slot="reference" v-else @click="doIcon($index)"></i>-->
+ </el-popover>
+ </template>
+ </el-table-column>
+ <el-table-column
+ label="搴忓彿"
+ width="45px"
+ type="index">
+ </el-table-column>
+ <el-table-column
+ prop="UserName"
+ label="浼佷笟鍚嶇О"
+ width="120px">
+ <template slot-scope="scope">
+ <div v-if="scope.row.UserName==='闆嗗洟鍚嶇О'" style="color: #00ffff">{{scope.row.UserName}}</div>
+ <div v-else-if="scope.row.UserName==='澶╂触鐭冲寲'" style="color: #00ffff">{{scope.row.UserName}}</div>
+ <div v-else >{{scope.row.UserName}}</div>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="WasteWaters"
+ label="澶栨帓搴熸按閲忥紙m鲁锛�"
+ width="100px">
+ </el-table-column>
+ <el-table-column label="COD (t)">
+ <el-table-column
+ prop="AddOutPut"
+ label="绱浜х敓閲�"
+ width="70px">
+ </el-table-column>
+ <el-table-column
+ prop="MonthOutPut"
+ label="褰撴湀鐢熶骇閲�"
+ width="70px">
+ </el-table-column>
+ </el-table-column>
+ <el-table-column label="姘ㄦ爱 (t)">
+ <el-table-column
+ prop="NH4NPut"
+ label="绱浜х敓閲�"
+ width="70px">
+ </el-table-column>
+ <el-table-column
+ prop="NH4NMonth"
+ label="褰撴湀鐢熶骇閲�"
+ width="70px">
+ </el-table-column>
+ </el-table-column>
+ <el-table-column label="鎺掓斁鍙ｆ娴嬬粺璁＄姸鎬�">
+ <el-table-column
+ prop="normal"
+ label="姝ｅ父"
+ width="60px">
+ <template slot-scope="{row,$index}">
+ <u v-if="$index!=2" >{{row.normal}}</u>
+ <el-popover v-else
+ placement="bottom-end"
+ width="200"
+ trigger="click"
+ popper-class="popovers"
+ title="鐩戞祴鐐规槑缁嗚〃"
+ >
+ <refinery></refinery>
+ <u slot="reference" style="color: #00ffff">{{row.normal}}</u>
+ <!-- <i class="el-icon-caret-bottom" v-else-if="isShowIcon&&scope.row.index===1"></i>-->
+ <!-- <i v-if="isShowIcon" class="el-icon-caret-bottom" slot="reference" @click="isbtn"></i>-->
+ <!-- <i v-else class="el-icon-caret-right" slot="reference" @click="isbtn"></i>-->
+ </el-popover>
+ </template>
+ </el-table-column>
+ <el-table-column
+ prop="overProof"
+ label="瓒呮爣"
+ width="60px">
+ </el-table-column>
+ <el-table-column
+ prop="Abnormal"
+ label="寮傚父"
+ width="60px">
+ </el-table-column>
+ <el-table-column
+ prop="StopProduction"
+ label="鍋滀骇"
+ width="60px">
+ </el-table-column>
+ <el-table-column
+ prop="deficiency"
+ label="缂哄け"
+ width="60px">
+ <template slot-scope="{row,$index}">
+ <u v-if="$index!=1" >{{row.deficiency}}</u>
+ <el-popover v-else
+ placement="bottom-end"
+ width="200"
+ trigger="click"
+ title="澶╂触鐭冲寲鐩戞祴鐐圭己澶辨姤璀︽槑缁�"
+ popper-class="popovers"
+ >
+ <MissingAlarm></MissingAlarm>
+ <u slot="reference" style="color: #00ffff">{{row.deficiency}}</u>
+ </el-popover>
+ </template>
+ </el-table-column>
+ </el-table-column>
+ </el-table>
+ <!-- <ChemicalWastewater v-show="isShowIcon"></ChemicalWastewater>-->
+ <!-- </el-col>-->
+ <!-- </el-row>-->
+ </div>
</template>
<script>
-import ChemicalWastewater from '@components/table/components/componented/ChemicalWastewater'
+import ChemicalWastewater from './componented/ChemicalWastewater'
+import Refinery from '@components/table/components/componented/refinery'
+import MissingAlarm from '@components/table/components/componented/MissingAlarm'
export default {
name: 'SolidWaste',
components: {
+ MissingAlarm,
+ Refinery,
ChemicalWastewater
},
data () {
return {
+ isActive: '',
+ isShowIcon: false,
tableData: [{
UserName: '闆嗗洟鍚嶇О',
- AddOutPut: '580',
- MonthOutPut: '250',
- normal: '10',
- warning: '9'
+ WasteWaters: '',
+ AddOutPut: '',
+ MonthOutPut: '',
+ NH4NPut: '',
+ NH4NMonth: '',
+ normal: '',
+ overProof: '',
+ Abnormal: '',
+ StopProduction: '',
+ deficiency: ''
}, {
UserName: '澶╂触鐭冲寲',
WasteWaters: '116.6',
AddOutPut: '58.3',
MonthOutPut: '13.1',
- warning: '13.1',
- normal: '21'
+ NH4NPut: '58.3',
+ NH4NMonth: '13.1',
+ normal: '21',
+ overProof: '2',
+ Abnormal: '2',
+ StopProduction: '2',
+ deficiency: '2'
}, {
UserName: 'xxxx鐐煎寲3',
WasteWaters: '116.6',
MonthOutPut: '13.1',
- warning: '13.1',
- normal: '21'
+ NH4NPut: '58.3',
+ NH4NMonth: '13.1',
+ normal: '21',
+ overProof: '2',
+ Abnormal: '2',
+ StopProduction: '2',
+ deficiency: '2'
}, {
UserName: 'xxxx4',
WasteWaters: '116.6',
AddOutPut: '58.3',
MonthOutPut: '13.1',
- warning: '13.1',
- normal: '21'
+ NH4NPut: '58.3',
+ NH4NMonth: '13.1',
+ normal: '21',
+ overProof: '2',
+ Abnormal: '2',
+ StopProduction: '2',
+ deficiency: '2'
+
}]
}
},
@@ -120,14 +210,35 @@
// 鑾峰彇鐐瑰嚮鐨勮〃鏍�
handle (row, column, event, cell) {
console.log(row.UserName)
+ },
+ doIcon (index) {
+ if (index !== 1) {
+ this.isShowIcon = false
+ this.isActive = ''
+ return
+ }
+ this.isShowIcon = !this.isShowIcon
+ if (index === this.isActive) {
+ this.isActive = ''
+ return
+ }
+ this.isActive = index
}
}
}
</script>
<style scoped>
-.Solid-Waste{
- width: 100%;
- height: 100%;
+.popovers{
+ width: auto !important;
+ background-color: gray !important;
}
+.popovers.el-popover{
+ padding:0;
+}
+.active {
+ /*color: red;*/
+ transform:rotate(90deg);
+}
+
</style>
diff --git a/src/components/table/components/tabHandover.vue b/src/components/table/components/tabHandover.vue
index ed43d60..35a1739 100644
--- a/src/components/table/components/tabHandover.vue
+++ b/src/components/table/components/tabHandover.vue
@@ -4,7 +4,8 @@
<waste-water></waste-water>
</el-tab-pane>
<el-tab-pane label="搴熸皵" name="second">
- <waste-gas></waste-gas>
+ <waste-water></waste-water>
+<!-- <waste-gas></waste-gas>-->
</el-tab-pane>
<el-tab-pane label="鍥哄簾" name="third">
<solid-waste></solid-waste>
@@ -17,14 +18,14 @@
<script>
import WasteWater from '@components/table/components/WasteWater'
-import WasteGas from '@components/table/components/WasteGas'
+// import WasteGas from '@components/table/components/WasteGas'
import SolidWaste from '@components/table/components/SolidWaste'
import AirQuality from '@components/table/components/AirQuality'
export default {
name: 'tabHandover',
components: {
WasteWater,
- WasteGas,
+ // WasteGas,
SolidWaste,
AirQuality
},
diff --git a/src/components/table/summarySheets.vue b/src/components/table/summarySheets.vue
index 4ab8d7a..41239cf 100644
--- a/src/components/table/summarySheets.vue
+++ b/src/components/table/summarySheets.vue
@@ -1,37 +1,87 @@
<template>
- <div class="summary-sheets">
- <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="缁熻琛�" placement="left">
- <div :class='["iconBtn",summaryVisible ? "active-button" : ""]' @click="closeBtn">
+ <div class="summary-sheets">
+ <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎶ヨ〃" placement="left">
+ <div :class='["iconBtn",subtopic ? "active-button" : ""]' @click="subtopicBtn" >
+ <i class="el-icon-tickets icon"></i>
+ </div>
+ </el-tooltip>
+ <transition name="animationChange">
+ <div class="subtopic" v-if="subtopic">
+ <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="缁熻琛�" placement="bottom">
+ <div :class='["iconBtn",summaryVisible ? "active-button" : ""]' @click="closeBtn">
<img src="@assets/images/map-pages/icon/toolbox/table.png" alt="" class="icon">
<!--<span class="icon-name">缁熻琛�</span>-->
- </div>
- </el-tooltip>
- <Dialog ref="summarySheets" title="浼佷笟鎸囨爣鍒嗙被缁熻">
- <tab-handover></tab-handover>
- </Dialog >
- </div>
+ </div>
+ </el-tooltip>
+ <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="鎸囨爣" placement="bottom">
+ <div :class='["iconBtn",companyVisible ? "active-button" : ""]' @click="showStatisDialog()" >
+ <!-- <img src="@/assets/images/map-pages/icon/map/company.png" alt="" class="icon"> -->
+ <i class="el-icon-office-building icon"></i>
+ </div>
+ </el-tooltip>
+ <el-tooltip :popper-class="'map-tooltip'" effect="dark" content="棰勬姤璀�" placement="bottom">
+ <div :class='["iconBtn",warnVisible ? "active-button" : ""]' @click="showWarnDialog()" >
+ <img src="@/assets/images/map-pages/icon/map/warn.png" alt="" class="icon">
+ <!--<span class="icon-name">棰勬姤璀�</span>-->
+ </div>
+ </el-tooltip>
+ </div>
+ </transition>
+ <Dialog ref="summarySheets" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻" >
+ <tab-handover></tab-handover>
+ </Dialog>
+ <Dialog ref="warnDialog" title="浼佷笟棰勮鎶ヨ鍒嗙被缁熻" >
+ <warn></warn>
+ </Dialog>
+ <Dialog ref="indexStatisticsDialog" title="浼佷笟鎸囨爣鍒嗙被缁熻">
+ <index-statistics></index-statistics>
+ </Dialog>
+ </div>
</template>
<script>
import tabHandover from '@components/table/components/tabHandover'
-import Dialog from '@views/popup/Dialog'
+// import Dialog from '@views/popup/Dialog'
+import Dialog from '../../views/popup/Dialog'
+import Warn from './components/Warn'
+import IndexStatistics from './components/IndexStatistics'
+
+import '@/components/BaseNav/SolidWaste/directive/dir'
+
export default {
name: 'summary-sheet.vue',
components: {
tabHandover,
- Dialog
+ Dialog,
+ Warn,
+ IndexStatistics
+ // Dialog
},
data () {
return {
- summaryVisible: false
+ summaryVisible: false,
+ dialogShow: false,
+ comp: Warn,
+ warnVisible: false,
+ companyVisible: false,
+ subtopic: false
}
},
methods: {
closeBtn () {
- // const summary = document.getElementById('summary')
- // summary.style.display = 'none'
this.$refs.summarySheets.show()
this.summaryVisible = true
+ },
+ showWarnDialog () {
+ this.$refs.warnDialog.show()
+ this.warnVisible = true
+ },
+ showStatisDialog () {
+ this.$refs.indexStatisticsDialog.show()
+ this.companyVisible = true
+ },
+ subtopicBtn () {
+ this.subtopic = !this.subtopic
}
},
mounted () {
@@ -40,25 +90,63 @@
this.$refs.summarySheets.$on('closeDialog', () => {
that.summaryVisible = false
})
+ this.$refs.warnDialog.$on('closeDialog', () => {
+ that.warnVisible = false
+ })
+ this.$refs.indexStatisticsDialog.$on('closeDialog', () => {
+ that.companyVisible = false
+ })
})
}
}
</script>
<style scoped lang="less">
- .summary-sheets {
- position: absolute;
- top: 0.42979rem;
- left: 0.14583rem;
- /*width: 850px;*/
- /*height: 265px;*/
- z-index:500;
+ .animationChange-enter-active, .animationChange-leave-active {
+ transition: all 0.5s;
+ }
- /*color: #fff;*/
- .el-icon-c-scale-to-original {
- width: 30px;
- height: 30px;
- font-size: 30px;
- }
+ .animationChange-enter, .animationChange-leave-to {
+ opacity: 0;
+ transform: translateX(-100px);
+ }
+
+.summary-sheets {
+ position: absolute;
+ display: inline-flex;
+ overflow: hidden;
+ top: 0.42979rem;
+ left: 0.14583rem;
+ /*width: 850px;*/
+ /*height: 265px;*/
+ z-index: 500;
+ .subtopic{
+ display: inline-flex;
+ .iconBtn{
+ margin-left: 0.03rem;
+ border-color:#DCDFE6;
+ color:#fff;
}
+ .iconBtn.active-button{
+ border-color:#00fff6 !important;
+ color:#00fff6 !important;
+ }
+ }
+
+ .dialog {
+ //width: 800px;
+ //height: 300px;
+ position: absolute;
+ top: 15%;
+ left: 3rem;
+ }
+
+ /*color: #fff;*/
+
+ .el-icon-c-scale-to-original {
+ width: 30px;
+ height: 30px;
+ font-size: 30px;
+ }
+}
</style>
diff --git a/src/conf/Constants.js b/src/conf/Constants.js
index 6784be5..848d666 100644
--- a/src/conf/Constants.js
+++ b/src/conf/Constants.js
@@ -20,7 +20,7 @@
OPACITY: 1,
DASH_ARRAY: '4,4',
DASH_SPPED: -5,
- ICON_SIZE: [20, 20]
+ ICON_SIZE: [10, 10]
}
export const props = {
diff --git a/src/conf/LayerPipeLine.js b/src/conf/LayerPipeLine.js
index 46807c3..289a7fe 100644
--- a/src/conf/LayerPipeLine.js
+++ b/src/conf/LayerPipeLine.js
@@ -9,5 +9,6 @@
code: 'sewersPipeLine',
name: '绠＄嚎鏁版嵁',
checked: true,
+ isShow: true,
layers: [LayerPipeLines, LayerPk, LayerArea]
}
diff --git a/src/conf/LayerTopic.js b/src/conf/LayerTopic.js
index 1e1fe7d..da1a49e 100644
--- a/src/conf/LayerTopic.js
+++ b/src/conf/LayerTopic.js
@@ -8,10 +8,14 @@
import { LayerEnvRisk } from './layers/LayerEnvRisk'
import { LayerSoilGroundWater } from './layers/LayerSoilGroundWater'
import { LayerPollutionSources } from './layers/LayerPollutionSources'
+import { LayerPipeLines } from './layers/LayerPipeLines'
+import { LayerArea } from './layers/LayerArea'
+import { LayerVideo } from './layers/LayerVideo'
export const LayerTopic = {
code: 'sewersTopic',
name: '涓撻鍥惧眰',
checked: true,
- layers: [LayerPollutionSources, LayerWasteWater, LayerWasteGas, LayerWasteSolid, LayerAirQuality, LayerEnvRisk, LayerSoilGroundWater]
+ isShow: true,
+ layers: [LayerPollutionSources, LayerWasteWater, LayerWasteGas, LayerWasteSolid, LayerAirQuality, LayerEnvRisk, LayerSoilGroundWater, LayerPipeLines, LayerVideo, LayerArea]
}
diff --git a/src/conf/MapConfig.js b/src/conf/MapConfig.js
index 4dff288..a89c954 100644
--- a/src/conf/MapConfig.js
+++ b/src/conf/MapConfig.js
@@ -2,7 +2,6 @@
import TDT from './TDT'
import { LayerSewersPoint } from './layers/LayerSewers'
import { LayerTopic } from './LayerTopic'
-import { LayerPipeLine } from './LayerPipeLine'
import { LayerBasin } from './layers/LayerBasin'
const curWwwPath = window.document.location.href
@@ -43,7 +42,7 @@
IntranetBaseMaps: TDT.intranet,
InternetBaseMaps: TDT.internet,
Layers: {
- LayerSewersLine: [LayerBasin, LayerTopic, LayerPipeLine],
+ LayerSewersLine: [LayerBasin, LayerTopic],
layerSewersPoint: LayerSewersPoint
} // 姹￠洦姘村浘灞傞厤缃�
}
diff --git a/src/conf/layers/LayerBasin.js b/src/conf/layers/LayerBasin.js
index 1476068..af3dae6 100644
--- a/src/conf/layers/LayerBasin.js
+++ b/src/conf/layers/LayerBasin.js
@@ -7,6 +7,7 @@
code: 'sewersBasin',
name: '鍖哄煙鍥惧眰',
checked: true,
+ isShow: true,
layers: [
{
code: 'basinCj',
diff --git a/src/conf/layers/LayerEnvRisk.js b/src/conf/layers/LayerEnvRisk.js
index 5e24a1f..eef22d8 100644
--- a/src/conf/layers/LayerEnvRisk.js
+++ b/src/conf/layers/LayerEnvRisk.js
@@ -14,7 +14,8 @@
sname: '椋庨櫓缁熻鍥�', // 琛ㄥ悕
checked: true, // 榛樿閫変腑鐘舵��
url: WFS_URL + '?TYPENAME=鍏徃',
- minZoom: 10
+ minZoom: 10,
+ color: ''
},
{
code: 'envRiskMaterial',
@@ -22,7 +23,8 @@
sname: '鐗╄祫搴�',
checked: true, // 榛樿閫変腑鐘舵��
wfs: WFS_URL + '?TYPENAME=鐮佸ご',
- minZoom: 10
+ minZoom: 10,
+ color: ''
},
{
code: 'envRiskMajor',
@@ -30,7 +32,8 @@
sname: '閲嶅ぇ椋庨櫓',
checked: true, // 榛樿閫変腑鐘舵��
wfs: WFS_URL + '?TYPENAME=瑁呯疆鍖�',
- minZoom: 10
+ minZoom: 10,
+ color: 'red'
},
{
code: 'envRiskFirst',
@@ -38,7 +41,8 @@
sname: '涓�绾ч闄�',
checked: true, // 榛樿閫変腑鐘舵��
wfs: WFS_URL + '?TYPENAME=瑁呯疆鍖�',
- minZoom: 10
+ minZoom: 10,
+ color: 'sandybrown'
},
{
code: 'envRiskSecond',
@@ -46,7 +50,8 @@
sname: '浜岀骇椋庨櫓',
checked: true, // 榛樿閫変腑鐘舵��
wfs: WFS_URL + '?TYPENAME=瑁呯疆鍖�',
- minZoom: 10
+ minZoom: 10,
+ color: 'yellow'
}
]
}
diff --git a/src/conf/layers/LayerVideo.js b/src/conf/layers/LayerVideo.js
new file mode 100644
index 0000000..2222f80
--- /dev/null
+++ b/src/conf/layers/LayerVideo.js
@@ -0,0 +1,8 @@
+/**
+ * 瑙嗛鐩戞帶
+ */
+export const LayerVideo = {
+ code: 'sewersVideo',
+ name: '瑙嗛鐩戞帶',
+ checked: false
+}
diff --git a/src/views/MapTemplate.vue b/src/views/MapTemplate.vue
index e19b47f..2c80ca3 100644
--- a/src/views/MapTemplate.vue
+++ b/src/views/MapTemplate.vue
@@ -10,7 +10,7 @@
<!-- <menu-special></menu-special>-->
<legend-panel></legend-panel>
<summary-sheets></summary-sheets>
- <enterprise></enterprise>
+ <!-- <enterprise></enterprise> -->
<!-- <el-button id="map-btn" el-icon-c-scale-to-original icon="el-icon-c-scale-to-original" circle @click="isShowHidden"></el-button>-->
<!-- <el-button type="primary" @click="ChangeState" class="solid-waste">鍥哄簾</el-button>-->
<!-- <el-button type="primary" @click="ChangeWaterState" class="Waste-water">搴熸按</el-button>-->
@@ -31,7 +31,7 @@
import Popup from '@views/popup/Popup'
// import MenuSpecial from '@components/panel/MenuTopic'
import LegendPanel from '@components/panel/LegendPanel'
-import Enterprise from '../components/table/enterprise'
+// import Enterprise from '../components/table/enterprise'
// // 鍏叡灞曠ず鏁版嵁
import PublicBounced from '@components/BaseNav/PublicBounced/PublicBounced'
import LayerFactory from '@components/LayerController/service/LayerFactory'
@@ -39,7 +39,7 @@
export default {
name: 'MapTemplate',
components: {
- Enterprise,
+ // Enterprise,
LegendPanel,
// MenuSpecial,
ToolBoxPanel,
@@ -91,6 +91,7 @@
map: this.map
})
layerFactory.init(this.$store.state.map.serviceLayers.LayerSewersLine)
+ layerFactory.init(this.$store.state.map.serviceLayers.layerSewersPoint)
window.layerFactory = layerFactory
this.basemapHelper = Sgis.initBasemapsHelper(this.map) // 鍒濆鍖栧熀纭�搴曞浘鍔╂墜
--
Gitblit v1.8.0