waveform-analysis 0.1.75 → 0.1.77

package/src/components/animation/useWaveformAnimations.ts

@@ -13,7 +13,12 @@ import { chartExportOptions } from '../controls/chartExportOptions'
 import { layoutAnnotations } from '../annotation/annotationLayout'
 import { useWaveformInstanceId } from '@/utils/waveformId'
 
-import { animationLayoutSignature, wrapAnimationCommands, type AnimationContext } from './context'
+import {
+  animationGridShape,
+  animationLayoutSignature,
+  wrapAnimationCommands,
+  type AnimationContext,
+} from './context'
 import { createPaginationPresentation } from './paginationPresentation'
 
 export function useWaveformAnimations(context: AnimationContext) {
@@ -26,6 +31,8 @@ export function useWaveformAnimations(context: AnimationContext) {
   const seen = new Set<string>()
   const prefix = useWaveformInstanceId('waveform-animation')
   let clipSequence = 0
+  let presentationGeneration = 0
+  let previousGrid = animationGridShape(context)
   let previousAnnotations = props.annotations
   let previousData = props.data
   let previousLayout = ''
@@ -63,9 +70,12 @@ export function useWaveformAnimations(context: AnimationContext) {
       states.has(track.id) ? projectTrack(states.get(track.id)!) : track,
     )
   })
