waveform-analysis 0.1.75 → 0.1.77

package/src/components/core/xAxisTicks.ts

@@ -0,0 +1,69 @@
+import { scaleLinear } from 'd3'
+
+const MAX_TICK_COUNT = 3000
+
+/** ECharts-style numeric ticks inside the viewport; never expands its domain. */
+export function resolveXAxisTicks(
+  domain: readonly [number, number],
+  splitNumber: number,
+  minInterval = 0,
+): number[] {
+  const [start, end] = domain
+  if (!Number.isFinite(start) || !Number.isFinite(end)) return []
+  if (start === end) return normalizeTicks([start], start, end)
+  if (start > end) return resolveXAxisTicks([end, start], splitNumber, minInterval).reverse()
+
+  const count = Number.isFinite(splitNumber) ? Math.max(1, Math.round(splitNumber)) : 5
+  const roughInterval = (end - start) / count
+  const exponent = Math.floor(Math.log10(roughInterval))
+  const power = 10 ** exponent
+  const fraction = roughInterval / power
+  const coefficient =
+    fraction < 1.5 ? 1 : fraction < 2.5 ? 2 : fraction < 4 ? 3 : fraction < 7 ? 5 : 10
+  const interval = Math.max(coefficient * power, minInterval)
+  const precision = Math.max(0, 2 - Math.floor(Math.log10(interval)))
+  const fallback = () => fallbackTicks(start, end, count)
+
+  // Extreme magnitudes may exceed decimal rounding or safe integer index precision.
+  if (!Number.isFinite(interval) || interval <= 0 || precision > 100) return fallback()
+  const first = Math.ceil(snapTickIndex(start / interval))
+  const last = Math.floor(snapTickIndex(end / interval))
+  if (!Number.isSafeInteger(first) || !Number.isSafeInteger(last)) return fallback()
+  if (last - first + 1 > MAX_TICK_COUNT) return fallback()
+
+  const ticks: number[] = []
+  for (let index = first; index <= last; index++) {
+    const value = Number((index * interval).toFixed(precision))
+    if (ticks.length && value <= ticks[ticks.length - 1]!) return fallback()
+    ticks.push(value)
+  }
+  return normalizeTicks(ticks, start, end)
+}
+
+function fallbackTicks(start: number, end: number, count: number): number[] {
+  const scale = scaleLinear().domain([start, end])
+  let targetCount = Math.min(count, MAX_TICK_COUNT)
+  while (true) {
+    const ticks = normalizeTicks(scale.ticks(targetCount), start, end)
+    if (ticks.length <= MAX_TICK_COUNT) return ticks
+    // D3 treats count as a hint. Regenerate with a wider interval instead of truncating.
+    targetCount = Math.max(1, Math.floor(targetCount / 2))
+  }
+}
+
+function normalizeTicks(values: number[], start: number, end: number): number[] {
+  return [
+    ...new Set(
+      values
+        .filter((value) => Number.isFinite(value) && value >= start && value <= end)
+        .map((value) => (value === 0 ? 0 : value)),
+    ),
+  ].sort((a, b) => a - b)
+}
+
+function snapTickIndex(value: number): number {
+  const rounded = Math.round(value)
+  return Math.abs(value - rounded) <= Number.EPSILON * Math.max(1, Math.abs(value)) * 4
+    ? rounded
+    : value
+}

package/src/components/core/yAxisLayoutMetrics.ts

