智慧农业后台管理页面
guoshilong
2022-11-08 082613d446e29e4ec1c16bfaa52345106a498b23
src/components/map/plotMap.vue
@@ -7,6 +7,8 @@
<script>
import NCregion from "@/assets/region"
import { glob } from "glob"
import {getDetail } from "@/api/farm/farm"
import { mapGetters } from "vuex"
import * as turf from '@turf/turf'
var farmRegionLayer = null
@@ -22,6 +24,7 @@
    data () {
        return {
            polyline: null,
            farm:{},
        }
    },
    watch: {
@@ -32,14 +35,14 @@
        }
    },
    computed: {
        ...mapGetters(["$farmId"]),
    },
    mounted () {
        if (global.viewer != null) {
            global.viewer = null
        }
        function initViewer () {
        function initViewer (lat,lon) {
            global.viewer = new global.DC.Viewer('viewer-container', {
                contextOptions: {
                    webgl: {
@@ -48,7 +51,6 @@
                        preserveDrawingBuffer: true
                    }
                },
                sceneMode: 2
            })
            farmRegionLayer = new global.DC.VectorLayer('farmRegionLayer')
@@ -214,7 +216,7 @@
                // Cesium的坐标是以地心为原点,一向指向南美洲,一向指向亚洲,一向指向北极州
                // fromDegrees()方法,将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    116.56705776, 27.42386903, 1800.0
                    lon, lat, 1800.0
                ),
                orientation: {
                    // 指向
@@ -228,8 +230,17 @@
            // global.viewer.locationBar.enable = true
        }
        global.DC.ready(initViewer)
        this.addRegionPolyLine(NCregion)
        getDetail(this.$farmId).then(res=>{
            this.farm.latitude = res.data.data.latitude
            this.farm.longitude = res.data.data.longitude
            // global.DC.ready(initViewer(this.farm.latitude,this.farm.longitude))
            global.DC.ready(() => {
                initViewer(this.farm.latitude,this.farm.longitude)
            })
            this.addRegionPolyLine(NCregion)
        })
    },
    methods: {
        /**
@@ -334,23 +345,25 @@
                // })
                // farmLogoLayer.addOverlay(divIcon)
            }
            const polygon = new global.DC.Polygon(positions)
            polygon.attrParams = item
            polygon.setStyle({
                material: global.DC.Namespace.Cesium.Color.fromBytes(
                    129, 255, 84,
                    200
                )
            })
            if(positions){
                const polygon = new global.DC.Polygon(positions)
                polygon.attrParams = item
                polygon.setStyle({
                    material: global.DC.Namespace.Cesium.Color.fromBytes(
                        129, 255, 84,
                        200
                    )
                })
            polygon.on(global.DC.MouseEventType.CLICK, (e) => {
                that.$parent.plotDetailsPopupShow(e.overlay.attrParams)
                that.drawLandPolyLine(positions)
            })
                polygon.on(global.DC.MouseEventType.CLICK, (e) => {
                    that.$parent.plotDetailsPopupShow(e.overlay.attrParams)
                    that.drawLandPolyLine(positions)
                })
            plotRegionLayer.addOverlay(polygon)
            addPlotLayers.push({ center, name: item.landName, id: item.id })
                plotRegionLayer.addOverlay(polygon)
                addPlotLayers.push({ center, name: item.landName, id: item.id })
            }
        },
        /**
         * 地块画线
@@ -431,6 +444,7 @@
            // 根据坐标画线
            const positions = this.setPositionByLandRange(landObj.landRange)
          console.log(positions,123455555)
            if (positions) {
                this.drawLandPolyLine(positions)
            }
@@ -467,18 +481,7 @@
        // 经纬度测算中心位置
        getCenter (arr) {
            var positionArr = []
            arr.forEach(e=>{
                // e = new global.DC.Namespace.Cesium.Cartesian3(e[0]-0, e[1]-0, 0)
                e[0] = e[0]-0
                e[1] = e[1]-0
                positionArr.push(e)
            })
            positionArr.push(arr[0])
            var positionTurf = [positionArr]
            var polygon = turf.polygon(positionTurf);
            var centroid = turf.centroid(polygon);
            let centerLonLat = []
            // if (arr.length) {
            //     const lon = []
            //     const lat = []
@@ -502,7 +505,22 @@
            //     centerLonLat = [Number(centerLongitude), Number(centerLatitude)]
            //     console.log("中心",centerLonLat)
            // }
            centerLonLat = [centroid.geometry.coordinates[0],centroid.geometry.coordinates[1]]
            let centerLonLat = []
            if(arr.length >= 3 ){
                var positionArr = []
                arr.forEach(e=>{
                    // e = new global.DC.Namespace.Cesium.Cartesian3(e[0]-0, e[1]-0, 0)
                    e[0] = e[0]-0
                    e[1] = e[1]-0
                    positionArr.push(e)
                })
                positionArr.push(arr[0])
                var positionTurf = [positionArr]
                var polygon = turf.polygon(positionTurf);
                var centroid = turf.centroid(polygon);
                centerLonLat = [centroid.geometry.coordinates[0],centroid.geometry.coordinates[1]]
            }
            return centerLonLat
        }
    }