refactor(demo): load waveform fixtures from JSON

src/App.vue

@@ -17,51 +17,29 @@ import {
   type WaveformSeries,
   type WaveformTitleOptions,
 } from './components'
-import waveformJson from './data/wData.json'
+import chartWaveformsJson from './data/chartWaveforms.json'
+import demoWaveformsJson from './data/demoWaveforms.json'
+
+interface WaveformSourcePoint {
+  x: number
+  y: number
+  error?: number
+  lowerError?: number
+  upperError?: number
+}
 
 interface WaveformSourceRow {
   chnl: string
   chnl_id: number
   dat_unit: string
-  data: number[]
+  data: WaveformSourcePoint[]
   dev: number
   shot: number
-  time: number[]
+  time?: number[]
   time_unit: 'ms'
 }
 
-const importedSourceRows = waveformJson as unknown as WaveformSourceRow[]
+const sourceRows = chartWaveformsJson as unknown as WaveformSourceRow[]
-const testChannelRows: WaveformSourceRow[] = importedSourceRows.slice(0, 2).map((row, index) => ({
-  ...row,
-  chnl: `TEST_CH_${index + 1}`,
-  chnl_id: 9001 + index,
-  data: row.data.map(
-    (value, sampleIndex) =>
-      value * (index === 0 ? 0.72 : 1.12) +
-      Math.sin(sampleIndex / (index === 0 ? 11 : 18)) * (index === 0 ? 0.015 : 0.01),
-  ),
-}))
-const additionalFrameOneRows: WaveformSourceRow[] = [
-  importedSourceRows[0],
-  importedSourceRows[1],
-  importedSourceRows[0],
-].flatMap((row, index) =>
-  row
-    ? [
-        {
-          ...row,
-          chnl: `TEST_CH_${index + 3}`,
-          chnl_id: 9003 + index,
-          data: row.data.map(
-            (value, sampleIndex) =>
-              value * [0.9, 1.35, 0.55][index]! +
-              Math.sin(sampleIndex / [14, 22, 8][index]!) * [0.012, 0.008, 0.02][index]!,
-          ),
-        },
-      ]
-    : [],
-)
-const sourceRows = [...importedSourceRows, ...testChannelRows, ...additionalFrameOneRows]
 const displayMode = ref<WaveformDisplayMode>('independent')
 const overlayMode = ref<WaveformOverlayMode>('single-axis')
 const rowCount = ref(2)
@@ -138,7 +116,6 @@ const seriesStylePresets: Array<Pick<WaveformSeries, 'lineType' | 'pointType' |
 ]
 
 const waveformSeries: WaveformSeries[] = sourceRows.map((row, seriesIndex) => {
-  const pointCount = Math.min(row.time.length, row.data.length)
   const presetStyle = seriesStylePresets[seriesIndex % seriesStylePresets.length]!
   const style: Pick<WaveformSeries, 'lineType' | 'pointType' | 'errorBar'> =
     row.chnl === 'TEST_CH_4'
@@ -148,55 +125,37 @@ const waveformSeries: WaveformSeries[] = sourceRows.map((row, seriesIndex) => {
     id: String(row.chnl_id),
     trackId:
       row.chnl.startsWith('TEST_CH_') && row.chnl !== 'TEST_CH_2'
-        ? String(importedSourceRows[0]?.chnl_id ?? row.chnl_id)
+        ? String(sourceRows[0]?.chnl_id ?? row.chnl_id)
         : undefined,
     name: row.chnl,
     unit: row.dat_unit,
     ...style,
     data: {
       kind: 'points',
-      points: Array.from({ length: pointCount }, (_, index) => {
+      points: row.data,
-        const y = row.data[index]
-        const error = Math.max(Math.abs(y) * 0.08, 0.005)
-        return {
-          x: row.time[index] / 1000,
-          y,
-          ...(style.errorBar?.visible
-            ? seriesIndex % 2 === 0
-              ? { lowerError: error * 0.65, upperError: error }
-              : { error }
-            : {}),
-        }
-      }),
     },
   }
 })
 
-const stepDemoValues = [
+const demoWaveforms = demoWaveformsJson as {
-  {
+  stepDemoValues: Array<{
-    id: 'step-demo-start',
+    id: string
-    name: 'Step Start',
+    name: string
-    color: '#5470c6',
+    color: string
-    lineType: 'step-start',
+    lineType: 'step-start' | 'step-middle' | 'step-end'
-    values: [120, 132, 101, 134, 90, 230, 210],
+    values: number[]
-  },
+  }>
-  {
+  basicCurveDemoSeries: Array<{
-    id: 'step-demo-middle',
+    id: string
-    name: 'Step Middle',
+    name: string
-    color: '#91cc75',
+    color: string
-    lineType: 'step-middle',
+    lineType: 'none' | 'linear'
-    values: [220, 282, 201, 234, 290, 430, 410],
+    pointType: 'circle' | 'none'
-  },
+    points: Array<{ x: number; y: number }>
-  {
+  }>
-    id: 'step-demo-end',
+}
-    name: 'Step End',
-    color: '#505372',
-    lineType: 'step-end',
-    values: [450, 432, 401, 454, 590, 530, 510],
-  },
-] as const
 
-const stepDemoSeries: WaveformSeries[] = stepDemoValues.map((series) => ({
+const stepDemoSeries: WaveformSeries[] = demoWaveforms.stepDemoValues.map((series) => ({
   id: series.id,
   trackId: 'step-demo',
   name: series.name,
@@ -209,42 +168,16 @@ const stepDemoSeries: WaveformSeries[] = stepDemoValues.map((series) => ({
   },
 }))
 
-const frameOneTrackId = String(importedSourceRows[0]?.chnl_id ?? 'frame-one')
+const frameOneTrackId = String(sourceRows[0]?.chnl_id ?? 'frame-one')
-const frameOneDemoSource = importedSourceRows[0]
+const basicCurveDemoSeries: WaveformSeries[] = demoWaveforms.basicCurveDemoSeries.map((series) => ({
-const basicCurveDemoSeries: WaveformSeries[] = frameOneDemoSource
+  id: series.id,
-  ? [
-      {
-        id: 'basic-points-only-demo',
   trackId: frameOneTrackId,
-        name: '纯点无线',
+  name: series.name,
-        color: '#d4380d',
+  color: series.color,
-        lineType: 'none',
+  lineType: series.lineType,
-        pointType: 'circle',
+  pointType: series.pointType,
-        data: {
+  data: { kind: 'points', points: series.points },
-          kind: 'points',
+}))
-          points: frameOneDemoSource.data.map((value, index) => ({
-            x: frameOneDemoSource.time[index]! / 1000,
-            y: value * 1.18 + Math.sin(index / 12) * 0.006,
-          })),
-        },
-      },
-      {
-        id: 'basic-line-only-demo',
-        trackId: frameOneTrackId,
-        name: '纯线无点',
-        color: '#00796b',
-        lineType: 'linear',
-        pointType: 'none',
-        data: {
-          kind: 'points',
-          points: frameOneDemoSource.data.map((value, index) => ({
-            x: frameOneDemoSource.time[index]! / 1000,
-            y: value * 0.82 - Math.sin(index / 16) * 0.006,
-          })),
-        },
-      },
-    ]
-  : []
 const frameOneSeries = waveformSeries.filter(
   (series) => series.id === frameOneTrackId || series.trackId === frameOneTrackId,
 )