Cesium无人机实时视频投射及关键点拍照展示
·



最近做了这个无人机实时视频投射的功能,其中介入了实时无人机的坐标数据、姿态以及视频流。
说下思路:
其中锥体用了自定义的geometry,视频面用的是polygon给的video材质,坐标用了samplepositionproperty进行储存,姿态用了sampleproperty。
以下是部分代码:
构建自定义geometry:
getGeometry(dis, fov, aspect) {
let positions = new Float64Array(5 * 3);
fov = Cesium.Math.toRadians(fov / 2);
const tanfov = Math.tan(fov);
const halfw = tanfov * dis;
debugger
const halfh = halfw / aspect;
// 点0 坐标
positions[0] = 0.0;
positions[1] = 0.0;
positions[2] = 0.0;
// 点1 坐标
positions[3] = 1.0 * halfw;
positions[4] = 1.0 * dis;
positions[5] = 1.0 * halfh;
// 点2 坐标
positions[6] = -1.0 * halfw;
positions[7] = 1.0 * dis;
positions[8] = 1.0 * halfh;
// 点3 坐标
positions[9] = -1.0 * halfw;
positions[10] = 1.0 * dis;
positions[11] = -1.0 * halfh;
// 点4 坐标
positions[12] = 1.0 * halfw;
positions[13] = 1.0 * dis;
positions[14] = -1.0 * halfh;
// 创建顶点属性中的坐标
const attributes = new Cesium.GeometryAttributes({
position: new Cesium.GeometryAttribute({
componentDatatype: Cesium.ComponentDatatype.DOUBLE,
componentsPerAttribute: 3,
values: positions
})
});
// 点的索引
const indices = new Uint16Array(18);
indices[0] = 0;
indices[1] = 4;
indices[2] = 0;
indices[3] = 1;
indices[4] = 0;
indices[5] = 2;
indices[6] = 0;
indices[7] = 3;
indices[8] = 1;
indices[9] = 4;
indices[10] = 4;
indices[11] = 1;
indices[12] = 1;
indices[13] = 2;
indices[14] = 2;
indices[15] = 3;
indices[16] = 3;
indices[17] = 4;
let geometry = new Cesium.Geometry({
attributes: attributes,
indices: indices,
primitiveType: Cesium.PrimitiveType.LINES,
boundingSphere: Cesium.BoundingSphere.fromVertices(positions)
});
return geometry;
}
构建property:
reateProperty(positions, times) {
times = times || 120; // 不设置事件和速度 则默认120s播放完成
var distance = 0;// 总距离
var speed;
for (var i = 0; i < positions.length - 1; i++) {
var oneP = positions[i];
var secP = positions[i + 1];
var dis = Cesium.Cartesian3.distance(oneP, secP);
distance += dis;
}
speed = distance / times; // (米/秒)
this.allDistance = distance;
this.startTime = this.viewer.clock.currentTime;
this.endTime = Cesium.JulianDate.addSeconds(this.startTime, times, new Cesium.JulianDate());
var property = new Cesium.SampledPositionProperty(); // 模型的property
let hprProperty = new Cesium.SampledProperty(Cesium.Quaternion); // 姿态property
var oldTimes = 0;
for (var i = 1; i < positions.length; i++) {
var nowP = positions[i];
var lastP = positions[i - 1];
const hpr = this.headingPitchs[i];
if (i == 1) { // 下标从1开始 此处加上第一个点
property.addSample(this.startTime, positions[0]);
const firstHpr = this.headingPitchs[0];
let firstHeadingPitchRoll = new Cesium.HeadingPitchRoll(
Cesium.Math.toRadians(firstHpr.heading),
Cesium.Math.toRadians(firstHpr.pitch),
Cesium.Math.toRadians(0)
)
let firstQua = Cesium.Transforms.headingPitchRollQuaternion(positions[0], firstHeadingPitchRoll);
hprProperty.addSample(this.startTime, firstQua);
}
oldTimes += Cesium.Cartesian3.distance(nowP, lastP) / speed;
var nowTime = Cesium.JulianDate.addSeconds(this.startTime, oldTimes, new Cesium.JulianDate());
property.addSample(nowTime, nowP);
let headingPitchRoll = new Cesium.HeadingPitchRoll(
Cesium.Math.toRadians(hpr.heading),
Cesium.Math.toRadians(hpr.pitch),
Cesium.Math.toRadians(0)
)
let qua = Cesium.Transforms.headingPitchRollQuaternion(positions[0], headingPitchRoll);
hprProperty.addSample(nowTime, qua);
}
return {
property, hprProperty
}
}
更多推荐
所有评论(0)