cesium中缓冲区分析

效果

这里是点缓冲区与点数据分析的15000个点

代码

添加缓冲区

 /**
     * @Description: 初始化点缓冲
     * @param centerPoint 缓冲区中心点
     * @param dataPoint 缓冲区分析的数据
     * @param bufferDistance 缓冲区距离
     * @return ptsWithin  缓冲区分析结果
     */
    initPointBuffer(centerPoint, dataPoint, bufferDistance) {
        this.removeBufferPolygon();

        let point = centerPoint?centerPoint:[];
        let centerPoints = dataPoint?dataPoint:[];
        let viewer = this.viewer;
        this.addPoint(point, viewer);

        // 添加turf对象，加载缓冲区面
        let pointF = turf.point(point);
        let buffered = turf.buffer(pointF, bufferDistance, { units: 'meters' });
        let bufferedGeometry = buffered.geometry.coordinates[0];
        let coordinates = buffered.geometry.coordinates;
        let points = coordinates[0];
        let degreesArray = this.pointsToDegreesArray(points);
        let deg1 = Cesium.Cartesian3.fromDegreesArray(degreesArray);
        this.addBufferPolygon(deg1);

        // turf面
        let searchWithin = [];
        searchWithin.push(bufferedGeometry);
        let searchWithinEntity = Cesium.turf.polygon(searchWithin);

        // 处理geometry点
        let Towerspoints = [];
        for (let i = 0; i < centerPoints.length; i++) {
            let feature = new Object();
            feature.type = "Feature";
            feature.properties = { Name: centerPoints[i].id };
            // feature.collection = centerPoints[i]._collection;
            feature.geometry = {
                type: "Point",
                coordinates: [centerPoints[i].lat, centerPoints[i].lon],
            };
            Towerspoints.push(feature);
        }
        let TowersCollection = {
            type: "FeatureCollection",
            features: Towerspoints,
        };

        // turf判断电面相交，返回结果值
        let ptsWithin = Cesium.turf.pointsWithinPolygon(
            TowersCollection,
            searchWithinEntity
        );

        return ptsWithin;
    }

    /**
     * @Description: 添加缓冲区中心点
     * @param point 坐标点
     * @param viewer 地图视图
     * @return
     */
    addPoint(point, viewer) {
        viewer.entities.add({
            id: "bufferPoint",
            position: Cesium.Cartesian3.fromDegrees(point[0], point[1], 0),
            point: {
                pixelSize: 10,
                color: Cesium.Color.AQUA,
                outlineWidth: 3,
                outlineColor: Cesium.Color.CHARTREUSE.withAlpha(0.4),
            }
        });
    }
/**
     * @Description: 添加缓冲面
     * @param positions 笛卡尔坐标系位置
     * @return
    */
    addBufferPolygon(positions) {
        this.viewer.entities.add({
            id:"bufferPolygon",
            polygon: {
                hierarchy: new Cesium.PolygonHierarchy(positions),
                material: Cesium.Color.RED.withAlpha(0.6),
                classificationType: Cesium.ClassificationType.BOTH
            },
        });
    }

    /**
     * @Description: 格式转换
     * @param points 点坐标
     * @return degreesArray 坐标系
    */
    pointsToDegreesArray(points) {
        let degreesArray = [];
        points.map(item => {
            degreesArray.push(item[0]);
            degreesArray.push(item[1]);
        });
        return degreesArray;
    }

调用

class CesiumUtile {

    //初始化地图
    static initCesium(divMapId) {
        let options = {
            selectionIndicator: false,
            homeButton: false,//主页按钮，默认true
            // scene3DOnly: true, // 每个几何实例仅以3D渲染以节省GPU内存
            animation: false, //动画控制，默认true
            baseLayerPicker: false, //是否显示图层选择控件
            geocoder: false,//地名查找,默认true
            timeline: false,//时间线,默认true
            navigationHelpButton: false,//导航帮助说明,默认true
            sceneModePicker: false,//是否显示投影方式控件
            infoBox: false,//点击要素之后显示的信息,默认true
            fullscreenButton: false,//全屏按钮,默认显示true
            navigationInstructionsInitiallyVisible: false,
            mapMode2D: Cesium.MapMode2D.INFINITE_SCROLL,
            imageryProvider: new Cesium.WebMapTileServiceImageryProvider({
                url: "地图地址",
                layer: "tdtBasicLayer",
                style: "default",
                maximumLevel: 18,
                format: "image/jpeg",
                tileMatrixSetID: "GoogleMapsCompatible",
                show: true,
                subdomains: ["t0", "t1", "t2", "t3", "t4", "t5", "t6", "t7"]
            }),
        }

        let viewer = new Cesium.Viewer(divMapId, options);
        window.selfDefine.viewer = viewer;
        this.viewer = viewer;
        viewer.scene.globe.depthTestAgainstTerrain = false;
        viewer.camera.flyTo({
            destination: Cesium.Cartesian3.fromDegrees(105.973421, 38.757527, 7000000.0),
            duration: 4
        })

        let _this = this;
        this.jsonDatas = [];  //保存json對象

        for (let i = 0;i < 15000; i ++){
            let ran1 = 118.81 + parseInt(Math.random() * 100000).toString();
            let ran2 = 32.01 + parseInt(Math.random() * 10000).toString();

            let point1 = Number(ran1);
            let point2 = Number(ran2);
            _this.jsonDatas.push({
                id:"bufferPoint" + i,
                lat: ran1,
                lon: ran2,
            })
            _this.addPoint(i,point1,point2);
        }
        this._personInfo();
    }

    static addPoint(index, point1, point2){
        this.viewer.entities.add({
            id: "bufferPoint"+ index,
            position: Cesium.Cartesian3.fromDegrees(point1, point2, 0),
            point: {
                pixelSize: 10,
                color: Cesium.Color.YELLOW,
                outlineWidth: 3,
                outlineColor: Cesium.Color.YELLOW.withAlpha(0.4),
            }
        });
    }

    // region添加缓冲区
    static _personInfo() {
        let viewer = window.selfDefine.viewer;
        this.bufferAn = new bufferAnalysis(viewer);
        let centerPoint = [118.809666, 32.0145666];
        let arrayData = [];  //globalVar.pollutionData;
        let dataPoint = this.jsonDatas;
        // for(let item in arrayData){
        //     dataPoint = dataPoint.concat((arrayData[item][0]));
        // }
        let bufferResult = this.bufferAn.initPointBuffer(centerPoint, dataPoint, 3000);
        console.log("bufferResultData:", bufferResult);
        // store.commit("setBufferResult", bufferResult);
        // bufferRe.methods.updateBufferData();
    }

    // 删除缓冲区
    static _removeBuffer(){
        this.bufferAn && this.bufferAn.removeBufferPolygon();
    }
    // endregion
}

参考turf官网