cesium定位地图上某个位置的单位(flyToBoundingSphere、flyTo)
·
思路:以单位里属性的position为中心点,用cesium里的polygon方法画一个半透明以单位里的属性unitsize为对边的六边形,实现点击定位按钮后可以flyto到地图上单位所在六边形位置,飞过去后销毁六边形。
//定位单位
focusUnit(unitId: string) {
//获取需要定位的图上单位
const unit = this.mapUnits.getById(unitId);
if (!unit) {
console.warn(`Unit with id ${unitId} not found.`);
return;
}
const camera = this.scene.viewer.camera;
//单位坐标转经纬度
const position = unit.position;
if(!position){
return
}
// 将position的Cartesian3坐标位置转换为 Cartographic (经度、纬度、高度)
const cartographicPosition = Cesium.Cartographic.fromCartesian(position);
const longitude = Cesium.Math.toDegrees(cartographicPosition.longitude);
const latitude = Cesium.Math.toDegrees(cartographicPosition.latitude);
// 使用 config 中定义的 unitSize 来设置多边形的大小
const unitSize = this.config.unitSize;
// 创建一个透明的多边形
const polygonEntity = this.scene.viewer.entities.add({
polygon: {
hierarchy: Cesium.Cartesian3.fromDegreesArray([
longitude - unitSize / 2 / 111320, // 西经
latitude - unitSize / 2 / 111320, // 南纬
longitude + unitSize / 2 / 111320, // 东经
latitude - unitSize / 2 / 111320, // 南纬
longitude + unitSize / 2 / 111320, // 东经
latitude + unitSize / 2 / 111320, // 北纬
longitude - unitSize / 2 / 111320, // 西经
latitude + unitSize / 2 / 111320 // 北纬
]),
material: Cesium.Color.RED.withAlpha(0.5) // 透明红色
}
});
// 控制飞的距离
const boundingSphere = new Cesium.BoundingSphere(position, this.config.unitSize * 8);
// 方案1:使用 flyToBoundingSphere
this.scene.viewer.camera.flyToBoundingSphere(boundingSphere, {
duration: 2,
offset: new Cesium.HeadingPitchRange(0, Cesium.Math.toRadians(-45)), // 俯角45度
complete: () => this.scene.viewer.entities.remove(polygonEntity),
cancel: () => this.scene.viewer.entities.remove(polygonEntity)
});
// 使用 flyTo 定位到多边形(缺点飞的太近了,还需调整)
// camera.flyTo({
// destination: position,
// duration: 2, // 飞行时间2秒
// orientation: {
// heading: Cesium.Math.toRadians(0), // 方向(水平方向)
// pitch: Cesium.Math.toRadians(-90), // 倾斜角度(垂直向下)
// roll: 0 // 滚动角度
// },
// complete: () => {
// // 销毁多边形
// this.scene.viewer.entities.remove(polygonEntity);
// },
// cancel: () => {
// console.warn('Fly to unit was canceled.');
// // 销毁多边形
// this.scene.viewer.entities.remove(polygonEntity);
// }
// });
}
更多推荐

所有评论(0)