火灾蔓延

src/api/forest.js

@@ -18,7 +18,13 @@ export function fireControlViewPoint(type, name) {
     }
   })
 }
+export function getNewDataByDate(data) {
+  return request({
+    url: '/center-event/spread/getNewDataByDate?Date='+data,
+    method: 'get',
 
+  })
+}
 
 // 获取绑定的事件类型
 export function getMenuEventType() {

src/components/supermap.vue

@@ -81,19 +81,6 @@
         </div>
       </div>
     </div>
-    <el-dialog title="林班数据" :visible.sync="showBanData" width="80%" append-to-body>
-      <div style="display: flex; flex-wrap: wrap; height:70vh; overflow-y: scroll; align-content: flex-start">
-        <div v-for="(value, key ,index) in banDataList" style="width:33%;border: 1px solid #1b6d9d;" v-if="value!=''">
-          <div style="display: flex; align-items: center;padding: .5rem; color: #3ee1fa; font-size: 14px;">
-            <div><h5>{{ key }}:</h5></div>
-            <div>
-              <h5 style="margin-left: .5rem;">{{ value }}</h5>
-            </div>
-          </div>
-        </div>
-      </div>
-
-    </el-dialog>
   </div>
 </template>
 <script>
@@ -111,9 +98,7 @@ import {
   getSuperMap,
   iconList
 } from '@/api/components/supermap.js'
-import {
-  selectConfigKey
-} from '@/api/system/config'
+import { selectConfigKey } from "@/api/system/config";
 // import {setToken} from '../plugins/auth'
 import modal from '@/plugins/modal'
 
@@ -121,8 +106,8 @@ export default {
   name: 'sookaSuperMap',
   data() {
     return {
-      showBanData: false, //林班数据弹层
-      banDataList: [], //林班数据
+      windDirection:'',
+      windSpeed:null,
       plottingdrawControl: null,
       plottingLayer: null,
       mapDivId: '',
@@ -138,26 +123,18 @@ export default {
       connectLayer: [],
       connectLayerTwo: [],
       graphicsLayer: [],
-      graphicsLayerTwo: [],
       latLngLayers: [],
       latLngGroup: [],
       isEditableLayers: false, //绘图控件
       drawControl: null, //绘图控件
       deckglLayer: null, //图层Layer
       deckglLayerList: [], //图层Layer(数组)
-
-      deckglLayerList_Data: [], //图层Layer(数组) 地图
-      resultLayer_Data: [], //数据图层Layer(数组) 数据
-      infoView: null,
-      lbtInfoView: null,
-      lbtThemeLayer: null,
-
       heatMapLayer: [], //火灾蔓延图层Layer
-      isheatPlotting: false, //火灾蔓延
+      isheatPlotting: false,//火灾蔓延
       heat_lat: 0, //火灾蔓延经纬度
       heat_lng: 0, //火灾蔓延经纬度
       aac:null,
-      host: ''
+      host:''
     }
   },
   watch: {
@@ -337,7 +314,7 @@ export default {
     mapDiv: null,
     codes: null,
     mapSite: {},
-    isdynamicPlotting: false, //动态标绘表格
+    isdynamicPlotting: false,//动态标绘表格
     isSideBySide: false,
     showLatLng: null,
     showAreaLatLng: null,
@@ -398,20 +375,24 @@ 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
       that.clearHeatPoints()
       that.heatMapLayer = new window.L.supermap.heatMapLayer(
-        'heatMap', {
+        'heatMap',
+        {
           'map': that.map,
           'id': 'heatmap',
           'radius': 10,
-          //            设置图层透明度：（参数方式）
+//            设置图层透明度：（参数方式）
           'opacity': 0.5,
           //featureWeight指定以哪个属性值为热力权重值创建热力图：
           'featureWeight': 'value'
@@ -424,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
       }
@@ -466,9 +447,8 @@ export default {
     },
 
     getPointArray1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accAdd(mLat, 0.005)
@@ -479,9 +459,8 @@ export default {
       return points
     },
     getPointArray3_1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accAdd(mLat, 0.005)
@@ -493,9 +472,8 @@ export default {
       return points
     },
     getPointArray4_1: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accAdd(mLat, 0.005)
@@ -507,9 +485,8 @@ export default {
       return points
     },
     getPointArray2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accSub(mLat, 0.005)
@@ -520,9 +497,8 @@ export default {
       return points
     },
     getPointArray3_2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accSub(mLat, 0.005)
@@ -534,9 +510,8 @@ export default {
       return points
     },
     getPointArray4_2: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLat = this.accSub(mLat, 0.005)
@@ -548,9 +523,11 @@ export default {
       return points
     },
     getPointArray3: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+
+      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++) {
         mLon = this.accAdd(mLon, 0.005)
@@ -562,9 +539,8 @@ export default {
 
     },
     getPointArray4: function() {
-      var heatNums1 = parseInt($('#heatNums1').val())
-      var mLon = this.heat_lng,
-        mLat = this.heat_lat
+      var heatNums1 = this.windSpeed
+      var mLon = this.heat_lng, mLat = this.heat_lat
       var points = []
       for (var i = 0; i < parseInt(heatNums1 / 3); i++) {
         mLon = this.accSub(mLon, 0.005)
@@ -576,9 +552,9 @@ export default {
 
     },
     //加法函数，用来得到精确的加法结果
-    //说明：javascript的加法结果会有误差，在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
-    //调用：accAdd(arg1,arg2)
-    //返回值：arg1加上arg2的精确结果
+//说明：javascript的加法结果会有误差，在两个浮点数相加的时候会比较明显。这个函数返回较为精确的加法结果。
+//调用：accAdd(arg1,arg2)
+//返回值：arg1加上arg2的精确结果
     accAdd: function(arg1, arg2) {
       var r1, r2, m, c
       try {
@@ -633,8 +609,7 @@ export default {
     /** ----------------------------------火势蔓延  结束------------------------------------- */
     /** ----------------------------------热力图  结束------------------------------------- */
     loadHeatMap: async function(points) {
-      var heatNumbers = 150,
-        heatRadius = 30
+      var heatNumbers = 150, heatRadius = 30
       var num = parseInt(heatNumbers)
       num = (num > 0) ? num : 0
       var radius = parseInt(heatRadius)
@@ -710,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()
@@ -1207,15 +1176,9 @@ export default {
           }
         }
         lay.push(markerClick)
-        _that.layersBytype.push({
-          type: type,
-          marker: markerClick
-        })
+        _that.layersBytype.push({ type: type, marker: markerClick })
         myGroup = window.L.layerGroup(lay)
-        _that.myGroupBytype.push({
-          type: type,
-          myGroup: myGroup
-        })
+        _that.myGroupBytype.push({ type: type, myGroup: myGroup })
         this.map.addLayer(myGroup)
       }
     },
@@ -1334,27 +1297,8 @@ export default {
         _that.graphicsLayer.addLayer(polygon)
       }
     },
-    setGraphicsListTwo: 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
-      })
+      this.map.flyTo([lat, lng], 13, { duration: 2 })
     },
     dropLocation: function(lat, lng,leve) { //落点定位
       this.map.flyTo([lat, lng], leve, {
@@ -1362,14 +1306,10 @@ export default {
       })
     },
     dropLocation10: function(lat, lng) { //落点定位
-      this.map.flyTo([lat, lng], 10, {
-        duration: 2
-      })
+      this.map.flyTo([lat, lng], 10, { duration: 2 })
     },
     dropLocation5: function(lat, lng) { //落点定位
-      this.map.flyTo([lat, lng], 5, {
-        duration: 2
-      })
+      this.map.flyTo([lat, lng], 5, { duration: 2 })
     },
     controlLevel: function(level) { //控制地图缩放级别
       this.map.setZoom(level)
@@ -1380,10 +1320,8 @@ export default {
           this.deckglLayer.remove()
         }
       }
-      if (url != null) {
-        this.deckglLayer = window.L.supermap.tiledMapLayer(url, {})
-        this.map.addLayer(this.deckglLayer)
-      }
+      this.deckglLayer = window.L.supermap.tiledMapLayer(url, {})
+      this.map.addLayer(this.deckglLayer)
     },
     layerSwitchingList: function(urlList) { //图层切换数组  urlList 图层地址(数组)
       if (this.deckglLayerList != null && this.deckglLayerList.length > 0) {
@@ -1393,136 +1331,12 @@ export default {
       }
       if (urlList != null && urlList.length > 0) {
         for (let i = 0; i < urlList.length; i++) {
-          if (urlList[i] != null) {
-            this.deckglLayer = window.L.supermap.tiledMapLayer(urlList[i], {})
-            this.deckglLayerList.push(this.deckglLayer)
-            this.map.addLayer(this.deckglLayer)
-          }
+          this.deckglLayer = window.L.supermap.tiledMapLayer(urlList[i], {})
+          this.deckglLayerList.push(this.deckglLayer)
+          this.map.addLayer(this.deckglLayer)
         }
       }
     },
-    /** -------------------------------图层地址(数组)  带数据图层---开始------------------------------- */
-    layerSwitchingList_Data: function(banCheckList) { //图层切换数组  urlList 图层地址(数组)  带数据图层
-      let that = this
-      that.initInfoView()
-      if (that.lbtThemeLayer != null) {
-        that.map.removeLayer(that.lbtThemeLayer)
-      }
-      // 定义 Unique 单值专题图层
-      that.lbtThemeLayer = window.L.supermap.uniqueThemeLayer('lbtThemeLayer', {
-        // 开启 hover 高亮效果
-        isHoverAble: true,
-        opacity: 0.6,
-        alwaysMapCRS: true
-      }).addTo(that.map)
-
-      // 图层基础样式
-      that.lbtThemeLayer.style = new SuperMap.ThemeStyle({
-        shadowBlur: 3,
-        shadowColor: '#000000',
-        shadowOffsetX: 1,
-        shadowOffsetY: 1,
-        fillColor: '#ff4400',
-        fillOpacity: 0
-      })
-
-      // hover 高亮样式
-      that.lbtThemeLayer.highlightStyle = new SuperMap.ThemeStyle({
-        stroke: true,
-        strokeWidth: 2,//线宽
-        strokeColor: '#0ff',//线色
-        fillColor: '#09f',//面色
-        fillOpacity: 0.3//透明度
-      })
-      that.lbtThemeLayer.on('mousemove', that.lbtHighLightLayer)
-
-      that.lbtThemeLayer.on('dblclick', function(e) {
-        that.showBanData = true
-        var fea = that.lbtThemeLayer.getFeatureById(e.target.refDataID)
-        that.banDataList = fea.attributes
-      })
-
-      //清除地图图层
-      if (that.deckglLayerList_Data != null && that.deckglLayerList_Data.length > 0) {
-        for (let i = 0; i < that.deckglLayerList_Data.length; i++) {
-          that.deckglLayerList_Data[i].remove()
-        }
-      }
-      //清除数据图层
-      if (that.resultLayer_Data != null && that.resultLayer_Data.length > 0) {
-        for (let i = 0; i < that.resultLayer_Data.length; i++) {
-          that.resultLayer_Data[i].remove()
-        }
-      }
-      if (banCheckList != null && banCheckList.length > 0) {
-        for (let i = 0; i < banCheckList.length; i++) {
-
-          that.deckglLayer = window.L.supermap.tiledMapLayer(banCheckList[i].farmAddress, {})
-          that.deckglLayerList_Data.push(that.deckglLayer)
-          that.map.addLayer(that.deckglLayer)
-          if (banCheckList[i].farmAddress != null) {
-            var getFeatureBySQLParams = new SuperMap.GetFeaturesBySQLParameters({
-              queryParameter: {
-                name: banCheckList[i].name
-              },
-              datasetNames: banCheckList[i].datasetNames,
-              maxFeatures: 20000,
-              fromIndex: 0,
-              toIndex: 999999
-            })
-
-            window.L.supermap.featureService('http://121.36.228.94:8090/iserver/services/data-baishan/rest/data')
-              .getFeaturesBySQL(getFeatureBySQLParams, function(serviceResult) {
-                if (serviceResult.hasOwnProperty('result') && serviceResult.result
-                  .hasOwnProperty('features')) {
-                  that.lbtThemeLayer.addFeatures(serviceResult.result.features)
-                }
-              }, SuperMap.DataFormat.ISERVER)
-          }
-        }
-      }
-    },
-    lbtHighLightLayer: function(e) {
-      console.log(e)
-      if (e.target && e.target.refDataID) {
-        var fea = this.lbtThemeLayer.getFeatureById(e.target.refDataID)
-        if (fea) {
-          //此处写信息渲染代码
-
-        }
-      } else if (this.lbtInfoView) {
-        this.lbtInfoView.remove()
-      }
-    },
-    //高亮时显示图层信息框的控件
-    initInfoView: function() {
-      this.infoView = window.L.control({ position: 'bottomleft' })
-      this.infoView.onAdd = function() {
-        this._div = window.L.DomUtil.create('div', 'panel panel-primary infoPane')
-        $(this._div).css('width', '150px')
-        $('<div class=\'panel-heading\'><h5 class=\'panel-title text-center\'>林场信息</h5></div>').appendTo(this._div)
-        var content = $('<div class=\'panel-body content\'></div>').appendTo(this._div)
-        content.css('fontSize', '14px')
-        handleMapEvent(this._div, this._map)
-        return this._div
-      }
-
-      this.infoView.update = function(fea) {
-        var content = $('.content')
-        content.text('')
-        if (!fea) {
-          return
-        }
-        var car_count = parent.$('#' + fea.attributes.SMID).val()
-        if (car_count == undefined) {
-          car_count = 0
-        }
-        console.log(fea.attributes.SMID)
-      }
-    },
-    /** -------------------------------图层地址(数组)  带数据图层---结束------------------------------- */
-
-
     /** ----------------------------------动态绘制开始------------------------------------- */
     clearLayers: function() {
       this.plottingLayer.removeAllFeatures()
@@ -1530,9 +1344,9 @@ export default {
     PlottingDrawCancel: function() {
       this.plottingdrawControl.handler.disable()
     },
-    getspuerMapHost() {
+    getspuerMapHost(){
       selectConfigKey('superMap.iserver.plot').then(res => {
-        this.host = res.data
+        this.host = res.data;
       })
     },
     dynamicPlotting: function() {
@@ -1562,27 +1376,22 @@ export default {
 
 <style lang="scss" scoped>
 @import '@/assets/styles/base.scss';
-
-.panel {
+.panel{
   margin-bottom: .5rem;
-
-  button {
+  button{
     margin-top: .5rem;
   }
-
-  .input-group {
+  .input-group{
     display: flex;
     flex-direction: row;
     align-items: center;
-
-    .input-group-addon {
+    .input-group-addon{
       color: $inBlue;
       width: 3rem;
       text-align: right;
 
     }
-
-    .form-control {
+    .form-control{
       padding: 0 .3rem;
       margin-left: .5rem;
       height: 1.5rem;
@@ -1609,4 +1418,6 @@ export default {
     text-shadow: 0 0 15px rgba($color: $inBlueHover, $alpha: 1.0);
   }
 }
+
+
 </style>

src/views/forest.vue

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