铯 绘制点、线、圆、矩形
最编程
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),
heightReference: Cesium.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),
heightReference: Cesium.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),
heightReference: Cesium.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),
heightReference: Cesium.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),
heightReference: Cesium.HeightReference.RELATIVE_TO_GROUND // 三维模式绘制时候设置贴地。不然缩放时候点会偏移
}
})
}
上一篇: 84 坐标系、02 坐标系和百度坐标之间的相互转换算法
下一篇: Qgis使用