火灾蔓延

src/api/forest.js

@@ -1,5 +1,32 @@
 import request from '@/utils/request'
 
+// 获取消防左侧菜单列表
+export function fireControlViewList() {
+  return request({
+    url: '/center-firecontrol/VisuForestDataCenterController/fireControlViewList',
+    method: 'post',
+  })
+}
+// 点击左侧菜单列表查询落点
+export function fireControlViewPoint(type, name) {
+  return request({
+    url: '/center-firecontrol/VisuForestDataCenterController/fireControlViewPoint',
+    method: 'post',
+    data:{
+      // "name": name,
+      "type": type
+    }
+  })
+}
+export function getNewDataByDate(data) {
+  return request({
+    url: '/center-event/spread/getNewDataByDate?Date='+data,
+    method: 'get',
+
+  })
+}
+
+
 
 //获取人员信息（河长、路长、田长）
 export function getRyList(param) {
@@ -337,4 +364,5 @@ export function sendMessage(param) {
     method: 'post',
     data:param
   })
+
 }

src/components/supermap.vue

@@ -42,43 +42,43 @@
             <input type="text" class="form-control" id="heatNums1" value="6"/>
           </div>
         </div>
-		<div class="panel">
-		  <div class="input-group">
-		    <span class="input-group-addon">温度</span>
-		    <input type="text" class="form-control" id="heatNums2" value="10℃"/>
-		  </div>
-		</div>
-		<div class="panel">
-		  <div class="input-group">
-		    <span class="input-group-addon">湿度</span>
-		    <input type="text" class="form-control" id="heatNums3" value="6%RH"/>
-		  </div>
-		</div>
-		<div class="panel">
-		  <div class="input-group">
-		    <span class="input-group-addon">持续时间</span>
-		    <input type="text" class="form-control" id="heatNums4" value="60分钟"/>
-		  </div>
-		</div>
-		<div class="panel">
-		<div class="input-group">
-		  <span class="input-group-addon">植被类型</span>
-		  <select class="form-control" style="width:auto" id="heatNums5">
-		    <option value="1">针叶林</option>
-		    <option value="31">落叶林</option>
-		  </select>
-		</div>
-		</div>
-		<div class="panel">
-		  <div class="input-group">
-		    <span class="input-group-addon">大气压</span>
-		    <input type="text" class="form-control" id="heatNums6" value="101.325kPa"/>
-		  </div>
-		</div>
-		<div class="panel">
-        <el-button type="success" @click="createHeatPoints">分析</el-button>
-        <el-button type="success" @click="clearHeatPoints">重置</el-button>
-		</div>
+        <div class="panel">
+          <div class="input-group">
+            <span class="input-group-addon">温度</span>
+            <input type="text" class="form-control" id="heatNums2" value="10℃"/>
+          </div>
+        </div>
+        <div class="panel">
+          <div class="input-group">
+            <span class="input-group-addon">湿度</span>
+            <input type="text" class="form-control" id="heatNums3" value="6%RH"/>
+          </div>
+        </div>
+        <div class="panel">
+          <div class="input-group">
+            <span class="input-group-addon">持续时间</span>
+            <input type="text" class="form-control" id="heatNums4" value="60分钟"/>
+          </div>
+        </div>
+        <div class="panel">
+          <div class="input-group">
+            <span class="input-group-addon">植被类型</span>
+            <select class="form-control" style="width:auto" id="heatNums5">
+              <option value="1">针叶林</option>
+              <option value="31">落叶林</option>
+            </select>
+          </div>
+        </div>
+        <div class="panel">
+          <div class="input-group">
+            <span class="input-group-addon">大气压</span>
+            <input type="text" class="form-control" id="heatNums6" value="101.325kPa"/>
+          </div>
+        </div>
+        <div class="panel">
+          <el-button type="success" @click="createHeatPoints">分析</el-button>
+          <el-button type="success" @click="clearHeatPoints">重置</el-button>
+        </div>
       </div>
     </div>
   </div>
