智慧北京城市发展

最新推荐文章于 2024-07-26 20:46:33 发布

AaronMoomin

最新推荐文章于 2024-07-26 20:46:33 发布

阅读量86

点赞数

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/qq_47631388/article/details/128045775

版权

记录制作智慧北京城市发展demo

在这里插入图片描述

步骤

记录(^▽)智慧北京城市发展功能

初始化方法：停止导览（关键），调节相机，隐藏对应图层，调整图层颜色
为做出动画效果，需要用到定时器，按顺序添加对应对象，使用delay函数
按需求添加对应的辐射圈，polyline线，polygon面，marker3d点，marker点
离开功能，恢复最初的场景效果，播放初始化导览

初始化

export const initCityDevelopment = async () => {
    __g.tileLayer.show(airStore.treeNameObj['地形影像_带外裁水系_1115'])
    __g.camera.stopAnimation()
    await __g.weather.setDateTime(2022, 11, 17, 22, 0, false)
    await __g.tileLayer.setStyle(airStore.treeNameObj['地形影像_带外裁水系_1115'], 0, 'rgb(140,186,87)')

    setTimeout(() => {
        __g.weather.setDarkMode(true)
    }, 300)
    await __g.camera.set(461068.138125, 4373285.776875, 50560.795, -49.312084, -90.273178, 1)
    /**
     * 中心城区 辐射区和beam
     */
    await addCenterCity()
    /**
     *十字箭头
     */
    await delay(1000)
    await addCross()
    /**
     * 双橙色箭头
     */
    await delay(1000)
    await addDoubleArrow()
    __g.polygon.highlight(['Arrow_0', 'Arrow_1'])
    /**
     * 副中心
     */
    await delay(1500)
    __g.polygon.stopHighlight(['Arrow_0', 'Arrow_1'])
    await addSecondCity()
    /**
     * 剩余箭头
     */
    await delay(1000)
    await addSecondLine()
    /**
     * marker
     */
    await delay(1000)
    await addSecondMarker()
    /**
     * 机场
     */
    await addAirport()
}

关键方法

/**
 *延迟函数
 *@param time 时间
 */
const delay = (time: number) => {
    return new Promise<void>(resolve => {
        const timer = setTimeout(() => {
            clearTimeout(timer)
            resolve()
        }, time)
    })
}

const num = 180
/**
 * 获取圆形
 */
const getCircular = (center: number[], radius: number) => {
    //半径
    const r = 150 //单位：米
    //待计算圆上的点 注意：半径越大需要计算的点数量越多 本示例使用360个点
    const pointArr = []
    for (let i = 0; i < num; i++) {
        //角度转弧度
        const radians = (i * (360 / num) * Math.PI) / 180
        //计算圆上的点X坐标
        const x1 = center[0] + radius * Math.cos(radians)
        //计算圆上的点Y坐标
        const y1 = center[1] + radius * Math.sin(radians)
        //赋值圆上所有点数组
        pointArr.push([x1, y1, center[2]])
    }
    return pointArr
}