-  const pagination = createPaginationPresentation(context, controller, config, effective, () =>
-    commit(true),
-  )
+  const pagination = createPaginationPresentation(context, controller, config, effective, () => {
+    commit(true)
+    for (const track of tracks.value) for (const series of track.seriesList) seen.delete(series.id)
+    skipSignature = undefined
+    annotations.clear()
+  })
   const projectedAnnotations = computed(() => {
     const anchors = new Map([...states.values()].flatMap((state) => [...state.anchors]))
     const values = visibleAnnotations().flatMap((annotation) => {
@@ -100,12 +110,10 @@ export function useWaveformAnimations(context: AnimationContext) {
         [...state.series].map(([id, series]) => [id, series.opacity] as const),
       ),
     )
-    return annotations.project(projectedAnnotations.value, opacities).map((annotation) => ({
-      ...annotation,
-      seriesOpacity: (annotation.seriesOpacity ?? 1) * pagination.opacity.value,
-    }))
+    return annotations.project(projectedAnnotations.value, opacities)
   })
   function commit(preservePagination = false) {
+    presentationGeneration++
     if (!preservePagination) pagination.reset()
     const previous = new Map(states)
     states.clear()
@@ -130,6 +138,8 @@ export function useWaveformAnimations(context: AnimationContext) {
     if (disposed) return
     const nextConfig = config.value
     const dataChanged = props.data !== previousData
+    // The post-flush grid watcher waits for lifecycle page resets before requesting replay.
+    if (!dataChanged && seen.size && animationGridShape(context) !== previousGrid) return
     if (dataChanged) {
       pendingFrom = new Map(states)
       previousData = props.data
@@ -162,8 +172,9 @@ export function useWaveformAnimations(context: AnimationContext) {
     previousTracks = tracks.value
     previousSamplingState = sampling.state.value
     controller.setEnabled(effective.value)
-    if (pagination.reconcile(dataChanged)) return
-    if (!effective.value || layoutChanged) {
+    const replay = pagination.reconcile(dataChanged)
+    if (replay === 'static') return
+    if (!effective.value || (layoutChanged && !replay)) {
       controller.finishAll()
       commit()
       return
@@ -224,6 +235,7 @@ export function useWaveformAnimations(context: AnimationContext) {
           if (
             !seen.has(id) &&
             nextConfig.animation.enabled &&
+            nextConfig.animation.duration > 0 &&
             skipSignature !== sampling.requestSignature.value
           ) {
             const state = states.get(track.id)!
@@ -255,8 +267,10 @@ export function useWaveformAnimations(context: AnimationContext) {
             invalidate()
           },
         }
+        const generation = presentationGeneration
         controller.animateSeriesEnter(id, binding, track.width, {
           ...nextConfig.animation,
+          duration: pagination.enterDuration(),
           delay:
             nextConfig.animation.delay + visibleIds.indexOf(id) * nextConfig.animation.staggerDelay,
           onComplete: () => {
@@ -264,7 +278,7 @@ export function useWaveformAnimations(context: AnimationContext) {
             entering.delete(id)
             invalidate()
             queueMicrotask(() => {
-              if (!disposed) annotations.release(id)
+              if (!disposed && presentationGeneration === generation) annotations.release(id)
             })
             nextConfig.animation.onComplete?.()
           },
@@ -311,6 +325,17 @@ export function useWaveformAnimations(context: AnimationContext) {
     reconcile,
     { immediate: true },
   )
+  watch(
+    [() => animationGridShape(context), () => props.data],
+    ([shape, data], [previousShape, previousData]) => {
+      previousGrid = shape
+      if (disposed || shape === previousShape || data !== previousData || !seen.size) return
+      // Lifecycle page resets have now selected the final grid and page.
+      pagination.requestLayout()
+      reconcile()
+    },
+    { flush: 'post' },
+  )
   watch(
     () => props.annotationsVisible,
     (visible) => {
@@ -343,7 +368,6 @@ export function useWaveformAnimations(context: AnimationContext) {
         controller.finishWhere(
           (key) => key.scope === 'update' || key.scope === 'domain',
           () => {
-            pagination.reset()
             for (const track of tracks.value) {
               const old = states.get(track.id),
                 next = staticTrack(track, visibleAnnotations(), old, true)
@@ -405,7 +429,6 @@ export function useWaveformAnimations(context: AnimationContext) {
   return {
     presentationTracks,
     presentationAnnotations,
-    paginationOpacity: pagination.opacity,
     stabilizeAnimations,
     wrap: <T extends object>(commands: T) => wrapAnimationCommands(commands, stabilizeAnimations),
     wrapPagination: pagination.wrapPagination,

package/src/components/controls/useChartCommands.ts

@@ -16,6 +16,7 @@ import { paddedDomain } from '../../utils'
 import { transformForDomain } from '../interaction/zoomConstraints'
 import { constrainViewportZoom } from '../interaction/remoteViewport'
 import { normalizeIntegerZoomDomain } from '../interaction/integerZoom'
+import { resolveStepZoomDomain, sameZoomDomain } from '../interaction/stepZoom'
 import type { useControlMode } from './useControlMode'
 
 type Domain = [number, number]
@@ -34,7 +35,7 @@ interface Context {
   legacyReset: (index?: number) => void
   legacySet: (domain: Domain, index?: number) => void
 }
-const same = (a: Domain, b: Domain) => a.every((v, i) => Math.abs(v - b[i]!) < 1e-12)
+const same = sameZoomDomain
 export function useChartCommands(c: Context) {
   let sequence = 0
   const independent = computed(() => c.props.displayMode === 'independent')
@@ -104,18 +105,16 @@ export function useChartCommands(c: Context) {
           paddedDomain(tracks.flatMap((t) => t.seriesList.flatMap((s) => s.xDomain))),
           c.props.xDomainStrategy,
         )
-      let requested: Domain = domain ?? bounds
-      if (before && (action === 'zoom-in' || action === 'zoom-out')) {
-        const [a, b] = before.xDomain
-        const half = (b - a) * (action === 'zoom-in' ? 0.25 : 1)
-        requested = [(a + b) / 2 - half, (a + b) / 2 + half]
-      }
-      const xDomain = constrainViewportZoom(
-        normalizeIntegerZoomDomain(requested, c.props),
-        bounds,
-        tracks.filter((t) => t.hasVisibleSeries).map((t) => t.seriesList),
-        c.props,
-      )
+      const seriesGroups = tracks.filter((t) => t.hasVisibleSeries).map((t) => t.seriesList)
+      const xDomain =
+        before && (action === 'zoom-in' || action === 'zoom-out')
+          ? resolveStepZoomDomain(before.xDomain, action, bounds, seriesGroups, c.props)
+          : constrainViewportZoom(
+              normalizeIntegerZoomDomain(domain ?? bounds, c.props),
+              bounds,
+              seriesGroups,
+              c.props,
+            )
       const resetsY = action === 'reset' || action === 'fit'
       const hasY =
         resetsY &&

package/src/components/core/amplitudeLimits.ts

@@ -0,0 +1,44 @@
+import type { WaveformAmplitudeLimit, WaveformAmplitudeLimits } from '../../types'
+
+export function normalizeAmplitudeLimit(
+  limit?: WaveformAmplitudeLimit,
+): WaveformAmplitudeLimit | undefined {
+  if (!limit) return undefined
+  const lower = Number.isFinite(limit.lower) ? limit.lower : undefined
+  const upper = Number.isFinite(limit.upper) ? limit.upper : undefined
+  if (lower === undefined && upper === undefined) return undefined
+  if (lower !== undefined && upper !== undefined && lower >= upper) return undefined
+  return { lower, upper }
+}
+
+export function mergeAmplitudeLimits(
+  series: readonly { id: string }[],
+  limits?: WaveformAmplitudeLimits,
+): WaveformAmplitudeLimit | undefined {
+  const valid = series.flatMap((item) => {
+    const limit = normalizeAmplitudeLimit(limits?.[item.id])
+    return limit ? [limit] : []
+  })
+  const lowers = valid.flatMap((limit) => (limit.lower === undefined ? [] : [limit.lower]))
+  const uppers = valid.flatMap((limit) => (limit.upper === undefined ? [] : [limit.upper]))
+  return normalizeAmplitudeLimit({
+    lower: lowers.length ? Math.min(...lowers) : undefined,
+    upper: uppers.length ? Math.max(...uppers) : undefined,
+  })
+}
+
+export function applyAmplitudeLimits(
+  padded: [number, number],
+  limit: WaveformAmplitudeLimit,
+  automatic: [number, number] = padded,
+): [number, number] {
+  let lower = limit.lower ?? padded[0]
+  let upper = limit.upper ?? padded[1]
+  if (lower >= upper) {
+    const fixed = limit.lower ?? limit.upper!
+    const span = Math.max(automatic[1] - automatic[0], Math.abs(fixed) * 0.1, 1)
+    if (limit.lower !== undefined) upper = lower + span
+    else lower = upper - span
+  }
+  return [lower, upper]
+}

package/src/components/core/layout.ts

@@ -1,4 +1,8 @@
-import type { WaveformOverlayMode } from '../../types'
+import type {
+  WaveformAmplitudeLimit,
+  WaveformAmplitudeLimits,
+  WaveformOverlayMode,
+} from '../../types'
 import { formatScientificAxisLabel, formatScientificAxisExponent, paddedDomain } from '../../utils'
 import type { DisplaySeries, DisplayTrack, TrackLayout } from './types'
 import { MAX_MULTI_Y_AXIS_COUNT } from './constants'
@@ -8,7 +12,9 @@ import {
   resolveTrackFixedYDomain,
   type WaveformYDomain,
 } from './yDomain'
-import { resolveYAxisTicksECharts } from './niceScale'
+import { resolveYAxisTicks } from './yAxisTicks'
+export { resolveYAxisTicks, type ResolvedYAxisTicks } from './yAxisTicks'
+import { applyAmplitudeLimits, mergeAmplitudeLimits } from './amplitudeLimits'
 import { applyYAxisPadding, withMaximumTick, type YAxisPaddingOptions } from './yAxisPadding'
 import { resolveYAxisLabelBandWidth } from './yAxisLabelStyle'
 
@@ -28,36 +34,6 @@ export function resolveYAxisTickCount(_plotHeight: number, splitNumber?: number)
   return 5
 }
 
-export interface ResolvedYAxisTicks {
-  domain: [number, number]
-  values: number[]
-}
-
-export function resolveYAxisTicks(
-  domain: [number, number],
-  tickCount = 5,
-  nice = true,
-): 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 系列算法
-  return resolveYAxisTicksECharts(domain, tickCount)
-}
-
 export function formatYAxisTickLabel(
   value: number,
   domain: [number, number],
@@ -101,6 +77,7 @@ export interface YAxisSeriesGroup {
   seriesList: DisplaySeries[]
   domain: [number, number]
   fixed: boolean
+  amplitudeLimit?: WaveformAmplitudeLimit
   maximumTick?: number
   minimumTick?: number
 }
@@ -191,6 +168,7 @@ export function resolveRenderedYAxisSeriesGroups(
   yDomains?: Record<string, WaveformYDomain>,
   viewportYDomains?: Record<string, [number, number]>,
   padding?: YAxisPaddingOptions | number,
+  amplitudeLimits?: WaveformAmplitudeLimits,
 ): YAxisSeriesGroup[] {
   const viewportYDomain = viewportYDomains?.[track.id]
   const axisTrack =
@@ -198,7 +176,13 @@ export function resolveRenderedYAxisSeriesGroups(
       ? track
       : { ...track, visibleSeries: track.series }
   return resolveYAxisSeriesGroups(axisTrack, overlayMode, yDomain, yDomains).map((group) => {
-    const padded = applyYAxisPadding(group, viewportYDomain, padding)
+    const limit = mergeAmplitudeLimits(group.seriesList, amplitudeLimits)
+    const automatic = limit ? buildYAxisSeriesGroups(axisTrack, overlayMode)[group.index]! : group
+    const padded = applyYAxisPadding(automatic, limit ? undefined : viewportYDomain, padding)
+    if (limit) {
+      padded.domain = applyAmplitudeLimits(padded.domain, limit, automatic.domain)
+      padded.amplitudeLimit = limit
+    }
     return track.visibleSeries.length
       ? padded
       : { ...padded, maximumTick: undefined, minimumTick: undefined }
@@ -215,10 +199,11 @@ export function axisTextMetrics(
   measureTextWidth?: (text: string) => number,
   maximumTick?: number,
   minimumTick?: number,
+  amplitudeLimit?: WaveformAmplitudeLimit,
 ): { tickTextWidth: number; titleTextWidth: number } {
   const resolvedTicks = tickValues
     ? { domain, values: tickValues }
-    : resolveYAxisTicks(domain, tickCount, nice)
+    : resolveYAxisTicks(domain, tickCount, nice, amplitudeLimit)
   const inRange = (value?: number) =>
     value !== undefined && value >= resolvedTicks.domain[0] && value <= resolvedTicks.domain[1]
       ? value
@@ -320,6 +305,7 @@ export function buildYAxisSlots(
   padding?: YAxisPaddingOptions | number,
   showUnits = true,
   measureTextWidth?: (text: string) => number,
+  amplitudeLimits?: WaveformAmplitudeLimits,
 ): { slots: YAxisSlot[]; clearance: { left: number; right: number } } {
   const labelBandWidth = resolveYAxisLabelBandWidth(
     typeof padding === 'object' ? padding.labelTextStyle : undefined,
@@ -335,6 +321,7 @@ export function buildYAxisSlots(
       yDomains,
       viewportYDomains,
       padding,
+      amplitudeLimits,
     ).forEach((group) => {
       const sideIndex = sideIndexes[group.side]++
       const key = `${group.side}:${sideIndex}`
@@ -348,6 +335,7 @@ export function buildYAxisSlots(
         measureTextWidth,
         group.maximumTick,
         group.minimumTick,
+        group.amplitudeLimit,
       )
       widths.set(key, Math.max(widths.get(key) ?? Y_AXIS_CHARACTER_WIDTH, tickTextWidth))
       titleWidths.set(key, Math.max(titleWidths.get(key) ?? Y_AXIS_CHARACTER_WIDTH, titleTextWidth))

package/src/components/core/trackLayoutBuilder.ts

@@ -6,6 +6,7 @@ import { scaleLinear, zoomIdentity, type ZoomTransform } from 'd3'
 
 import { type ResolvedWaveformRenderingOptions } from '../../core/rendering'
 import type {
+  WaveformAmplitudeLimits,
   WaveformDisplayMode,
   WaveformOverlayMode,
   WaveformPoint,
@@ -34,7 +35,6 @@ import {
   alignIntegerZoomDomain,
   normalizeIntegerZoomDomain,
   integerZoomTicks,
-  formatIntegerZoomLabel,
 } from '../interaction/integerZoom'
 import {
   Y_AXIS_LABEL_GAP,
@@ -59,6 +59,7 @@ export interface BuildTrackLayoutsOptions {
   initialXDomains?: Record<string, [number, number]>
   xDomainStrategy?: WaveformXDomainStrategy
   integerZoom?: boolean
+  amplitudeLimits?: WaveformAmplitudeLimits
   fixedYDomain?: [number, number]
   fixedYDomains?: Record<string, [number, number]>
   yDomains?: Record<string, [number, number]>
@@ -79,6 +80,7 @@ export interface BuildTrackLayoutsOptions {
   useNonEmptyBottomTracks?: boolean
   compactYAxisLayout?: boolean
   showAxisUnits?: boolean
+  domainTimeUnit?: 's' | 'ms'
 }
 
 function resolveIndependentXDomain(
@@ -96,7 +98,7 @@ function resolveIndependentXDomain(
     explicitDomain
       ? applyXDomainStrategy(explicitDomain, strategy, true)
       : applyXDomainStrategy(track.xDomain, strategy),
-    options,
+    { integerZoom: options.integerZoom, timeUnit: options.domainTimeUnit ?? options.timeUnit },
   )
 }
 
@@ -141,13 +143,19 @@ export function buildTrackLayouts(options: BuildTrackLayoutsOptions): TrackLayou
       options.fixedYDomains,
       options.yDomains,
       options.yAxisPadding ?? options.yAxisUpperPaddingRatio,
+      options.amplitudeLimits,
     )
     const sideIndexes = { left: 0, right: 0 }
     const sideOffsets = { left: 0, right: 0 }
     const yAxes: WaveformYAxisLayout[] = yAxisGroups.map((group) => {
       const sideIndex = sideIndexes[group.side]++
       const tickCount = resolveYAxisTickCount(cell.plotHeight, options.yAxisSplitNumber)
-      const resolvedTicks = resolveYAxisTicks(group.domain, tickCount, options.yAxisNice !== false)
+      const resolvedTicks = resolveYAxisTicks(
+        group.domain,
+        tickCount,
+        options.yAxisNice !== false,
+        group.amplitudeLimit,
+      )
       const scale = scaleLinear(resolvedTicks.domain, [cell.plotHeight, 0])
       const majorTicks = resolvedTicks.values
       const maximumTick =
@@ -220,8 +228,7 @@ export function buildTrackLayouts(options: BuildTrackLayoutsOptions): TrackLayou
       Math.max(2, Math.floor(cell.width / 100)),
       options,
     )
-    const xAxisLabelFormatter =
-      options.xAxisLabelFormatter ?? (options.integerZoom ? formatIntegerZoomLabel : undefined)
+    const xAxisLabelFormatter = options.xAxisLabelFormatter
     const yMajorTicks =
       yAxes[0]?.majorTicks ??
       (isEmpty

package/src/components/core/useWaveformChartController.ts

@@ -32,6 +32,7 @@ import { resolveCompactPaginationBand } from './pagination'
 import type { WaveformHoverState } from './types'
 import { useWaveformChartLifecycle } from './useWaveformChartLifecycle'
 import { usePreparedWaveformSeries } from './useWaveformData'
+import { remotePanBoundary } from '../interaction/remoteViewport'
 import { useWaveformLayout } from './useWaveformLayout'
 import { useWaveformPresentation } from './useWaveformPresentation'
 import { usePlotLabelLayout } from './usePlotLabelLayout'
@@ -82,7 +83,7 @@ export function useWaveformChartController(
   const hoverThrottle = useAnimationFrameThrottle()
 
   watch(
-    [() => props.yDomain, () => props.yDomains],
+    [() => props.yDomain, () => props.yDomains, () => props.amplitudeLimits],
     () => {
       sharedYDomains.value = {}
       independentYDomains.value = {}
@@ -102,6 +103,7 @@ export function useWaveformChartController(
       handleBeforeDataReferenceChange()
     },
     () => handleDataReferenceChange(),
+    () => Boolean(remotePanBoundary(props)),
   )
 
   const presentation = useWaveformPresentation({
@@ -263,8 +265,6 @@ export function useWaveformChartController(
     isPresentationMode,
     editorSeriesOptions,
     resolveInitialTrackDomain,
-    canZoomTrack: zoom.canZoomTrack,
-    canZoomSharedTracks: zoom.canZoomSharedTracks,
     configureZoom: zoom.configureZoom,
     cancelPendingZoom: zoom.cancelPendingZoom,
     clearHover: () => hover.clearHover(),
@@ -422,7 +422,6 @@ export function useWaveformChartController(
     ...animations.wrap(commands),
     presentationTracks: animations.presentationTracks,
     presentationAnnotations: animations.presentationAnnotations,
-    paginationOpacity: animations.paginationOpacity,
     stabilizeAnimations: animations.stabilizeAnimations,
     ...imageExport,
     margin,

package/src/components/core/useWaveformChartLifecycle.ts

@@ -16,6 +16,7 @@ import type { NormalizedWaveformGridOptions } from './grid'
 import type { DisplaySeries, DisplayTrack, TrackLayout } from './types'
 import type { ResolvedWaveformChartProps, WaveformChartEmit } from './waveformChartTypes'
 import { isEditableTarget } from '../interaction/interactionTarget'
+import { remotePanBoundary } from '../interaction/remoteViewport'
 
 export interface LifecycleContext {
   preserveFullViewport?: () => boolean
@@ -64,7 +65,6 @@ export interface LifecycleContext {
 }
 
 export function useWaveformChartLifecycle(context: LifecycleContext) {
-  useWaveformMeasurements(context)
   const {
     props,
     emit,
@@ -135,6 +135,15 @@ export function useWaveformChartLifecycle(context: LifecycleContext) {
   const { handleBeforeDataReferenceChange, handleDataReferenceChange } =
     useWaveformViewportRestore(context)
 
+  useWaveformMeasurements(context, {
+    beforeResize: () => {
+      if (remotePanBoundary(props)) handleBeforeDataReferenceChange()
+    },
+    afterResize: () => {
+      if (remotePanBoundary(props)) handleDataReferenceChange()
+    },
+  })
+
   watch(
     [
       innerWidth,
@@ -163,7 +172,7 @@ export function useWaveformChartLifecycle(context: LifecycleContext) {
   )
 
   watch(
-    () => [props.displayMode, props.integerZoom, props.integerZoom ? props.timeUnit : undefined],
+    () => [props.displayMode, props.integerZoom],
     () => {
       const previousPage = currentPage.value
       currentPage.value = 1

package/src/components/core/useWaveformData.ts

@@ -31,8 +31,11 @@ export interface PreparedWaveformSeries {
   hasErrorPoints: boolean
 }
 
-export function prepareWaveformSeries(data: WaveformData): PreparedWaveformSeries[] {
-  return normalizeWaveformSeriesSources(data).map(({ source, ...series }) => {
+export function prepareWaveformSeries(
+  data: WaveformData,
+  retainEmpty = false,
+): PreparedWaveformSeries[] {
+  return normalizeWaveformSeriesSources(data, retainEmpty).map(({ source, ...series }) => {
     const sourceMetrics = source.metrics(series.errorBar.visible)
     return {
       ...series,
@@ -61,11 +64,14 @@ export function usePreparedWaveformSeries(
   data: () => WaveformData,
   onBeforeDataChange: () => void,
   onDataChange: () => void,
+  retainEmpty: () => boolean = () => false,
 ) {
-  const preparedSeries = shallowRef<PreparedWaveformSeries[]>(prepareWaveformSeries(data()))
-  watch(data, (nextData) => {
+  const preparedSeries = shallowRef<PreparedWaveformSeries[]>(
+    prepareWaveformSeries(data(), retainEmpty()),
+  )
+  watch([data, retainEmpty], ([nextData, preserveEmpty]) => {
     onBeforeDataChange()
-    preparedSeries.value = prepareWaveformSeries(nextData)
+    preparedSeries.value = prepareWaveformSeries(nextData, preserveEmpty)
     onDataChange()
   })
   return preparedSeries

package/src/components/core/useWaveformLayout.ts

@@ -52,6 +52,9 @@ export function useWaveformLayout(context: LayoutContext) {
     annotationInteraction,
     linePointOverrides,
   } = context
+  // Display-unit switches must not change the base used by existing D3 transforms.
+  const domainTimeUnit = props.timeUnit
+  const domainOptions = () => ({ integerZoom: props.integerZoom, timeUnit: domainTimeUnit })
   const chartSeries = computed<DisplaySeries[]>(() =>
     preparedSeries.value.map((series, index): DisplaySeries => ({
       ...series,
@@ -174,12 +177,12 @@ export function useWaveformLayout(context: LayoutContext) {
           props.xDomainStrategy,
           true,
         ),
-        props,
+        domainOptions(),
       )
     }
     return alignIntegerZoomDomain(
       applyXDomainStrategy(sharedXDomain.value, props.xDomainStrategy),
-      props,
+      domainOptions(),
     )
   })
   const resolveOriginalTrackDomain = (track: TrackLayout): [number, number] => {
@@ -201,7 +204,7 @@ export function useWaveformLayout(context: LayoutContext) {
           props.xDomainStrategy,
           true,
         ),
-        props,
+        domainOptions(),
       )
     }
     return alignIntegerZoomDomain(
@@ -209,7 +212,7 @@ export function useWaveformLayout(context: LayoutContext) {
         paddedDomain(track.seriesList.flatMap((series) => series.xDomain)),
         props.xDomainStrategy,
       ),
-      props,
+      domainOptions(),
     )
   }
   const initialXDomain = computed(
@@ -261,10 +264,12 @@ export function useWaveformLayout(context: LayoutContext) {
       effectiveXDomains: context.boundaries?.value,
       xDomainStrategy: props.xDomainStrategy,
       integerZoom: props.integerZoom,
+      amplitudeLimits: props.amplitudeLimits,
       fixedYDomain: props.yDomain,
       fixedYDomains: props.yDomains,
       yDomains: viewportYDomains.value,
       timeUnit: props.timeUnit,
+      domainTimeUnit,
       xAxisLabelFormatter: props.axes?.x?.labelFormatter,
       yAxisSplitNumber: props.axes?.y?.splitNumber,
       yAxisNice: props.axes?.y?.nice,

package/src/components/core/useWaveformMeasurements.ts

@@ -15,6 +15,7 @@ export function useWaveformMeasurements(
     | 'titleAreaReserved'
     | 'titleMeasureStyle'
   >,
+  resizeHooks: { beforeResize?: () => void; afterResize?: () => void } = {},
 ) {
   const {
     container,
@@ -53,8 +54,10 @@ export function useWaveformMeasurements(
   onMounted(() => {
     if (!container.value) return
     resizeObserver.value = new ResizeObserver(([entry]) => {
+      resizeHooks.beforeResize?.()
       observedWidth.value = Math.max(0, entry?.contentRect.width ?? 0)
       observedHeight.value = Math.max(0, entry?.contentRect.height ?? 0)
+      resizeHooks.afterResize?.()
       void nextTick(measureTitle)
     })
     resizeObserver.value.observe(container.value)

package/src/components/core/useWaveformYAxisLayout.ts

@@ -49,6 +49,7 @@ export function useWaveformYAxisLayout(context: YAxisLayoutContext) {
       props.axes?.y,
       showUnits.value,
       isEdgeCompact.value ? measureYAxisTextWidth : undefined,
+      props.amplitudeLimits,
     ),
   )
   const hasYAxisLabels = computed(() =>
@@ -84,6 +85,7 @@ export function useWaveformYAxisLayout(context: YAxisLayoutContext) {
       props.axes?.y,
       showUnits.value,
       isEdgeCompact.value ? measureYAxisTextWidth : undefined,
+      props.amplitudeLimits,
     ),
   )
   const resolvedChartLeftMargin = computed(() =>

package/src/components/core/waveformChartTypes.ts

@@ -1,6 +1,7 @@
 import type { WaveformAnimationProps } from '../../animation/types'
 import type { WaveformToolbarOptions, WaveformControlState } from '../../types/controls'
 import type {
+  WaveformAmplitudeLimits,
   WaveformAnnotation,
   WaveformAxesOptions,
   WaveformData,
@@ -43,7 +44,7 @@ export interface WaveformChartProps extends WaveformAnimationProps {
   lineColor?: string
   showTooltip?: boolean
   zoomable?: boolean
-  /** Snap viewport endpoints outwards to integer X-axis display units. */
+  /** Prefer integer display-unit endpoints; preserve any window narrower than one unit. */
   integerZoom?: boolean
   pannable?: boolean
   /** Global record bounds in seconds; enables horizontal panning beyond loaded data. */
@@ -54,6 +55,8 @@ export interface WaveformChartProps extends WaveformAnimationProps {
   initialXDomain?: [number, number]
   initialXDomains?: Record<string, [number, number]>
   xDomainStrategy?: WaveformXDomainStrategy
+  /** Strict bounds per normalized series ID; active bounds override Y viewports. */
+  amplitudeLimits?: WaveformAmplitudeLimits
   yDomain?: [number, number]
   yDomains?: Record<string, [number, number]>
   timeUnit?: 's' | 'ms'