Cesium 实战 - 获取 Cartesian3s 四至范围(extent)

229 阅读2分钟

这还是我的第一篇文章 给初学者分享一下如何通过cartesian3s坐标集来获取四至范围,用于解决primitive时无法使用飞行定位的问题

刚开始遇到这个问题也是没有好的方式去解决,只能通过定位坐标修改高度的方法去定位, 后面了解到可以通过获取cartesian3s坐标集来获取rectangle来进行定位这种定位能够非常完美的展示

在cesium中常用到flyto飞行定位但有些时候不能直接使用进行定位,如:primitive的,这样的对象就需要通过其他方式进行定位

常用的有camera的flyto、setView等,使用相机方法一般就需要获取数据的四至范围坐标进行定位

我习惯使用范围来进行定位,在cesium中通常使用rectangle来表示

介绍一种可以通过cartesian的坐标来获取四至坐标的方法来进行准确定位

通过如下方法进行获取

/**
        * @todo 获取点数据数组的范围
        * @param {Array} points - 坐标数组
        * @returns {[]} extent - 数组范围
        */
export const getExtentByPoints = (points) => {
    if (points) {
        // 指定世界范围
        let lonMin = 180;
        let lonMax = -180;
        let latMin = 90;
        let latMax = -180;
        points.forEach(function (point) {
            const longitude = point[0];
            const latitude = point[1];
            // 计算边界
            lonMin = longitude < lonMin ? longitude : lonMin;
            latMin = latitude < latMin ? latitude : latMin;
            lonMax = longitude > lonMax ? longitude : lonMax;
            latMax = latitude > latMax ? latitude : latMax;
        });
        const xRange = lonMax - lonMin ? lonMax - lonMin : 1;
        const yRange = latMax - latMin ? latMax - latMin : 1;
        // 返回数据
        return [lonMin - xRange / 10, latMin - yRange / 10, lonMax + xRange / 10, latMax + yRange / 10];
    }
    return [-180, -90, 180, 90];
}
getExtentByCartesian3(cartesian3s) {
        if (cartesian3s instanceof Array && cartesian3s.length > 0) {
            const points = [];
            for (let i = 0; i < cartesian3s.length; i++) {
                const cartesian3 = cartesian3s[i];
                // 将 cartesian3 转为经纬度数组
                const cartographic = Cesium.Cartographic.fromCartesian(cartesian3);
                const point = cartographicToDegrees(cartographic);
                points.push([point.longitude, point.latitude]);
            }
            return getExtentByPoints(points);
        }
    }