欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

铯 绘制点、线、圆、矩形

最编程 2024-03-31 07:44:35
...

const createRectanglePoint = function(position){
    let point = window.viewer.entities.add({
        position: position,
        point: {
            pixelSize: 10,
            color: Cesium.Color.YELLOW,
            eyeOffset: new Cesium.Cartesian3(0, 0, -300),
            heightReferenceCesium.HeightReference.CLAMP_TO_GROUND 
        }
    })
    return point;
}

线

const createPolyline = function (positions) {
    let profilePolyLine = window.viewer.entities.add({
        id: 'drawPolyline',
        polyline: {
            // 鼠标移动绘制
            // positions: new Cesium.CallbackProperty(function () {
            //     return positions
            // }, false),
            positions: positions,
            show: true,
            material: Cesium.Color.GREEN,
            depthFailMaterial : new Cesium.PolylineOutlineMaterialProperty({ // 折线低于地形时用于绘制折线的材料
                color : Cesium.Color.RED
            }),
            width: 2,
            clampToGround: true,
            eyeOffset: new Cesium.Cartesian3(0, 0, -100),
            heightReferenceCesium.HeightReference.CLAMP_TO_GROUND 
        }
    });
    return profilePolyLine;
}

方向线

/**
 * @description: 绘制坡度方向点
 * @param {*} position 方向线起始点
 * @param {*} linePosition 方向线坐标数组
 */
const drawSlopeDirection = function (position, linePosition){
    let point = coordinatesChange(position, 'Cartographic', 'Cartesian3')
    window.viewer.entities.add({
        position: point,
        point: {
            show: true,
            pixelSize: 15,
            color: getTextColor('#fa7b27'),
            eyeOffset: new Cesium.Cartesian3(0, 0, -300),
            heightReferenceCesium.HeightReference.CLAMP_TO_GROUND
        },
        polyline: { // 方向线
            clampToGround: true, // 贴地
            positions: Cesium.Cartesian3.fromDegreesArray(linePosition), 
            material: new Cesium.PolylineArrowMaterialProperty(getTextColor('#fabc27')),
            width: 30,
            eyeOffset: new Cesium.Cartesian3(0, 0, -100),
            heightReferenceCesium.HeightReference.CLAMP_TO_GROUND
        },
    });
}

function drawCircle(data) {
  const circle = window.viewer.entities.add({
    id: "drawCircle",
    position: Cesium.Cartesian3.fromDegrees(data.longitude, data.latitude, 0),
    ellipse: {
      semiMinorAxis: data.radius, // 半短轴
      semiMajorAxis: data.radius, // 半长轴
      height: 0,
      material: Cesium.Color.RED.withAlpha(0.5),
      outline: true, // 高度必须设置轮廓显示
      outlineColor: Cesium.Color.RED,
      outlineWidth: 5,
      clampToGround: true,
      eyeOffset: new Cesium.Cartesian3(0, 0, -100),
      heightReference: Cesium.HeightReference.CLAMP_TO_GROUND
    }
  });
  window.viewer.flyTo(circle);
}

矩形

const createRectangle = function (positions){
    let rectangle = window.viewer.entities.add({
        rectangle: {
            coordinates: new Cesium.CallbackProperty(function () {
                let obj = Cesium.Rectangle.fromCartesianArray(positions);
                return obj;
            }, false),
            material: Cesium.Color.RED.withAlpha(0.5),
            // height : 0,
            eyeOffset: new Cesium.Cartesian3(0, 0, -100),
            heightReferenceCesium.HeightReference.RELATIVE_TO_GROUND  // 三维模式绘制时候设置贴地。不然缩放时候点会偏移
        }
    })
}