Appearance
四棱锥目标追踪
TargetTrackPyramidEffect 封装完整的动态目标追踪场景:飞机沿航路飞行,四棱锥从固定源点持续指向飞机,并同时显示发光航迹与航路采样点。
设计特点
- 公共 API 使用 WGS84 经纬高坐标,不要求业务层构造
Cartesian3。 - 航路模式由 SDK 内部创建飞机模型、
SampledPositionProperty、速度朝向和 Path。 - 自动配置循环时钟,并在
off/destroy时恢复进入效果前的时钟状态。 - 填充与轮廓均由 SDK 内部的 Primitive 管理。
- 目标更新只修改
modelMatrix,不会重复创建 Frustum 几何。 - 支持幂等的
on、off、destroy生命周期,统一清理飞机、航路和监听器。
基础用法
ts
import {
CesiumViewer,
TargetTrackPyramidEffect,
} from '@nexa/gis-cesium'
const airViewer = new CesiumViewer('container')
const origin = { longitude: 106.4553, latitude: 29.5063, height: 55 }
const route = []
for (let angle = 0; angle <= 360; angle += 45) {
const radians = angle * Math.PI / 180
route.push({
time: angle,
position: {
longitude: origin.longitude + Math.cos(radians) * 7.5,
latitude: origin.latitude + Math.sin(radians) * 5,
height: 300000,
},
})
}
const effect = new TargetTrackPyramidEffect({
origin,
route,
aircraftModelUrl: '/static/J16.glb',
playbackMultiplier: 10,
loop: true,
fov: 4,
fillColor: 'rgba(0, 255, 255, 0.28)',
outlineColor: 'rgba(255, 255, 0, 0.85)',
routeColor: 'rgba(255, 255, 0, 0.9)',
})
effect.on(airViewer)
effect.setVisible(false)
effect.setVisible(true)
effect.destroy()配置项
| 参数 | 类型 | 默认值 | 说明 |
|---|---|---|---|
origin | GeographicCoordinate | 必填 | 追踪起点 WGS84 经纬高坐标 |
target | GeographicCoordinate | 无 | 手动追踪模式的初始目标 |
route | TargetTrackPyramidRoutePoint[] | 无 | 飞机航路,至少两个时间严格递增的采样点 |
aircraftModelUrl | string | /static/J16.glb | 航路模式使用的飞机模型 |
aircraftScale | number | 1 | 飞机模型缩放 |
aircraftMinimumPixelSize | number | 96 | 飞机最小屏幕像素 |
routeColor | string | rgba(255, 255, 0, 0.9) | 航迹与采样点 CSS 颜色 |
routeWidth | number | 6 | 航迹线宽 |
showRoutePoints | boolean | true | 是否显示航路采样点 |
playbackMultiplier | number | 10 | 航路播放倍速 |
loop | boolean | true | 航路是否循环播放 |
fov | number | 4 | 视场角,单位度,有效范围 (0, 179) |
fillColor | string | rgba(0, 255, 255, 0.28) | 填充 CSS 颜色 |
outlineColor | string | rgba(255, 255, 0, 0.8) | 轮廓 CSS 颜色 |
showOutline | boolean | true | 是否创建轮廓 Primitive |
生命周期
ts
effect.on(airViewer) // 创建飞机、航路、四棱锥并开始播放
effect.off() // 移除全部资源并恢复原时钟,可再次 on
effect.destroy() // 清理 Entity、Primitive 和 Clock 监听不传 route 时仍可使用 target 与 updateTargetPosition 手动驱动。航路模式下,飞机位置由 SDK 在每个 Clock tick 内自动同步给四棱锥。