@@ -106,6 +106,8 @@ export default {
   name: 'sookaSuperMap',
   data() {
     return {
+      windDirection:'',
+      windSpeed:null,
       plottingdrawControl: null,
       plottingLayer: null,
       mapDivId: '',
@@ -121,7 +123,6 @@ export default {
       connectLayer: [],
       connectLayerTwo: [],
       graphicsLayer: [],
-      graphicsLayerTwo: [],
       latLngLayers: [],
       latLngGroup: [],
       isEditableLayers: false, //绘图控件
@@ -374,10 +375,13 @@ export default {
     //     that.map.doubleClickZoom.enable()
     //   })
     // },
-    showheatPlotting: function(heat_lat, heat_lng) {
+    showheatPlotting:  function(heat_lat, heat_lng,windSpeed,windDirection) {
+      console.log(heat_lat, heat_lng,windSpeed,windDirection)
       this.heat_lat = heat_lat
       this.heat_lng = heat_lng
-      this.isheatPlotting = true
+      this.windDirection = windDirection
+      this.windSpeed = windSpeed
+      this.createHeatPoints()
     },
     createHeatPoints: function() {
       let that = this
@@ -401,29 +405,29 @@ export default {
 
       var features = []
 
-      switch (heatNums) {
-        case 1://南风
+      switch (that.windDirection) {
+        case '南风'://南风
           features = that.getPointArray1()
           break
-        case 31://西南风
+        case '西南风'://西南风
           features = that.getPointArray3_1()
           break
-        case 41://东南风
+        case '东南风'://东南风
           features = that.getPointArray4_1()
           break
-        case 2://北风
+        case '北风'://北风
           features = that.getPointArray2()
           break
-        case 32://西北风
+        case '西北风'://西北风
           features = that.getPointArray3_2()
           break
-        case 42://东北风
+        case '东北风'://东北风
           features = that.getPointArray4_2()
           break
-        case 3://西风
+        case '西风'://西风
           features = that.getPointArray3()
           break
-        case 4://东风
+        case '东风'://东风
           features = that.getPointArray4()
           break
       }
@@ -443,7 +447,7 @@ export default {
     },
 
     getPointArray1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -455,7 +459,7 @@ export default {
       return points
     },
     getPointArray3_1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -468,7 +472,7 @@ export default {
       return points
     },
     getPointArray4_1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -481,7 +485,7 @@ export default {
       return points
     },
     getPointArray2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -493,7 +497,7 @@ export default {
       return points
     },
     getPointArray3_2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -506,7 +510,7 @@ export default {
       return points
     },
     getPointArray4_2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -519,7 +523,10 @@ export default {
       return points
     },
     getPointArray3: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+
+      var heatNums1 = this.windSpeed
+      console.log(heatNums1)
+
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -532,7 +539,7 @@ export default {
 
     },
     getPointArray4: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
+      var heatNums1 = this.windSpeed
       var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
@@ -622,19 +629,19 @@ export default {
         if (this.isAggregationMyGroup != undefined && this.isAggregationMyGroup != false) {
           this.isAggregationMyGroup.clearLayers()
         }
-          this.map.removeLayer(this.isAggregationLayers)
-          this.isAggregationLayers = []
-          this.radiusLayers = []
-          this.isAggregationLayers = window.L.markerClusterGroup({
-            //设置为true时显示聚类所占据的范围
-            showCoverageOnHover: true,
-            //设置为true时会向低一级聚类缩放
-            zoomToBoundsOnClick: true,
-            //增加点位时增加聚合动画（否则会出问题）
-            animateAddingMarkers: true,
-            //最大缩放级别点击聚合图标展开图标
-            spiderfyOnMaxZoom: true
-          })
+        this.map.removeLayer(this.isAggregationLayers)
+        this.isAggregationLayers = []
+        this.radiusLayers = []
+        this.isAggregationLayers = window.L.markerClusterGroup({
+          //设置为true时显示聚类所占据的范围
+          showCoverageOnHover: true,
+          //设置为true时会向低一级聚类缩放
+          zoomToBoundsOnClick: true,
+          //增加点位时增加聚合动画（否则会出问题）
+          animateAddingMarkers: true,
+          //最大缩放级别点击聚合图标展开图标
+          spiderfyOnMaxZoom: true
+        })
       } else {
         if (this.myGroup != undefined && this.myGroup != false) {
           this.myGroup.clearLayers()
@@ -678,12 +685,6 @@ export default {
       }
       this.graphicsLayer = []
     },
-    clearGTwo: async function() { //清理地图图形
-      if (this.graphicsLayerTwo != undefined && this.graphicsLayerTwo != false) {
-        this.graphicsLayerTwo.clearLayers()
-      }
-      this.graphicsLayerTwo = []
-    },
     clearP: async function() { //清理点击事件落点
       if (this.latLngGroup != undefined && this.latLngGroup != false) {
         this.latLngGroup.clearLayers()
@@ -1002,8 +1003,7 @@ export default {
       //结果得到的也是number类型，单位是 米
       return (dis / 10e2).toFixed(2) + 'km'
     },
-
-    setMarkersA: function(markersList) { //地图标点
+    setMarkers: function(markersList) { //地图标点
       const _that = this
       for (let i = 0; i < markersList.length; i++) {
         let isAggregation = markersList[i].isAggregation == null ? false : markersList[i]
@@ -1020,28 +1020,23 @@ export default {
         let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
           icon: icon
         })
-
-        markerClick.on('mouseover', function() {
-          let a = "";
-          _that.aac = setInterval(function (){
-            var color = "green";
-            var value = Math.random();
-            var up = "▲";
-            var down = "▼";
-            if(value>0.5){
-              color = "red";
-              value = value +""+ up;
-            }else{
-              value = value +""+ down;
-            }
-            a = "<span style='color:"+color+"'>当前传感器数值:"+value+"</span>";
-            markerClick.bindPopup(a).openPopup(markerClick.getLatLng());
-            console.log(this);
-          },500);
-        }).on('mouseout', function() {
-          clearInterval(_that.aac);
-          this.closePopup();
-        })
+        if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== '') {
+          let html = markersList[i].bindPopupHtml
+          if (keepBindPopup) {
+            markerClick.bindPopup(html, {
+              autoClose: false,
+              closeOnClick: null,
+              closeButton: false
+            }).openPopup(markerClick.getLatLng())
+          } else {
+            markerClick.on('mouseover', function() {
+              let html = markersList[i].bindPopupHtml
+              this.bindPopup(html).openPopup(this.getLatLng())
+            }).on('mouseout', function() {
+              this.closePopup()
+            })
+          }
+        }
         if (markersList[i].click != null && markersList[i].click !== '') {
           if (markersList[i].parameter != null && markersList[i].parameter !== '') {
             markerClick.on('click', function() {
@@ -1068,7 +1063,7 @@ export default {
       }
       _that.map.addLayer(_that.isAggregationLayers)
     },
-    setMarkers: function(markersList) { //地图标点
+    setMarkersA: function(markersList) { //地图标点
       const _that = this
       for (let i = 0; i < markersList.length; i++) {
         let isAggregation = markersList[i].isAggregation == null ? false : markersList[i]
@@ -1085,23 +1080,28 @@ export default {
         let markerClick = window.L.marker([markersList[i].lat, markersList[i].lng], {
           icon: icon
         })
-        if (markersList[i].bindPopupHtml != null && markersList[i].bindPopupHtml !== '') {
-          let html = markersList[i].bindPopupHtml
-          if (keepBindPopup) {
-            markerClick.bindPopup(html, {
-              autoClose: false,
-              closeOnClick: null,
-              closeButton: false
-            }).openPopup(markerClick.getLatLng())
-          } else {
-            markerClick.on('mouseover', function() {
-              let html = markersList[i].bindPopupHtml
-              this.bindPopup(html).openPopup(this.getLatLng())
-            }).on('mouseout', function() {
-              this.closePopup()
-            })
-          }
-        }
+
+        markerClick.on('mouseover', function() {
+          let a = "";
+          _that.aac = setInterval(function (){
+            var color = "green";
+            var value = Math.random();
+            var up = "▲";
+            var down = "▼";
+            if(value>0.5){
+              color = "red";
+              value = value +""+ up;
+            }else{
+              value = value +""+ down;
+            }
+            a = "<span style='color:"+color+"'>当前传感器数值:"+value+"</span>";
+            markerClick.bindPopup(a).openPopup(markerClick.getLatLng());
+            console.log(this);
+          },500);
+        }).on('mouseout', function() {
+          clearInterval(_that.aac);
+          this.closePopup();
+        })
         if (markersList[i].click != null && markersList[i].click !== '') {
           if (markersList[i].parameter != null && markersList[i].parameter !== '') {
             markerClick.on('click', function() {
@@ -1297,23 +1297,6 @@ export default {
         _that.graphicsLayer.addLayer(polygon)
       }
     },
-    setGraphicsTwoList: function(graphicsList, color) { //地图图形
-      const _that = this
-      let points = []
-      for (let i = 0; i < graphicsList.length; i++) {
-        points.push([graphicsList[i].lat, graphicsList[i].lng]) //创建点
-      }
-      let polygon = window.L.polygon(points, {
-        color: color
-      })
-      polygon.addTo(this.map)
-      if (this.graphicsLayerTwo != undefined && this.graphicsLayerTwo != false) {
-        _that.graphicsLayerTwo.addLayer(polygon)
-      } else {
-        _that.graphicsLayerTwo = window.L.featureGroup().addTo(this.map)
-        _that.graphicsLayerTwo.addLayer(polygon)
-      }
-    },
     dropLocation: function(lat, lng) { //落点定位
       this.map.flyTo([lat, lng], 13, { duration: 2 })
     },
@@ -1368,22 +1351,22 @@ export default {
     },
     dynamicPlotting: function() {
       setTimeout(() => {
-          var host = this.host
-          var serverUrl = host + '/iserver/services/plot-jingyong/rest/plot/'
+        var host = this.host
+        var serverUrl = host + '/iserver/services/plot-jingyong/rest/plot/'
 
-          var me = this
-          this.plottingLayer = window.L.supermap.plotting.plottingLayer('plot',
-            serverUrl)
-          this.plottingLayer.spatialAnalystUrl =
-            host + '/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst'
-          this.plottingLayer.addTo(this.map)
-          this.plottingdrawControl = window.L.supermap.plotting.drawControl(this
-            .plottingLayer)
-          this.plottingdrawControl.addTo(this.map)
-          var editControl = window.L.supermap.plotting.editControl()
-          editControl.addTo(this.map)
-          window.L.supermap.plotting.initPlotPanel('plotPanel', serverUrl, this
-            .plottingdrawControl)
+        var me = this
+        this.plottingLayer = window.L.supermap.plotting.plottingLayer('plot',
+          serverUrl)
+        this.plottingLayer.spatialAnalystUrl =
+          host + '/iserver/services/spatialanalyst-sample/restjsr/spatialanalyst'
+        this.plottingLayer.addTo(this.map)
+        this.plottingdrawControl = window.L.supermap.plotting.drawControl(this
+          .plottingLayer)
+        this.plottingdrawControl.addTo(this.map)
+        var editControl = window.L.supermap.plotting.editControl()
+        editControl.addTo(this.map)
+        window.L.supermap.plotting.initPlotPanel('plotPanel', serverUrl, this
+          .plottingdrawControl)
       }, 2000)
     }
     /** ----------------------------------动态绘制结束------------------------------------- */
@@ -1394,30 +1377,30 @@ export default {
 <style lang="scss" scoped>
 @import '@/assets/styles/base.scss';
 .panel{
-	margin-bottom: .5rem;
-	button{
-		margin-top: .5rem;
-	}
-	.input-group{
-		display: flex;
-		flex-direction: row;
-		align-items: center;
-		.input-group-addon{
-			color: $inBlue;
-			width: 3rem;
-			text-align: right;
+  margin-bottom: .5rem;
+  button{
+    margin-top: .5rem;
+  }
+  .input-group{
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    .input-group-addon{
+      color: $inBlue;
+      width: 3rem;
+      text-align: right;
 
-		}
-		.form-control{
-			padding: 0 .3rem;
-			margin-left: .5rem;
-			height: 1.5rem;
-			line-height: 1.5rem;
-			background-color: #112543;
-			color: $inBlue;
-			border: 1px $searchBorder;
-		}
-	}
+    }
+    .form-control{
+      padding: 0 .3rem;
+      margin-left: .5rem;
+      height: 1.5rem;
+      line-height: 1.5rem;
+      background-color: #112543;
+      color: $inBlue;
+      border: 1px $searchBorder;
+    }
+  }
 }
 
 .button-group {

src/views/forest.vue

@@ -646,6 +646,7 @@ export default {
     },
     getFirespread(eventCode) {
       this.$refs.firespread.showEventDialog(eventCode);
+      this.$refs.firespread.fireControlViewList()
     },
     getCurrentDataStr() {
       let date = new Date()