Merge branch 'master' into jiangwu

shuishen

2025-05-19 2dfc8dc4bcd3d3cd4aed1b6054e073e140eba9c8

 src/components/map-container/mapContainer.vue

@@ -2,7 +2,7 @@
 * @Author: shuishen 1109946754@qq.com
 * @Date: 2024-10-25 15:07:51
 * @LastEditors: shuishen 1109946754@qq.com
 * @LastEditTime: 2025-04-14 23:09:33
 * @LastEditTime: 2025-04-28 11:34:40
 * @FilePath: \drone-web-manage\src\components\map-container\mapContainer.vue
 * @Description: 
 * 
@@ -19,13 +19,19 @@
</template>

<script setup>
import * as turf from '@turf/turf'

import { nextTick, onMounted, onUnmounted } from 'vue'
import { read } from 'xlsx'

import startPng from '@/assets/map_images/Startingpointicon.png'
import endPng from '@/assets/map_images/EndPointicon.png'

window.$viewer = null
window.$Cesium = null
let pointLayer = null
let polylineLayer = null
let pointHtmlLayer = null

const { VITE_APP_BASE } = import.meta.env
// import * as Cesium from 'cesium'
@@ -65,8 +71,13 @@
        credit: 'stand_tc',
    })

    window.$viewer = new DC.Viewer('viewer-container')
    window.$viewer = new DC.Viewer('viewer-container', {
        "sceneMode": 2 //1: 2.5D，2: 2D，3: 3D
    })

    window.$viewer.locationBar.enable = false

    window.$viewer?.zoomToPosition(new DC.Position(115.892151, 28.676493, 1000000, 0, -90, 0))

    window.$viewer?.imageryLayers.addImageryProvider(imageryProvider_stand)
    window.$viewer?.imageryLayers.addImageryProvider(imageryProvider_standZh)
@@ -75,6 +86,8 @@
    window.$viewer?.addLayer(pointLayer)
    polylineLayer = new DC.VectorLayer('polylineLayer')
    window.$viewer?.addLayer(polylineLayer)
    pointHtmlLayer = new DC.HtmlLayer('pointHtmlLayer')
    window.$viewer?.addLayer(pointHtmlLayer)

    isViewerReady.value = true
}
@@ -100,13 +113,13 @@
 * @param data 数据  数据格式 [lng, lat]
 */
function addPoint (data) {
    if (pointLayer) pointLayer.clear()

    const [lng, lat] = data

    if (!lng || !lat) return

    let [newLng, newLat] = DC.CoordTransform.GCJ02ToWGS84(lng, lat)

    let point = new DC.Point(new DC.Position(newLng, newLat))
    let point = new DC.Point(new DC.Position(lng, lat))
    pointLayer.addOverlay(point)

    window.$viewer?.zoomTo(pointLayer)
@@ -117,27 +130,72 @@
 * @param data 数据  数据格式 [[lng, lat], [lng, lat], [lng, lat]]
 */
function addPolyline (data) {
    if (polylineLayer) polylineLayer.clear()
    if (pointHtmlLayer) pointHtmlLayer.clear()

    if (data.length === 0) return

    const positionStr = data.map(item => {
        const [lng, lat] = item

        let [newLng, newLat] = DC.CoordTransform.GCJ02ToWGS84(lng, lat)

        return `${newLng}, ${newLat}`
        return `${lng}, ${lat}`
    }).join(';')

    let polyline = new DC.Polyline(positionStr)
    polyline.setStyle({
        width: 20,
        material: new DC.PolylineLightingTrailMaterialProperty({
            color: DC.Color.BLUE,
            speed: 5.0
        width: 4,
        material: new DC.PolylineTrailMaterialProperty({
            color: DC.Color.DEEPSKYBLUE,
            speed: 10
        }),
        clampToGround: true
    })
    polylineLayer.addOverlay(polyline)
    window.$viewer?.zoomTo(polylineLayer)


    data.forEach((item, index) => {
        const [lng, lat] = item
        let position = new DC.Position(lng, lat)

        console.log(lng, lat)
        let billboard = null

        if (index === 0) {
            billboard = new DC.Billboard(position, startPng)
        }

        if (index === data.length - 1) {
            billboard = new DC.Billboard(position, endPng)
        }


        billboard && (billboard.size = [20, 20])
        billboard && (billboard.setStyle({
            "pixelOffset": { "x": 0, "y": -8 }
        }))
        billboard && polylineLayer.addOverlay(billboard)

        if (index !== 0 && index !== data.length - 1) {
            let divIcon = new DC.DivIcon(
                position,
                `<div class="point-icon-box">${index}</div>`
            )
            pointHtmlLayer.addOverlay(divIcon)
        }
    })

    const line = turf.lineString(positionStr.split(';').map(i => i.split(',')))
    const bbox = turf.bbox(line)
    const bboxPolygon = turf.bboxPolygon(bbox)
    const scaledPolygon = turf.transformScale(bboxPolygon, 3)
    const newBbox = turf.bbox(scaledPolygon)

    window.$viewer?.flyToBounds(
        newBbox,
        { heading: 0, pitch: -90, roll: 0 },
        () => { },
        0
    )
}

onMounted(() => {