图标添加

shuishen

2022-08-03 59c2705dd386fb43a8f8d1a8d5ab319d6c0ee44c

图标添加

 src/components/map/index.vue

@@ -11,6 +11,9 @@
var addLayers = []
var addPlotLayers = []

var siteEntitylayers = null
var sitePositionsArray = []

export default {
    name: 'mapBox',

@@ -39,6 +42,8 @@
                }
            })

            // global.viewer.scene.globe.depthTestAgainstTerrain = true

            farmRegionLayer = new global.DC.VectorLayer('farmRegionLayer')
            global.viewer.addLayer(farmRegionLayer)

@@ -47,6 +52,9 @@

            farmLogoLayer = new global.DC.HtmlLayer('farmLogoLayer')
            global.viewer.addLayer(farmLogoLayer)

            siteEntitylayers = new global.DC.VectorLayer('siteEntitylayers')
            global.viewer.addLayer(siteEntitylayers)

            if (global.DC.Namespace.Cesium.FeatureDetection.supportsImageRenderingPixelated()) { // 判断是否支持图像渲染像素化处理
                global.viewer.setOptions({
@@ -254,6 +262,49 @@
            addPlotLayers.push({ center, name: item.landName })
        },

        addSiteEntity (item, url) {
            const that = this

            const center = [Number(item.lon), Number(item.lat)]

            const label = new global.DC.Label(new global.DC.Position(Number(item.lon), Number(item.lat)), item.name)

            label.attrParams = item

            label.setStyle({
                fillColor: global.DC.Namespace.Cesium.Color.fromBytes(
                    1, 190, 254, 255
                ),
                showBackground: true,
                backgroundColor: global.DC.Namespace.Cesium.Color.fromBytes(
                    0, 0, 0, 145
                ), // 背景颜色
                distanceDisplayCondition: {
                    near: 0, // 最近距离
                    far: 3000 // 最远距离
                }, // 根据距离设置可见
                font: '12px',
                pixelOffset: { x: 0, y: -26 } // 偏移像素
            })

            label.on(global.DC.MouseEventType.CLICK, (e) => {
                that.$parent.plotDetailsPopupShow(e.overlay.attrParams)
            })

            const billboard = new global.DC.Billboard(new global.DC.Position(Number(item.lon), Number(item.lat)), url)
            billboard.size = [18, 18]
            billboard.attrParams = item

            billboard.on(global.DC.MouseEventType.CLICK, (e) => {
                that.$parent.plotDetailsPopupShow(e.overlay.attrParams)
            })

            siteEntitylayers.addOverlay(label)
            siteEntitylayers.addOverlay(billboard)

            sitePositionsArray.push({ center, name: item.name, id: item.id })
        },

        setCenter (name) {
            let center
            addLayers.forEach(item => {
@@ -265,7 +316,7 @@
            if (center == '') {
                this.$message({
                    message: '当前农场暂未绘制',
                type: 'warning'
                    type: 'warning'
                })
                return
            }
@@ -310,6 +361,32 @@
            })
        },

        setSiteCenter (name) {
            let center
            sitePositionsArray.forEach(item => {
                if (name == item.name) {
                    center = item.center
                }
            })

            console.log(name, center)

            global.viewer.camera.flyTo({
                // Cesium的坐标是以地心为原点，一向指向南美洲，一向指向亚洲，一向指向北极州
                // fromDegrees()方法，将经纬度和高程转换为世界坐标
                destination: global.DC.Namespace.Cesium.Cartesian3.fromDegrees(
                    center[0], center[1], 500.0
                ),
                orientation: {
                    // 指向
                    heading: global.DC.Namespace.Cesium.Math.toRadians(0, 0),
                    // 视角
                    pitch: global.DC.Namespace.Cesium.Math.toRadians(-90),
                    roll: 0.0
                }
            })
        },

        // 经纬度测算中心位置
        getCenter (arr) {
            let centerLonLat = []

 src/views/home/index.vue

@@ -257,6 +257,7 @@
                        class="box"
                        :class="{ first: index == 0 }"
                        :title="item.name"
                        @click="setSiteCenter(item, 'jkListShow')"
                    >{{ item.name }}</div>
                </div>
            </div>
@@ -272,6 +273,7 @@
                        class="box"
                        :class="{ first: index == 0 }"
                        :title="item.name"
                        @click="setSiteCenter(item, 'jcListShow')"
                    >{{ item.name }}</div>
                </div>
            </div>
@@ -282,14 +284,14 @@
            <span>市场流通</span>
        </div>

        <div class="layers-box">
        <!-- <div class="layers-box">
            <div class="sl">
                <div class="text">标准图</div>
            </div>
            <div class="yx on">
                <div class="text">卫星图</div>
            </div>
        </div>
        </div>-->

        <div class="lenged-box">
            <ul>
@@ -625,6 +627,11 @@
            this.farmId = item.id
            this.AllDataUpdate()
            this.$refs.modalForm.setCenter(item.farmName)
        },

        setSiteCenter (item, show) {
            this[show] = false
            this.$refs.modalForm.setSiteCenter(item.name)
        },

        getFarmList () {
@@ -1294,6 +1301,13 @@
            getStationAndVideoList().then((res) => {
                if (JSON.stringify(res.data) != '{}' && res.data.data) {
                    that.equipmentList = res.data.data

                    that.equipmentList.staList.forEach(item => {
                        that.$refs.modalForm.addSiteEntity(item, '/img/icon/jk.png')
                    })
                    that.equipmentList.vidList.forEach(item => {
                        that.$refs.modalForm.addSiteEntity(item, '/img/icon/jk.png')
                    })
                }
            })
        }