@@ -1,3 +1,4 @@
+import type { WaveformAmplitudeLimits } from '../../types'
 import type { WaveformOverlayMode } from '../data/types'
 import {
   Y_AXIS_CHARACTER_WIDTH,
@@ -44,6 +45,7 @@ export function resolveYAxisLayoutMetrics(
   padding?: YAxisPaddingOptions | number,
   showUnits = true,
   measureTextWidth?: (text: string) => number,
+  amplitudeLimits?: WaveformAmplitudeLimits,
 ): YAxisLayoutMetrics {
   const labelBandWidth = resolveYAxisLabelBandWidth(
     typeof padding === 'object' ? padding.labelTextStyle : undefined,
@@ -58,6 +60,7 @@ export function resolveYAxisLayoutMetrics(
         yDomains,
         viewportYDomains,
         padding,
+        amplitudeLimits,
       ),
     )
     .map((group) =>
@@ -71,6 +74,7 @@ export function resolveYAxisLayoutMetrics(
         measureTextWidth,
         group.maximumTick,
         group.minimumTick,
+        group.amplitudeLimit,
       ),
     )
   const tickTextWidth = Math.max(

package/src/components/core/yAxisTicks.ts

@@ -0,0 +1,39 @@
+import type { WaveformAmplitudeLimit } from '../../types'
+import { resolveYAxisTicksECharts } from './niceScale'
+
+export interface ResolvedYAxisTicks {
+  domain: [number, number]
+  values: number[]
+}
+
+export function resolveYAxisTicks(
+  domain: [number, number],
+  tickCount = 5,
+  nice = true,
+  limit?: WaveformAmplitudeLimit,
+): ResolvedYAxisTicks {
+  if (!nice) {
+    // 如果不需要 nice，使用简单的线性分割
+    const effectiveTickCount =
+      typeof tickCount === 'number' && Number.isFinite(tickCount)
+        ? Math.max(2, Math.floor(tickCount))
+        : 5
+    const [axisStart, axisEnd] = domain
+    return {
+      domain,
+      values: Array.from(
+        { length: effectiveTickCount },
+        (_, index) => axisStart + ((axisEnd - axisStart) * index) / (effectiveTickCount - 1),
+      ),
+    }
+  }
+
+  // 使用 ECharts 兼容的 1/2/5 系列算法
+  const ticks = resolveYAxisTicksECharts(domain, tickCount)
+  if (!limit) return ticks
+  const bounded: [number, number] = [limit.lower ?? ticks.domain[0], limit.upper ?? ticks.domain[1]]
+  return {
+    domain: bounded,
+    values: ticks.values.filter((value) => value >= bounded[0] && value <= bounded[1]),
+  }
+}

package/src/components/data/types.ts

@@ -5,6 +5,8 @@
 
 // 重新导出所有类型
 export type {
+  WaveformAmplitudeLimit,
+  WaveformAmplitudeLimits,
   WaveformPoint,
   WaveformDisplayMode,
   WaveformUnitDisplayMode,

package/src/components/interaction/integerZoom.ts

@@ -1,4 +1,5 @@
-import { scaleLinear } from 'd3'
+import { resolveXAxisTicks } from '../core/xAxisTicks'
+import { formatPlainNumber } from '../../utils/formatters'
 
 export interface IntegerZoomOptions {
   integerZoom?: boolean
@@ -10,17 +11,20 @@ export function integerZoomTicks(
   count: number,
   options: IntegerZoomOptions,
 ) {
-  if (!options.integerZoom) return scaleLinear().domain(domain).ticks(count)
+  if (!options.integerZoom) return resolveXAxisTicks(domain, count)
   const factor = options.timeUnit === 's' ? 1 : 1000
-  return scaleLinear()
-    .domain(domain.map((value) => value * factor))
-    .ticks(count)
-    .filter(Number.isInteger)
+  const fractional = hasFractionalZoomDomain(domain, options)
+  return resolveXAxisTicks(
+    domain.map((value) => value * factor) as [number, number],
+    count,
+    fractional ? 0 : 1,
+  )
+    .filter((value) => fractional || Number.isInteger(value))
     .map((value) => value / factor)
 }
 
 export function formatIntegerZoomLabel(value: number): string {
-  return String(Math.round(value))
+  return formatPlainNumber(Number(stableInteger(value).toPrecision(15)))
 }
 
 function stableInteger(value: number): number {
@@ -30,7 +34,17 @@ function stableInteger(value: number): number {
     : value
 }
 
-/** Align outwards in display units; all returned coordinates remain in seconds. */
+function displayDomain(domain: [number, number], options: IntegerZoomOptions): [number, number] {
+  const factor = options.timeUnit === 's' ? 1 : 1000
+  return [stableInteger(domain[0] * factor), stableInteger(domain[1] * factor)]
+}
+
+/** Fractional viewports, including those panned across an integer, need decimal ticks. */
+function hasFractionalZoomDomain(domain: [number, number], options: IntegerZoomOptions): boolean {
+  return displayDomain(domain, options).some((value) => !Number.isInteger(value))
+}
+
+/** Align outwards only when the displayed span reaches one unit. */
 export function alignIntegerZoomDomain(
   domain: [number, number],
   options: IntegerZoomOptions,
@@ -41,24 +55,29 @@ export function alignIntegerZoomDomain(
   const end = stableInteger(Math.max(domain[0], domain[1]) * factor)
   if (!Number.isSafeInteger(Math.floor(start)) || !Number.isSafeInteger(Math.ceil(end)))
     return domain
+  if (end > start && end - start < 1) return [start / factor, end / factor]
   const left = Math.floor(start)
   return [left / factor, Math.max(left + 1, Math.ceil(end)) / factor]
 }
 
-/** Recover aligned endpoints after a D3 transform, tolerating floating-point round-off. */
+/** Recover endpoints after a D3 transform without applying a new zoom or changing pan span. */
 export function normalizeIntegerZoomDomain(
   domain: [number, number],
   options: IntegerZoomOptions,
 ): [number, number] {
-  return alignIntegerZoomDomain(domain, options)
+  if (!options.integerZoom) return domain
+  const factor = options.timeUnit === 's' ? 1 : 1000
+  return displayDomain(domain, options).map((value) => value / factor) as [number, number]
 }
 
-/** Translation snaps to the nearest unit so panning preserves the visible span. */
+/** Integer viewports snap translation; sub-unit viewports pan freely across integers. */
 export function alignIntegerPanDomain(
   domain: [number, number],
   options: IntegerZoomOptions,
 ): [number, number] {
   if (!options.integerZoom) return domain
   const factor = options.timeUnit === 's' ? 1 : 1000
-  return [Math.round(domain[0] * factor) / factor, Math.round(domain[1] * factor) / factor]
+  if (Math.abs(domain[1] - domain[0]) * factor < 1) return domain
+  const start = Math.round(domain[0] * factor) / factor
+  return [start, start + (domain[1] - domain[0])]
 }

package/src/components/interaction/remoteViewport.ts

@@ -1,4 +1,6 @@
 import type { ResolvedWaveformChartProps } from '../core/waveformChartTypes'
+import { hasMinimumVisibleXValues } from '../../core/rendering'
+import { normalizeIntegerZoomDomain } from './integerZoom'
 import {
   constrainZoomDomain,
   resolveMinimumZoomSpan,
@@ -32,7 +34,13 @@ export function restoreViewportDomain(
   const boundary = remotePanBoundary(props)
   return boundary
     ? clampViewportDomain(domain, boundary)
-    : constrainZoomDomain(domain, baseDomain, groups, props)
+    : normalizeIntegerZoomDomain(
+        constrainZoomDomain(domain, baseDomain, groups, {
+          ...props,
+          integerZoom: false,
+        }),
+        props,
+      )
 }
 
 /** Wheel/box zoom keeps the remote position and uses loaded data for scale limits. */
@@ -44,10 +52,24 @@ export function constrainViewportZoom(
 ) {
   const boundary = remotePanBoundary(props)
   if (!boundary) return constrainZoomDomain(domain, baseDomain, groups, props)
-  return constrainZoomDomain(domain, boundary, [], {
+  const availableGroups = groups.filter((group) =>
+    hasMinimumVisibleXValues(group, boundary, props.minVisiblePoints),
+  )
+  // Only constrain against loaded groups that overlap the requested window. An
+  // unloaded remote window must remain free to move beyond the cached samples.
+  const loadedGroups = availableGroups.filter((group) =>
+    group.some((series) => {
+      const source = series.source
+      const length = source?.length ?? series.points.length
+      if (!length) return false
+      const first = source ? source.pointAt(0)! : series.points[0]
+      const last = source ? source.pointAt(length - 1)! : series.points[length - 1]
+      return first.x <= Math.max(...domain) && last.x >= Math.min(...domain)
+    }),
+  )
+  return constrainZoomDomain(domain, boundary, loadedGroups, {
     ...props,
-    minVisiblePoints: 0,
     maxZoomScale: null,
-    minZoomSpan: resolveMinimumZoomSpan(baseDomain, groups, props),
+    minZoomSpan: resolveMinimumZoomSpan(baseDomain, availableGroups, props),
   })
 }

package/src/components/interaction/stepZoom.ts

@@ -0,0 +1,33 @@
+import type { ResolvedWaveformChartProps } from '../core/waveformChartTypes'
+import { normalizeIntegerZoomDomain } from './integerZoom'
+import { constrainViewportZoom } from './remoteViewport'
+import type { ZoomSeriesGroup } from './zoomConstraints'
+
+export const sameZoomDomain = (a: [number, number], b: [number, number]) =>
+  a.every((value, index) => Math.abs(value - b[index]!) < 1e-12)
+
+/** Toolbar and wheel steps share their scale factor and constraints. */
+export function resolveStepZoomDomain(
+  current: [number, number],
+  action: 'zoom-in' | 'zoom-out',
+  boundary: [number, number],
+  groups: readonly ZoomSeriesGroup[],
+  props: ResolvedWaveformChartProps,
+  anchorRatio = 0.5,
+): [number, number] {
+  const [start, end] = current
+  const ratio = Math.max(0, Math.min(1, anchorRatio))
+  const anchor = start + (end - start) * ratio
+  const span = (end - start) * (action === 'zoom-in' ? 0.5 : 2)
+  const constrained = constrainViewportZoom(
+    normalizeIntegerZoomDomain([anchor - span * ratio, anchor + span * (1 - ratio)], props),
+    boundary,
+    groups,
+    props,
+  )
+  // An unsatisfiable point constraint may expand to the entire boundary.
+  // A zoom-in step must not turn into a zoom-out operation.
+  return action === 'zoom-in' && constrained[1] - constrained[0] > end - start
+    ? [...current]
+    : constrained
+}

package/src/components/interaction/useWaveformViewport.ts

@@ -12,6 +12,7 @@ import { constrainViewportZoom } from './remoteViewport'
 import { createViewportPan } from './viewportPan'
 import { transformForDomain } from './zoomConstraints'
 import { emitBoxZoomIntent } from './zoomEventPayload'
+import { sameZoomDomain } from './stepZoom'
 export interface ViewportContext {
   clearBoundaries?: (trackIndex?: number) => void
   props: ResolvedWaveformChartProps
@@ -32,8 +33,6 @@ export interface ViewportContext {
   isPresentationMode: ComputedRef<boolean>
   editorSeriesOptions: Ref<AnnotationSeriesCandidate[]>
   resolveInitialTrackDomain: (track: TrackLayout) => [number, number]
-  canZoomTrack: (track: TrackLayout) => boolean
-  canZoomSharedTracks: () => boolean
   configureZoom: () => void
   cancelPendingZoom: () => void
   clearHover: () => void
@@ -59,8 +58,6 @@ export function useWaveformViewport(context: ViewportContext) {
     isPresentationMode,
     editorSeriesOptions,
     resolveInitialTrackDomain,
-    canZoomTrack,
-    canZoomSharedTracks,
     configureZoom,
     cancelPendingZoom,
     clearHover,
@@ -184,7 +181,7 @@ export function useWaveformViewport(context: ViewportContext) {
   }
   const applyBoxZoom = (active: ViewportSelectionState) => {
     const track = trackLayouts.value.find((item) => item.index === active.trackIndex)
-    if (!track || (active.independent ? !canZoomTrack(track) : !canZoomSharedTracks())) return
+    if (!track) return
     const offsetX = active.independent ? 0 : track.left
     const left = Math.max(
       0,
@@ -205,6 +202,7 @@ export function useWaveformViewport(context: ViewportContext) {
       groups,
       props,
     )
+    if (sameZoomDomain(track.xScale.domain() as [number, number], xDomain)) return
     if (active.independent) {
       const next = [...independentTransforms.value]
       next[track.index] = transformForDomain(xDomain, baseXDomain, track.width)
@@ -333,26 +331,6 @@ export function useWaveformViewport(context: ViewportContext) {
     editorSeriesOptions,
     configureZoom,
   })
-  const requestViewportReset = (event: MouseEvent) => {
-    if (isPresentationMode.value || !props.zoomable || !isZoomMode.value) return
-    if (props.displayMode === 'independent') {
-      const target = event.target instanceof Element ? event.target : null
-      const overlay = target?.closest('[data-independent-overlay-index]')
-      const trackIndex = Number(overlay?.getAttribute('data-independent-overlay-index'))
-      const track = trackLayouts.value.find((item) => item.index === trackIndex)
-      if (!track) return
-      event.preventDefault()
-      resetViewport(trackIndex)
-      emit('zoom-reset', {
-        trackIndex,
-        seriesIds: track.legendSeries.map((series) => series.id),
-      })
-      return
-    }
-    event.preventDefault()
-    resetViewport()
-    emit('zoom-reset', {})
-  }
   return {
     selectionBox,
     beginViewportDrag,
@@ -362,6 +340,5 @@ export function useWaveformViewport(context: ViewportContext) {
     cancelViewportDrag,
     resetViewport,
     setViewportDomain,
-    requestViewportReset,
   }
 }