waveform-analysis 0.1.69 → 0.1.70
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +82 -49
- package/dist/index.cjs +1 -1
- package/dist/index.js +1256 -1202
- package/dist/style.css +1 -1
- package/dist/types/components/core/layout.d.ts +3 -1
- package/dist/types/components/core/usePlotLabelLayout.d.ts +6 -0
- package/dist/types/components/core/useWaveformChartController.d.ts +4 -2
- package/dist/types/components/core/useWaveformLayout.d.ts +1 -0
- package/dist/types/components/core/yAxisTitleLayout.d.ts +6 -1
- package/dist/types/components/rendering/WaveformLegend.vue.d.ts +1 -1
- package/dist/types/components/rendering/WaveformTrack.vue.d.ts +3 -0
- package/dist/types/components/rendering/WaveformTrackAxes.vue.d.ts +2 -0
- package/dist/types/components/rendering/channelLabel.d.ts +2 -0
- package/dist/types/types/chart.d.ts +3 -1
- package/package.json +1 -1
- package/src/components/WaveformChartView.vue +23 -5
- package/src/components/core/layout.ts +32 -6
- package/src/components/core/trackLayoutBuilder.ts +11 -9
- package/src/components/core/usePlotLabelLayout.ts +23 -0
- package/src/components/core/useWaveformChartController.ts +9 -0
- package/src/components/core/useWaveformLayout.ts +19 -6
- package/src/components/core/useWaveformPresentation.ts +7 -4
- package/src/components/core/useWaveformYAxisLayout.ts +15 -11
- package/src/components/core/yAxisLayoutMetrics.ts +1 -1
- package/src/components/core/yAxisTitleLayout.ts +38 -17
- package/src/components/interaction/WaveformTooltip.vue +2 -2
- package/src/components/interaction/useWaveformZoom.ts +24 -7
- package/src/components/rendering/WaveformLegend.vue +5 -3
- package/src/components/rendering/WaveformTrack.css +1 -1
- package/src/components/rendering/WaveformTrack.vue +15 -2
- package/src/components/rendering/WaveformTrackAxes.vue +11 -10
- package/src/components/rendering/WaveformTrackBackdrop.vue +1 -1
- package/src/components/rendering/channelLabel.ts +5 -0
- package/src/types/chart.ts +5 -1
- package/src/utils/formatters.ts +4 -3
package/README.md
CHANGED
|
@@ -86,45 +86,45 @@ const data = ref<WaveformData>({
|
|
|
86
86
|
|
|
87
87
|
### Props
|
|
88
88
|
|
|
89
|
-
| Prop | 类型
|
|
90
|
-
| -------------------------- |
|
|
91
|
-
| `data` | `WaveformData`
|
|
92
|
-
| `displayMode` | `'independent' \| 'separated' \| 'compact'`
|
|
93
|
-
| `overlayMode` | `'single-axis' \| 'multi-axis'`
|
|
94
|
-
| `layoutPreset` | `'default' \| 'edge-compact'`
|
|
95
|
-
| `unitDisplayMode` | `'axis' \| 'legend-single-series'`
|
|
96
|
-
| `timeUnit` | `'s' \| 'ms'`
|
|
97
|
-
| `xLabel` / `yLabel` | `string`
|
|
98
|
-
| `lineColor` | `string`
|
|
99
|
-
| `width` / `height` | `number`
|
|
100
|
-
| `zoomable` / `showTooltip` | `boolean`
|
|
101
|
-
| `pannable` | `boolean`
|
|
102
|
-
| `panXDomain` | `[number, number]`
|
|
103
|
-
| `minZoomSpan` | `number`
|
|
104
|
-
| `integerZoom` | `boolean`
|
|
105
|
-
| `minVisiblePoints` | `number`
|
|
106
|
-
| `maxZoomScale` | `number \| null`
|
|
107
|
-
| `initialXDomain` | `[number, number]`
|
|
108
|
-
| `initialXDomains` | `Record<string, [number, number]>`
|
|
109
|
-
| `xDomainStrategy` | `WaveformXDomainStrategy`
|
|
110
|
-
| `yDomain` | `[number, number]`
|
|
111
|
-
| `yDomains` | `Record<string, [number, number]>`
|
|
112
|
-
| `grid` | `WaveformGridOptions`
|
|
113
|
-
| `axes` | `WaveformAxesOptions`
|
|
114
|
-
| `rendering` | `WaveformRenderingOptions`
|
|
115
|
-
| `plotMargin` | `WaveformPlotMargin`
|
|
116
|
-
| `title` / `frameStyle` | 对应公开类型
|
|
117
|
-
| `legend` | `WaveformLegendOptions`
|
|
118
|
-
| `frameNumber` | `string \| number`
|
|
119
|
-
| `frameNumbers` | `Record<string, string \| number>`
|
|
120
|
-
| `zeroLine` | `WaveformZeroLineOptions`
|
|
121
|
-
| `cleanView` | `boolean`
|
|
122
|
-
| `presentationMode` | `boolean`
|
|
123
|
-
| `annotations` | `WaveformAnnotation[]`
|
|
124
|
-
| `annotationsVisible` | `boolean`
|
|
125
|
-
| `interactionMode` | `'zoom' \| 'annotation'`
|
|
126
|
-
| `hiddenSeriesIds` | `string[]`
|
|
127
|
-
| `defaultHiddenSeriesIds` | `string[]`
|
|
89
|
+
| Prop | 类型 | 默认值 | 说明 |
|
|
90
|
+
| -------------------------- | --------------------------------------------------------------- | ------------------------------------------------------------------------------------- | --------------------------------------------- |
|
|
91
|
+
| `data` | `WaveformData` | 必填 | 波形数据 |
|
|
92
|
+
| `displayMode` | `'independent' \| 'separated' \| 'compact'` | `'independent'` | 图框布局 |
|
|
93
|
+
| `overlayMode` | `'single-axis' \| 'multi-axis'` | `'single-axis'` | 叠加曲线的 Y 轴模式 |
|
|
94
|
+
| `layoutPreset` | `'default' \| 'edge-compact'` | `'default'` | 标题贴边、时间标签与响应式分页布局 |
|
|
95
|
+
| `unitDisplayMode` | `'axis' \| 'legend-single-series' \| 'channel-label-or-legend'` | `'axis'` | 可选的图表级单位展示规则 |
|
|
96
|
+
| `timeUnit` | `'s' \| 'ms'` | `'ms'` | 坐标轴和 tooltip 展示单位 |
|
|
97
|
+
| `xLabel` / `yLabel` | `string` | `时间（timeUnit）` / `'幅值'` | 坐标轴名称 |
|
|
98
|
+
| `lineColor` | `string` | `'#0960bd'` | 单波形默认颜色 |
|
|
99
|
+
| `width` / `height` | `number` | 自适应 | 组件总尺寸，单位为 CSS 像素 |
|
|
100
|
+
| `zoomable` / `showTooltip` | `boolean` | `true` / `true` | 缩放和数值 tooltip 开关 |
|
|
101
|
+
| `pannable` | `boolean` | `false` | 空格拖拽平移开关 |
|
|
102
|
+
| `panXDomain` | `[number, number]` | 未设置 | 远端横向平移边界，使用秒坐标 |
|
|
103
|
+
| `minZoomSpan` | `number` | 未设置 | 最小缩放跨度，使用原始 X 数据单位 |
|
|
104
|
+
| `integerZoom` | `boolean` | `false` | 缩放范围按 X 轴显示单位对齐整数 |
|
|
105
|
+
| `minVisiblePoints` | `number` | `0` | 缩放后至少保留的不同 X 坐标数 |
|
|
106
|
+
| `maxZoomScale` | `number \| null` | 未设置 | 最大缩放倍数；`null` 表示不限制 |
|
|
107
|
+
| `initialXDomain` | `[number, number]` | 未设置 | 所有图框的初始 X 范围（可超出数据，空白显示） |
|
|
108
|
+
| `initialXDomains` | `Record<string, [number, number]>` | 未设置 | 按 track/series ID 配置初始范围（可超出数据） |
|
|
109
|
+
| `xDomainStrategy` | `WaveformXDomainStrategy` | `{ type: 'integer-ms' }` | 自动 X 轴视口范围策略 |
|
|
110
|
+
| `yDomain` | `[number, number]` | 未设置 | 所有波形的固定 Y 轴范围 |
|
|
111
|
+
| `yDomains` | `Record<string, [number, number]>` | 未设置 | 按 track/series ID 配置固定范围 |
|
|
112
|
+
| `grid` | `WaveformGridOptions` | `{ rowCount: 2, columnCount: 1, showPagination: true, fillIncompleteLastRow: false }` | 网格和分页 |
|
|
113
|
+
| `axes` | `WaveformAxesOptions` | 轴线均显示 | X/Y 轴基线、Y 轴分割数与 X 轴 label 格式化 |
|
|
114
|
+
| `rendering` | `WaveformRenderingOptions` | `{}` | 降采样与点/误差棒间距 |
|
|
115
|
+
| `plotMargin` | `WaveformPlotMargin` | `{ top: 18, bottom: 52 }` | 绘图区上下边距，单位为 CSS 像素 |
|
|
116
|
+
| `title` / `frameStyle` | 对应公开类型 | 未设置 | 标题和图框样式 |
|
|
117
|
+
| `legend` | `WaveformLegendOptions` | `{ position: 'top-right', orientation: 'auto' }` | 图例位置、排列、背景和交互 |
|
|
118
|
+
| `frameNumber` | `string \| number` | 未设置 | 图框水印内容 |
|
|
119
|
+
| `frameNumbers` | `Record<string, string \| number>` | 未设置 | 按 `trackId` 覆盖图框水印内容 |
|
|
120
|
+
| `zeroLine` | `WaveformZeroLineOptions` | `{ visible: true }` | 零值参考线显隐与样式 |
|
|
121
|
+
| `cleanView` | `boolean` | `false` | 保留波形、图框和刻度的净图模式 |
|
|
122
|
+
| `presentationMode` | `boolean` | `false` | 禁用绘图区交互的展示模式 |
|
|
123
|
+
| `annotations` | `WaveformAnnotation[]` | `[]` | 受控标注数据 |
|
|
124
|
+
| `annotationsVisible` | `boolean` | `true` | 标注图层显隐 |
|
|
125
|
+
| `interactionMode` | `'zoom' \| 'annotation'` | `'zoom'` | 左键交互模式 |
|
|
126
|
+
| `hiddenSeriesIds` | `string[]` | 未设置 | 受控隐藏系列 ID |
|
|
127
|
+
| `defaultHiddenSeriesIds` | `string[]` | `[]` | 非受控模式的初始隐藏系列 |
|
|
128
128
|
|
|
129
129
|
所有公开类型均可从包入口导入，例如 `WaveformData`、`WaveformSeries`、`TypedSampleData`、
|
|
130
130
|
`TypedPointData`、`WaveformAnnotation`、`WaveformLineStyle`、`WaveformRenderingOptions`、
|
|
@@ -462,12 +462,14 @@ Tooltip 每个系列按 `炮号：通道 (x:值 y:值)` 格式显示。`Wavefor
|
|
|
462
462
|
<WaveformChart :data="waveformData" unit-display-mode="legend-single-series" />
|
|
463
463
|
```
|
|
464
464
|
|
|
465
|
-
公共类型 `WaveformUnitDisplayMode = 'axis' | 'legend-single-series'`，也可通过
|
|
465
|
+
公共类型 `WaveformUnitDisplayMode = 'axis' | 'legend-single-series' | 'channel-label-or-legend'`，也可通过
|
|
466
466
|
`WaveformChartProps.unitDisplayMode` 配置。默认 `'axis'` 保持现有行为（单位在 Y 轴最高
|
|
467
|
-
|
|
467
|
+
刻度中，单曲线图框不显示图例）。通常仅在图框包含至少两条曲线时显示图例；
|
|
468
|
+
`channel-label-or-legend` 模式下，当前页统一隐藏左侧通道名称时，单曲线图框也显示图例。
|
|
469
|
+
曲线数量依据完整 series 列表，隐藏曲线仍计数，便于重新显示。以下为客户单位规则：
|
|
468
470
|
|
|
469
|
-
- 整个图表的所有非空 track
|
|
470
|
-
|
|
471
|
+
- 整个图表的所有非空 track 都只有一条曲线时，不展示图例；单位去除两端空白，缺失、
|
|
472
|
+
空白或占位值 `--` 不追加括号。
|
|
471
473
|
- 任一 track 包含多条曲线时，整个图表的图例只显示原始名称，所有 Y 轴也隐藏单位。
|
|
472
474
|
判定依据是曲线数量，而非 Y 轴分组数量，同单位共用一根轴的多曲线图框同样适用。
|
|
473
475
|
- 判定使用分页前完整的 track 曲线列表，跨页一致；`grid.trackOrder` 的空图框和补齐
|
|
@@ -507,14 +509,17 @@ const chartData = {
|
|
|
507
509
|
|
|
508
510
|
当 Y 轴使用科学计数法时，顶部刻度格式为 `E+03 (V) 3`；未使用科学计数法时，格式为
|
|
509
511
|
`(V) 3`。单位为空、全为空白或未配置时，不显示 `(单位)`，例如仍显示为 `E+03 3` 或 `3`。
|
|
512
|
+
多值轴模式的右侧 Y 轴将指数和单位放在数值右侧，例如 `3 E+03 (V)`；不使用科学计数法时显示为 `3 (V)`。
|
|
510
513
|
多 Y 轴模式下，每根轴使用该轴首个 series 的单位。
|
|
511
514
|
|
|
512
|
-
左侧通道名称使用
|
|
515
|
+
左侧通道名称使用 12px、字重 600 的加粗文字。默认布局按字符宽度估算旋转名称的垂直范围，
|
|
513
516
|
仅对可能与名称相交的刻度文字（含文字高度和安全间距）自动计算间距；不相交的顶部单位
|
|
514
517
|
刻度不会推远名称。同一列中相同轴位使用逐道计算的最大间距，保证多道名称垂直对齐。
|
|
518
|
+
图框高度不足 80px 时也不会隔道隐藏名称；例如 5×1 布局中，每个符合名称展示规则的图框
|
|
519
|
+
仍显示完整通道名称，允许长名称互相重叠。净图模式及单位展示模式的显隐规则仍然生效。
|
|
515
520
|
|
|
516
521
|
`edge-compact` 按 11px/700 sans-serif 实测 Y 刻度文字宽度、7px 刻度间距和 20px 名称带计算
|
|
517
|
-
|
|
522
|
+
轴槽位、名称位置及左边距；隐藏的单位不参与宽度估算，科学计数法倍率保留在顶部刻度，但不参与刻度宽度、名称位置和左侧留白计算。
|
|
518
523
|
最外侧名称带左边保留 6px 外部留白，为单轴图框右侧 24px 留白的四分之一，不再使用
|
|
519
524
|
默认布局的固定 48px 最小左边距。多轴使用各轴位的最大刻度宽度，多列同时预留相邻
|
|
520
525
|
图框的轴和名称带，避免名称、长刻度及相邻图框重叠。默认布局的留白策略保持兼容。
|
|
@@ -572,6 +577,9 @@ const series = {
|
|
|
572
577
|
`separated` 或 `compact` 控制图框布局和 X 轴共享方式；未共享 `trackId` 的单曲线
|
|
573
578
|
图框不会因为切换叠加方式而改变。
|
|
574
579
|
|
|
580
|
+
`compact` 多道紧密模式会显示每一道 Y 轴的最高刻度；顶部和底部刻度文字分别向本道
|
|
581
|
+
内部对齐，避免相邻道在公共边界上的刻度文字重叠。
|
|
582
|
+
|
|
575
583
|
### 绘图区域尺寸
|
|
576
584
|
|
|
577
585
|
`width` 和 `height` 接收像素数值，并且可以独立设置。指定的维度使用固定尺寸，未指定的
|
|
@@ -619,7 +627,10 @@ const series = {
|
|
|
619
627
|
|
|
620
628
|
对应的公开类型为 `WaveformTitleOptions` 和 `WaveformTitleTextStyle`。未传 `title`、
|
|
621
629
|
`visible` 为 `false`，或 `text` 去除首尾空格后为空时，标题不渲染且不占高度。标题默认
|
|
622
|
-
居中、字号 `14px`、颜色 `#1f2937
|
|
630
|
+
居中、字号 `14px`、颜色 `#1f2937`、微软雅黑、常规字重且不旋转。居中标题和 X 轴标题均
|
|
631
|
+
对齐绘图区图框的水平中心（左侧绘图边距 + 绘图区宽度 / 2），随 Y 轴留白及容器尺寸变化
|
|
632
|
+
同步调整；适用于默认、紧凑和边缘轴布局。显式左对齐贴齐绘图区左边，右对齐保留原有标题区域。
|
|
633
|
+
标题区域高度按文字及旋转角度
|
|
623
634
|
在 `44px` 至 `160px` 之间计算；超长文字会省略，悬浮可查看完整内容。
|
|
624
635
|
|
|
625
636
|
`width` 和 `height` 始终表示组件总尺寸。标题显示后会从总高度中扣除标题区域，剩余高度
|
|
@@ -650,9 +661,13 @@ Demo 左侧控制面板提供标题实时预览，可配置标题名称、显隐
|
|
|
650
661
|
对应的公开类型为 `WaveformFrameStyle`。默认边框颜色为 `#1f2937`、线宽为 `1`、线型为
|
|
651
662
|
`solid`，背景透明。`borderWidth` 为 `0` 时隐藏边框；非有限值或负数会回退到默认线宽。
|
|
652
663
|
|
|
664
|
+
多道紧凑模式中，同列、等宽且相接的非空图框共用一条水平分隔线：下方图框省略顶边，
|
|
665
|
+
由上方图框的底边绘制，避免交界处出现双倍线宽。单图框、空槽位后的图框及不同宽度的图框保留完整边框。
|
|
666
|
+
|
|
653
667
|
### 图例与曲线显隐
|
|
654
668
|
|
|
655
669
|
每个图框独立管理自己的图例：图框内有两条或更多曲线时显示图例，只有一条曲线时不显示。
|
|
670
|
+
在 `channel-label-or-legend` 模式下，若当前页统一隐藏左侧通道名称，单曲线图框也显示图例。
|
|
656
671
|
`legend.backgroundColor` 设置图例的背景颜色。该字段接受任意有效 CSS 颜色值，
|
|
657
672
|
可通过 `rgba(...)` 或 `hsla(...)` 中的 alpha 通道调整透明度：
|
|
658
673
|
|
|
@@ -684,11 +699,14 @@ const hiddenSeriesIds = ref<string[]>([])
|
|
|
684
699
|
`legend.position`，两者都未配置时使用 `top-right`。当 `orientation` 为 `auto` 时，每个图框
|
|
685
700
|
会根据最终位置独立选择排列方向：`top`、`bottom` 为水平排列，其余位置为垂直排列。
|
|
686
701
|
|
|
687
|
-
|
|
702
|
+
未配置或传入空字符串时，图例背景默认透明（`transparent`），文字字号为 `11px`，
|
|
703
|
+
字体为 `Times New Roman`（回退到 `serif`）；组件原生 tooltip 同样使用该字体，字号为 `11px`，与 X、Y 轴刻度一致。
|
|
704
|
+
仍可通过 `legend.backgroundColor` 指定其他背景颜色。
|
|
688
705
|
`legend.interactive` 默认为 `false`；开启后可以单击或使用键盘操作图例项切换曲线显隐。
|
|
689
706
|
调用方可通过 `hiddenSeriesIds` 和 `update:hidden-series-ids` 控制状态，也可使用
|
|
690
707
|
`defaultHiddenSeriesIds` 设置非受控模式的初始隐藏项。隐藏状态同步作用于坐标轴、tooltip、
|
|
691
|
-
|
|
708
|
+
悬浮点和标注交互；允许隐藏全部曲线，并可通过保留的图例恢复显示。图框内全部曲线隐藏时，
|
|
709
|
+
仍按该图框的完整数据保留 X/Y 轴刻度值及已启用的网格，显式配置的坐标范围仍然生效。
|
|
692
710
|
|
|
693
711
|
显隐状态以规范化后的 `series.id` 为键。要在数据刷新和重新排序后稳定保留状态，每个系列都应
|
|
694
712
|
提供全图唯一且稳定的显式 `id`；自动生成的索引 ID 或重复 ID 添加的后缀不保证跨排序稳定。
|
|
@@ -964,7 +982,7 @@ async function importAnnotationFile(file: File) {
|
|
|
964
982
|
字段无效时会抛出 `TypeError`，不会返回部分结果。导入包含未知 `seriesId` 的标注是允许的，
|
|
965
983
|
对应曲线加载后会恢复显示。文件选择、错误提示和下载由业务层实现。
|
|
966
984
|
|
|
967
|
-
X 轴刻度和左右端点先按 `timeUnit` 转换为秒或毫秒，再显示为不带分组符和科学计数法的完整普通十进制值，并可通过 `axes.x.labelFormatter` 自定义。Y
|
|
985
|
+
X 轴刻度和左右端点先按 `timeUnit` 转换为秒或毫秒，再显示为不带分组符和科学计数法的完整普通十进制值，并可通过 `axes.x.labelFormatter` 自定义。Y 轴根据完整显示域的最大绝对值选择格式：大于等于 `10³`，或大于 `0` 且小于等于 `10⁻³` 时，自动使用科学计数法，并在顶部刻度显示共享倍率 `E±NN`，倍率不参与左侧留白与通道名称定位；其他范围使用普通数字，零值不触发科学计数法。Y 轴标签先保留五位有效数字，再本地化为最多四位小数。如果 series 配置了 `unit`，顶部刻度会在倍率后追加 `(单位)`；没有科学计数法时也会显示 `(单位)`，多 Y 轴分别使用对应轴首个 series 的单位。tooltip 使用最多 4 位小数的本地化普通数字并省略无意义尾零；标注编辑器的 X 坐标跟随 `timeUnit` 并固定 3 位小数，Y 坐标显示完整普通十进制。所有格式化都只发生在展示层，内部坐标值保持原始精度。
|
|
968
986
|
标注框默认布局在采样点正上方，只做绘图区边界裁剪；文本框通过连接箭头指向标注位置，多个标注重叠时可通过拖动手动避让。
|
|
969
987
|
|
|
970
988
|
## 事件
|
|
@@ -1065,3 +1083,18 @@ ESLint 的 Vue SFC、TypeScript ESLint 和 `max-lines` 规则；`pnpm lint:all`
|
|
|
1065
1083
|
|
|
1066
1084
|
`pnpm build` 同时生成 `dist/` 组件库产物和 `dist-demo/` 演示应用。正式公开入口为
|
|
1067
1085
|
`src/index.ts`，样式入口为 `src/styles.css`；`dist/` 和 `dist-demo/` 均为生成目录，不要手工编辑。
|
|
1086
|
+
|
|
1087
|
+
### 通道名称与交互图例
|
|
1088
|
+
|
|
1089
|
+
`unit-display-mode="channel-label-or-legend"` 在左侧统一隐藏通道名称时，为每个非空图框
|
|
1090
|
+
显示带单位的图例，包括只有一条通道曲线的图框。
|
|
1091
|
+
当前页所有图框均为单曲线时，左侧名称显示为 `SX2_7_01(V)`；当前页任一图框
|
|
1092
|
+
包含两条及以上曲线时，整页隐藏左侧通道名称及多轴通道标题，保留坐标刻度。
|
|
1093
|
+
当前页均为单曲线时，名称显示在左侧，图框不显示图例。
|
|
1094
|
+
判断使用当前页原始曲线数量，隐藏曲线仍计数，其他页不会影响当前页。
|
|
1095
|
+
单位去除首尾空白；缺失、空白或 `--` 时只显示名称。原始数据及 ID 保持不变。
|
|
1096
|
+
图例显示为 `SX2_7_01 (V)`，设置 `:legend="{ interactive: true }"` 可点击显隐。
|
|
1097
|
+
隐藏后保留图例条目，可全部隐藏后恢复；`cleanView` 隐藏名称和图例。
|
|
1098
|
+
显隐状态可通过 `hiddenSeriesIds` 及 `update:hidden-series-ids` 控制；未传入时使用
|
|
1099
|
+
组件内部状态，持久化仍由宿主应用负责。已有两种单位展示模式保留各自的单位规则，
|
|
1100
|
+
但单曲线图框统一不显示图例；多曲线图框仍保留可交互的图例条目。
|