23.cesuim分析之地形开挖

地形开挖图

代码

let viewer=null
let tempEntities = []
let clippingPoints = []
export const clippings = () => {
    clippingPoints.push(clippingPoints[0]);
    let clippingPlanes1 = createClippingPlane(clippingPoints);
    viewer.scene.globe.depthTestAgainstTerrain = true;
    // if(viewer.scene.globe.clippingPlanes){
    //     viewer.scene.globe.clippingPlanes.add(clippingPlanes1)
    // }else{
       viewer.scene.globe.clippingPlanes = new Cesium.ClippingPlaneCollection({
        planes: clippingPlanes1,
        edgeWidth: 1.0,
        edgeColor: Cesium.Color.BLACK
    }); 
    // }
    

}

const createClippingPlane = (points_) => {
    let points = [];
    for (let i = 0; i < points_.length - 1; i++) {
        points.push(Cesium.Cartesian3.fromDegrees(points_[i][0], points_[i][1]))
    }
    let pointsLength = points.length;
    let clippingPlanes = []; // 存储ClippingPlane集合
    for (let i = 0; i < pointsLength; ++i) {
        let nextIndex = (i + 1) % pointsLength;
        let midpoint = Cesium.Cartesian3.add(points[i], points[nextIndex], new Cesium.Cartesian3());
        midpoint = Cesium.Cartesian3.multiplyByScalar(midpoint, 0.5, midpoint);

        let up = Cesium.Cartesian3.normalize(midpoint, new Cesium.Cartesian3());
        let right = Cesium.Cartesian3.subtract(points[nextIndex], midpoint, new Cesium.Cartesian3());
        right = Cesium.Cartesian3.normalize(right, right);

        let normal = Cesium.Cartesian3.cross(right, up, new Cesium.Cartesian3());
        normal = Cesium.Cartesian3.normalize(normal, normal);

        let originCenteredPlane = new Cesium.Plane(normal, 0.0);
        let distance = Cesium.Plane.getPointDistance(originCenteredPlane, midpoint);

        clippingPlanes.push(new Cesium.ClippingPlane(normal, distance));
    }
    return clippingPlanes;
}

export const ClipAnalysis = (_viewer) => {
    viewer=_viewer
  
    //每次裁切前清空多边形数据
    clearDrawEntities();
    let position = [];
    let tempPoints = [];
    let handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
    //鼠标移动事件
    handler.setInputAction(function (movement) {
    }, Cesium.ScreenSpaceEventType.MOUSE_MOVE);
    //左键点击操作
    handler.setInputAction(function (click) {
        // 从相机位置通过windowPosition 世界坐标中的像素创建一条射线。返回Cartesian3射线的位置和方向。
        let ray = viewer.camera.getPickRay(click.position);
        // 查找射线与渲染的地球表面之间的交点。射线必须以世界坐标给出。返回Cartesian3对象
        position = viewer.scene.globe.pick(ray, viewer.scene);
        //将笛卡尔坐标转换为地理坐标
        let cartographic = viewer.scene.globe.ellipsoid.cartesianToCartographic(position);
        //将弧度转为度的十进制度表示
        let longitudeString = Cesium.Math.toDegrees(cartographic.longitude);
        let latitudeString = Cesium.Math.toDegrees(cartographic.latitude);
        let points = [longitudeString, latitudeString];
        // 将点坐标添加到数组中
        clippingPoints.push(points);
        tempPoints.push(position);
        let tempLength = tempPoints.length;
        //调用绘制点的接口
        let point = drawPoint(position);
        tempEntities.push(point);
        if (tempLength > 1) {
            let pointline = drawPolyline([tempPoints[tempPoints.length - 2], tempPoints[tempPoints.length - 1]]);
            tempEntities.push(pointline);
        } else {
            // tooltip.innerHTML = "请绘制下一个点，右键结束";
        }
    }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
    //右键点击操作
    handler.setInputAction(function (click) {
        let cartesian = viewer.camera.pickEllipsoid(click.position, viewer.scene.globe.ellipsoid);

        if (cartesian) {
            let tempLength = tempPoints.length;
            if (tempLength < 3) {
                alert('请选择3个以上的点再执行闭合操作命令');
            } else {
                //闭合最后一条线
                let pointline = drawPolyline([tempPoints[tempPoints.length - 1], tempPoints[0]]);
                tempEntities.push(pointline);

                tempEntities.push(tempPoints);
                clippings();
                clearDrawEntities()
                handler.destroy();//关闭事件句柄
                handler = null;

            }
        }
    }, Cesium.ScreenSpaceEventType.RIGHT_CLICK);
}
const drawPoint = (position) => {
    return viewer.entities.add({
        name: "点几何对象",
        position: position,
        point: {
            color: Cesium.Color.RED,
            pixelSize: 5,
            outlineColor: Cesium.Color.WHITE,
            outlineWidth: 1,
            disableDepthTestDistance: Number.POSITIVE_INFINITY,
            heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
        }
    });
}
const drawPolyline = (positions) => {

    if (positions.length < 1) return;
    return viewer.entities.add({
        name: "线几何对象",
        polyline: {
            positions: positions,
            width:  2.0,
            material: new Cesium.PolylineGlowMaterialProperty({
                color: Cesium.Color.RED,
            }),
            depthFailMaterial: new Cesium.PolylineGlowMaterialProperty({
                color: Cesium.Color.RED,
            }),
            clampToGround: true,
        }
    });
}

const clearDrawEntities = () => {
    tempEntities = [];
    clippingPoints = [];
    // 清除之前的实体
    const entitys = viewer.entities._entities._array;
    let length = entitys.length
    // 倒叙遍历防止实体减少之后entitys[f]不存在
    for (let f = length - 1; f >= 0; f--) {
        if (entitys[f]._name && (entitys[f]._name === '点几何对象' || entitys[f]._name === '线几何对象' || entitys[f]._name === '面几何对象')) {
            viewer.entities.remove(entitys[f]);
        }
    }
}
export const ClearAll = (_viewer) => {
    viewer=_viewer
    clearDrawEntities();
    viewer.scene.globe.clippingPlanes = null;
}