Refine sensor integration strategy

This commit is contained in:
2026-03-25 17:42:16 +08:00
parent a19342d61f
commit f7d4499e36
11 changed files with 1509 additions and 8 deletions

View File

@@ -1,5 +1,8 @@
import { getTileSizePx, screenToWorld, worldToScreen, type CameraState } from '../camera/camera'
import { AccelerometerController } from '../sensor/accelerometerController'
import { CompassHeadingController } from '../sensor/compassHeadingController'
import { DeviceMotionController } from '../sensor/deviceMotionController'
import { GyroscopeController } from '../sensor/gyroscopeController'
import { type HeartRateDiscoveredDevice } from '../sensor/heartRateController'
import { HeartRateInputController } from '../sensor/heartRateInputController'
import { LocationController } from '../sensor/locationController'
@@ -98,6 +101,12 @@ export interface MapEngineViewState {
orientationMode: OrientationMode
orientationModeText: string
sensorHeadingText: string
deviceHeadingText: string
devicePoseText: string
headingConfidenceText: string
accelerometerText: string
gyroscopeText: string
deviceMotionText: string
compassDeclinationText: string
northReferenceButtonText: string
autoRotateSourceText: string
@@ -231,6 +240,12 @@ const VIEW_SYNC_KEYS: Array<keyof MapEngineViewState> = [
'orientationMode',
'orientationModeText',
'sensorHeadingText',
'deviceHeadingText',
'devicePoseText',
'headingConfidenceText',
'accelerometerText',
'gyroscopeText',
'deviceMotionText',
'compassDeclinationText',
'northReferenceButtonText',
'autoRotateSourceText',
@@ -386,6 +401,61 @@ function formatHeadingText(headingDeg: number | null): string {
return `${Math.round(normalizeRotationDeg(headingDeg))}`
}
function formatDevicePoseText(pose: 'upright' | 'tilted' | 'flat'): string {
if (pose === 'flat') {
return '平放'
}
if (pose === 'tilted') {
return '倾斜'
}
return '竖持'
}
function formatHeadingConfidenceText(confidence: 'low' | 'medium' | 'high'): string {
if (confidence === 'high') {
return '高'
}
if (confidence === 'medium') {
return '中'
}
return '低'
}
function formatClockTime(timestamp: number | null): string {
if (!timestamp || !Number.isFinite(timestamp)) {
return '--:--:--'
}
const date = new Date(timestamp)
const hh = String(date.getHours()).padStart(2, '0')
const mm = String(date.getMinutes()).padStart(2, '0')
const ss = String(date.getSeconds()).padStart(2, '0')
return `${hh}:${mm}:${ss}`
}
function formatGyroscopeText(gyroscope: { x: number; y: number; z: number } | null): string {
if (!gyroscope) {
return '--'
}
return `x:${gyroscope.x.toFixed(2)} y:${gyroscope.y.toFixed(2)} z:${gyroscope.z.toFixed(2)}`
}
function formatDeviceMotionText(motion: { alpha: number | null; beta: number | null; gamma: number | null } | null): string {
if (!motion) {
return '--'
}
const alphaDeg = motion.alpha === null ? '--' : Math.round(normalizeRotationDeg(360 - motion.alpha * 180 / Math.PI))
const betaDeg = motion.beta === null ? '--' : Math.round(motion.beta * 180 / Math.PI)
const gammaDeg = motion.gamma === null ? '--' : Math.round(motion.gamma * 180 / Math.PI)
return `a:${alphaDeg} b:${betaDeg} g:${gammaDeg}`
}
function formatOrientationModeText(mode: OrientationMode): string {
if (mode === 'north-up') {
return 'North Up'
@@ -589,12 +659,16 @@ function getInitialBearingDeg(from: LonLatPoint, to: LonLatPoint): number {
export class MapEngine {
buildVersion: string
renderer: WebGLMapRenderer
accelerometerController: AccelerometerController
compassController: CompassHeadingController
gyroscopeController: GyroscopeController
deviceMotionController: DeviceMotionController
locationController: LocationController
heartRateController: HeartRateInputController
feedbackDirector: FeedbackDirector
onData: (patch: Partial<MapEngineViewState>) => void
state: MapEngineViewState
accelerometerErrorText: string | null
previewScale: number
previewOriginX: number
previewOriginY: number
@@ -669,6 +743,7 @@ export class MapEngine {
constructor(buildVersion: string, callbacks: MapEngineCallbacks) {
this.buildVersion = buildVersion
this.onData = callbacks.onData
this.accelerometerErrorText = null
this.renderer = new WebGLMapRenderer(
(stats) => {
this.applyStats(stats)
@@ -679,6 +754,26 @@ export class MapEngine {
})
},
)
this.accelerometerController = new AccelerometerController({
onSample: (x, y, z) => {
this.accelerometerErrorText = null
this.telemetryRuntime.dispatch({
type: 'accelerometer_updated',
at: Date.now(),
x,
y,
z,
})
this.setState(this.getTelemetrySensorViewPatch(), true)
},
onError: (message) => {
this.accelerometerErrorText = `不可用: ${message}`
this.setState({
...this.getTelemetrySensorViewPatch(),
statusText: `加速度计启动失败 (${this.buildVersion})`,
}, true)
},
})
this.compassController = new CompassHeadingController({
onHeading: (headingDeg) => {
this.handleCompassHeading(headingDeg)
@@ -687,6 +782,43 @@ export class MapEngine {
this.handleCompassError(message)
},
})
this.gyroscopeController = new GyroscopeController({
onSample: (x, y, z) => {
this.telemetryRuntime.dispatch({
type: 'gyroscope_updated',
at: Date.now(),
x,
y,
z,
})
this.setState(this.getTelemetrySensorViewPatch(), true)
},
onError: () => {
this.setState(this.getTelemetrySensorViewPatch(), true)
},
})
this.deviceMotionController = new DeviceMotionController({
onSample: (alpha, beta, gamma) => {
this.telemetryRuntime.dispatch({
type: 'device_motion_updated',
at: Date.now(),
alpha,
beta,
gamma,
})
this.setState({
...this.getTelemetrySensorViewPatch(),
autoRotateSourceText: this.getAutoRotateSourceText(),
}, true)
if (this.state.orientationMode === 'heading-up' && this.refreshAutoRotateTarget()) {
this.scheduleAutoRotate()
}
},
onError: () => {
this.setState(this.getTelemetrySensorViewPatch(), true)
},
})
this.locationController = new LocationController({
onLocation: (update) => {
this.handleLocationUpdate(update.longitude, update.latitude, typeof update.accuracy === 'number' ? update.accuracy : null)
@@ -851,6 +983,12 @@ export class MapEngine {
orientationMode: 'manual',
orientationModeText: formatOrientationModeText('manual'),
sensorHeadingText: '--',
deviceHeadingText: '--',
devicePoseText: '竖持',
headingConfidenceText: '低',
accelerometerText: '未启用',
gyroscopeText: '--',
deviceMotionText: '--',
compassDeclinationText: formatCompassDeclinationText(DEFAULT_NORTH_REFERENCE_MODE),
northReferenceButtonText: formatNorthReferenceButtonText(DEFAULT_NORTH_REFERENCE_MODE),
autoRotateSourceText: formatAutoRotateSourceText('smart', false),
@@ -1019,6 +1157,9 @@ export class MapEngine {
{ label: '定位源', value: this.state.locationSourceText || '--' },
{ label: '当前位置', value: this.state.gpsCoordText || '--' },
{ label: 'GPS精度', value: telemetryState.lastGpsAccuracyMeters == null ? '--' : `${telemetryState.lastGpsAccuracyMeters.toFixed(1)}m` },
{ label: '设备朝向', value: this.state.deviceHeadingText || '--' },
{ label: '设备姿态', value: this.state.devicePoseText || '--' },
{ label: '朝向可信度', value: this.state.headingConfidenceText || '--' },
{ label: '目标距离', value: `${telemetryPresentation.distanceToTargetValueText}${telemetryPresentation.distanceToTargetUnitText}` || '--' },
{ label: '当前速度', value: `${telemetryPresentation.speedText} km/h` },
{ label: '心率源', value: this.state.heartRateSourceText || '--' },
@@ -1056,7 +1197,10 @@ export class MapEngine {
this.clearMapPulseTimer()
this.clearStageFxTimer()
this.clearSessionTimerInterval()
this.accelerometerController.destroy()
this.compassController.destroy()
this.gyroscopeController.destroy()
this.deviceMotionController.destroy()
this.locationController.destroy()
this.heartRateController.destroy()
this.feedbackDirector.destroy()
@@ -1172,6 +1316,24 @@ export class MapEngine {
}
}
getTelemetrySensorViewPatch(): Partial<MapEngineViewState> {
const telemetryState = this.telemetryRuntime.state
return {
deviceHeadingText: formatHeadingText(
telemetryState.deviceHeadingDeg === null
? null
: getCompassReferenceHeadingDeg(this.northReferenceMode, telemetryState.deviceHeadingDeg),
),
devicePoseText: formatDevicePoseText(telemetryState.devicePose),
headingConfidenceText: formatHeadingConfidenceText(telemetryState.headingConfidence),
accelerometerText: telemetryState.accelerometer
? `#${telemetryState.accelerometerSampleCount} ${formatClockTime(telemetryState.accelerometerUpdatedAt)} x:${telemetryState.accelerometer.x.toFixed(3)} y:${telemetryState.accelerometer.y.toFixed(3)} z:${telemetryState.accelerometer.z.toFixed(3)}`
: '未启用',
gyroscopeText: formatGyroscopeText(telemetryState.gyroscope),
deviceMotionText: formatDeviceMotionText(telemetryState.deviceMotion),
}
}
getGameModeText(): string {
return this.gameMode === 'score-o' ? '积分赛' : '顺序赛'
}
@@ -1930,6 +2092,10 @@ export class MapEngine {
}
attachCanvas(canvasNode: any, width: number, height: number, dpr: number, labelCanvasNode?: any): void {
if (this.mounted) {
return
}
this.renderer.attachCanvas(canvasNode, width, height, dpr, labelCanvasNode)
this.mounted = true
this.state.mapReady = true
@@ -1940,7 +2106,10 @@ export class MapEngine {
statusText: `单 WebGL 管线已完成,可切换手动或自动朝向 (${this.buildVersion})`,
})
this.syncRenderer()
this.accelerometerErrorText = null
this.compassController.start()
this.gyroscopeController.start()
this.deviceMotionController.start()
}
applyRemoteMapConfig(config: RemoteMapConfig): void {
@@ -2507,6 +2676,7 @@ export class MapEngine {
this.setState({
sensorHeadingText: formatHeadingText(compassHeadingDeg),
...this.getTelemetrySensorViewPatch(),
compassDeclinationText: formatCompassDeclinationText(this.northReferenceMode),
northReferenceButtonText: formatNorthReferenceButtonText(this.northReferenceMode),
autoRotateSourceText: this.getAutoRotateSourceText(),
@@ -2554,6 +2724,7 @@ export class MapEngine {
rotationText: formatRotationText(MAP_NORTH_OFFSET_DEG),
northReferenceText: formatNorthReferenceText(nextMode),
sensorHeadingText: formatHeadingText(compassHeadingDeg),
...this.getTelemetrySensorViewPatch(),
compassDeclinationText: formatCompassDeclinationText(nextMode),
northReferenceButtonText: formatNorthReferenceButtonText(nextMode),
compassNeedleDeg: formatCompassNeedleDegForMode(nextMode, this.smoothedSensorHeadingDeg),
@@ -2572,6 +2743,7 @@ export class MapEngine {
this.setState({
northReferenceText: formatNorthReferenceText(nextMode),
sensorHeadingText: formatHeadingText(compassHeadingDeg),
...this.getTelemetrySensorViewPatch(),
compassDeclinationText: formatCompassDeclinationText(nextMode),
northReferenceButtonText: formatNorthReferenceButtonText(nextMode),
compassNeedleDeg: formatCompassNeedleDegForMode(nextMode, this.smoothedSensorHeadingDeg),
@@ -2624,10 +2796,14 @@ export class MapEngine {
return null
}
getSmartAutoRotateHeadingDeg(): number | null {
const sensorHeadingDeg = this.smoothedSensorHeadingDeg === null
getPreferredSensorHeadingDeg(): number | null {
return this.smoothedSensorHeadingDeg === null
? null
: getMapReferenceHeadingDegFromSensor(this.northReferenceMode, this.smoothedSensorHeadingDeg)
}
getSmartAutoRotateHeadingDeg(): number | null {
const sensorHeadingDeg = this.getPreferredSensorHeadingDeg()
const movementHeadingDeg = this.getMovementHeadingDeg()
const speedKmh = this.telemetryRuntime.state.currentSpeedKmh
const smartSource = resolveSmartHeadingSource(speedKmh, movementHeadingDeg !== null)
@@ -2661,9 +2837,7 @@ export class MapEngine {
return this.getSmartAutoRotateHeadingDeg()
}
const sensorHeadingDeg = this.smoothedSensorHeadingDeg === null
? null
: getMapReferenceHeadingDegFromSensor(this.northReferenceMode, this.smoothedSensorHeadingDeg)
const sensorHeadingDeg = this.getPreferredSensorHeadingDeg()
const courseHeadingDeg = this.courseHeadingDeg === null
? null
: getMapReferenceHeadingDegFromCourse(this.northReferenceMode, this.courseHeadingDeg)

View File

@@ -0,0 +1,124 @@
export interface AccelerometerControllerCallbacks {
onSample: (x: number, y: number, z: number) => void
onError: (message: string) => void
}
const ACCELEROMETER_START_RETRY_DELAY_MS = 120
export class AccelerometerController {
callbacks: AccelerometerControllerCallbacks
listening: boolean
starting: boolean
accelerometerCallback: ((result: WechatMiniprogram.OnAccelerometerChangeCallbackResult) => void) | null
retryTimer: number
constructor(callbacks: AccelerometerControllerCallbacks) {
this.callbacks = callbacks
this.listening = false
this.starting = false
this.accelerometerCallback = null
this.retryTimer = 0
}
start(): void {
if (this.listening || this.starting) {
return
}
if (typeof wx.startAccelerometer !== 'function' || typeof wx.onAccelerometerChange !== 'function') {
this.callbacks.onError('当前环境不支持加速度计监听')
return
}
this.clearRetryTimer()
this.starting = true
this.detachCallback()
wx.stopAccelerometer({
complete: () => {
this.startAfterStop(false)
},
})
}
private startAfterStop(retried: boolean): void {
const callback = (result: WechatMiniprogram.OnAccelerometerChangeCallbackResult) => {
if (
typeof result.x !== 'number'
|| typeof result.y !== 'number'
|| typeof result.z !== 'number'
|| Number.isNaN(result.x)
|| Number.isNaN(result.y)
|| Number.isNaN(result.z)
) {
return
}
this.callbacks.onSample(result.x, result.y, result.z)
}
this.accelerometerCallback = callback
wx.onAccelerometerChange(callback)
wx.startAccelerometer({
interval: 'ui',
success: () => {
this.starting = false
this.listening = true
},
fail: (res) => {
const errorMessage = res && res.errMsg ? res.errMsg : 'startAccelerometer failed'
if (!retried && errorMessage.indexOf('has enable') >= 0) {
this.detachCallback()
this.clearRetryTimer()
this.retryTimer = setTimeout(() => {
this.retryTimer = 0
wx.stopAccelerometer({
complete: () => {
this.startAfterStop(true)
},
})
}, ACCELEROMETER_START_RETRY_DELAY_MS) as unknown as number
return
}
this.starting = false
this.detachCallback()
this.callbacks.onError(errorMessage)
},
})
}
stop(): void {
this.clearRetryTimer()
this.detachCallback()
wx.stopAccelerometer({
complete: () => {},
})
this.starting = false
this.listening = false
}
destroy(): void {
this.stop()
}
private clearRetryTimer(): void {
if (!this.retryTimer) {
return
}
clearTimeout(this.retryTimer)
this.retryTimer = 0
}
private detachCallback(): void {
if (!this.accelerometerCallback) {
return
}
if (typeof wx.offAccelerometerChange === 'function') {
wx.offAccelerometerChange(this.accelerometerCallback)
}
this.accelerometerCallback = null
}
}

View File

@@ -0,0 +1,77 @@
export interface DeviceMotionControllerCallbacks {
onSample: (alpha: number | null, beta: number | null, gamma: number | null) => void
onError: (message: string) => void
}
export class DeviceMotionController {
callbacks: DeviceMotionControllerCallbacks
listening: boolean
starting: boolean
motionCallback: ((result: WechatMiniprogram.OnDeviceMotionChangeCallbackResult) => void) | null
constructor(callbacks: DeviceMotionControllerCallbacks) {
this.callbacks = callbacks
this.listening = false
this.starting = false
this.motionCallback = null
}
start(): void {
if (this.listening || this.starting) {
return
}
if (typeof wx.startDeviceMotionListening !== 'function' || typeof wx.onDeviceMotionChange !== 'function') {
this.callbacks.onError('当前环境不支持设备方向监听')
return
}
const callback = (result: WechatMiniprogram.OnDeviceMotionChangeCallbackResult) => {
const alpha = typeof result.alpha === 'number' && !Number.isNaN(result.alpha) ? result.alpha : null
const beta = typeof result.beta === 'number' && !Number.isNaN(result.beta) ? result.beta : null
const gamma = typeof result.gamma === 'number' && !Number.isNaN(result.gamma) ? result.gamma : null
this.callbacks.onSample(alpha, beta, gamma)
}
this.motionCallback = callback
wx.onDeviceMotionChange(callback)
this.starting = true
wx.startDeviceMotionListening({
interval: 'game',
success: () => {
this.starting = false
this.listening = true
},
fail: (res) => {
this.starting = false
this.detachCallback()
this.callbacks.onError(res && res.errMsg ? res.errMsg : 'startDeviceMotionListening failed')
},
})
}
stop(): void {
this.detachCallback()
wx.stopDeviceMotionListening({
complete: () => {},
})
this.starting = false
this.listening = false
}
destroy(): void {
this.stop()
}
private detachCallback(): void {
if (!this.motionCallback) {
return
}
if (typeof wx.offDeviceMotionChange === 'function') {
wx.offDeviceMotionChange(this.motionCallback)
}
this.motionCallback = null
}
}

View File

@@ -0,0 +1,85 @@
export interface GyroscopeControllerCallbacks {
onSample: (x: number, y: number, z: number) => void
onError: (message: string) => void
}
export class GyroscopeController {
callbacks: GyroscopeControllerCallbacks
listening: boolean
starting: boolean
gyroCallback: ((result: WechatMiniprogram.OnGyroscopeChangeCallbackResult) => void) | null
constructor(callbacks: GyroscopeControllerCallbacks) {
this.callbacks = callbacks
this.listening = false
this.starting = false
this.gyroCallback = null
}
start(): void {
if (this.listening || this.starting) {
return
}
if (typeof wx.startGyroscope !== 'function' || typeof wx.onGyroscopeChange !== 'function') {
this.callbacks.onError('当前环境不支持陀螺仪监听')
return
}
const callback = (result: WechatMiniprogram.OnGyroscopeChangeCallbackResult) => {
if (
typeof result.x !== 'number'
|| typeof result.y !== 'number'
|| typeof result.z !== 'number'
|| Number.isNaN(result.x)
|| Number.isNaN(result.y)
|| Number.isNaN(result.z)
) {
return
}
this.callbacks.onSample(result.x, result.y, result.z)
}
this.gyroCallback = callback
wx.onGyroscopeChange(callback)
this.starting = true
wx.startGyroscope({
interval: 'game',
success: () => {
this.starting = false
this.listening = true
},
fail: (res) => {
this.starting = false
this.detachCallback()
this.callbacks.onError(res && res.errMsg ? res.errMsg : 'startGyroscope failed')
},
})
}
stop(): void {
this.detachCallback()
wx.stopGyroscope({
complete: () => {},
})
this.starting = false
this.listening = false
}
destroy(): void {
this.stop()
}
private detachCallback(): void {
if (!this.gyroCallback) {
return
}
if (typeof wx.offGyroscopeChange === 'function') {
wx.offGyroscopeChange(this.gyroCallback)
}
this.gyroCallback = null
}
}