feat: 支持修改单位
This commit is contained in:
		@@ -14,6 +14,7 @@
 | 
			
		||||
import { computed, withDefaults } from "vue";
 | 
			
		||||
import { forEach } from "lodash";
 | 
			
		||||
import VChart from "vue-echarts";
 | 
			
		||||
import { type WaveformDataType } from "./index";
 | 
			
		||||
 | 
			
		||||
// Echarts
 | 
			
		||||
import { use } from "echarts/core";
 | 
			
		||||
@@ -61,15 +62,14 @@ type EChartsOption = ComposeOption<
 | 
			
		||||
 | 
			
		||||
const props = withDefaults(
 | 
			
		||||
  defineProps<{
 | 
			
		||||
    data?: {
 | 
			
		||||
      x: number[];
 | 
			
		||||
      y: number[][];
 | 
			
		||||
    };
 | 
			
		||||
    data?: WaveformDataType;
 | 
			
		||||
  }>(),
 | 
			
		||||
  {
 | 
			
		||||
    data: () => ({
 | 
			
		||||
      x: [],
 | 
			
		||||
      y: [],
 | 
			
		||||
      xUnit: "s",
 | 
			
		||||
      yUnit: "V",
 | 
			
		||||
    }),
 | 
			
		||||
  },
 | 
			
		||||
);
 | 
			
		||||
@@ -114,9 +114,9 @@ const option = computed((): EChartsOption => {
 | 
			
		||||
    tooltip: {
 | 
			
		||||
      trigger: "axis",
 | 
			
		||||
      formatter: (params: any) => {
 | 
			
		||||
        let result = `时间: ${params[0].data[0].toFixed(2)} ms<br/>`;
 | 
			
		||||
        let result = `时间: ${params[0].data[0].toFixed(2)} ${props.data.xUnit}<br/>`;
 | 
			
		||||
        params.forEach((param: any) => {
 | 
			
		||||
          result += `${param.seriesName}: ${param.data[1].toFixed(3)} V<br/>`;
 | 
			
		||||
          result += `${param.seriesName}: ${param.data[1].toFixed(3)} ${props.data.yUnit}<br/>`;
 | 
			
		||||
        });
 | 
			
		||||
        return result;
 | 
			
		||||
      },
 | 
			
		||||
@@ -144,7 +144,7 @@ const option = computed((): EChartsOption => {
 | 
			
		||||
    ],
 | 
			
		||||
    xAxis: {
 | 
			
		||||
      type: "value",
 | 
			
		||||
      name: "时间 (ms)",
 | 
			
		||||
      name: `时间 (${props.data.xUnit})`,
 | 
			
		||||
      nameLocation: "middle",
 | 
			
		||||
      nameGap: 30,
 | 
			
		||||
      axisLine: {
 | 
			
		||||
@@ -153,10 +153,13 @@ const option = computed((): EChartsOption => {
 | 
			
		||||
      axisTick: {
 | 
			
		||||
        show: true,
 | 
			
		||||
      },
 | 
			
		||||
      splitLine: {
 | 
			
		||||
        show: false,
 | 
			
		||||
      },
 | 
			
		||||
    },
 | 
			
		||||
    yAxis: {
 | 
			
		||||
      type: "value",
 | 
			
		||||
      name: "电压 (V)",
 | 
			
		||||
      name: `电压 (${props.data.yUnit})`,
 | 
			
		||||
      nameLocation: "middle",
 | 
			
		||||
      nameGap: 40,
 | 
			
		||||
      axisLine: {
 | 
			
		||||
@@ -165,6 +168,9 @@ const option = computed((): EChartsOption => {
 | 
			
		||||
      axisTick: {
 | 
			
		||||
        show: true,
 | 
			
		||||
      },
 | 
			
		||||
      splitLine: {
 | 
			
		||||
        show: false,
 | 
			
		||||
      },
 | 
			
		||||
    },
 | 
			
		||||
    series: series,
 | 
			
		||||
  };
 | 
			
		||||
 
 | 
			
		||||
@@ -1,26 +1,42 @@
 | 
			
		||||
import WaveformDisplay from "./WaveformDisplay.vue";
 | 
			
		||||
 | 
			
		||||
// Test data generator
 | 
			
		||||
const generateTestData = () => {
 | 
			
		||||
    const sampleRate = 1000; // 1kHz
 | 
			
		||||
    const duration = 0.1; // 10ms
 | 
			
		||||
    const points = Math.floor(sampleRate * duration);
 | 
			
		||||
    
 | 
			
		||||
    const x = Array.from({ length: points }, (_, i) => i / sampleRate * 1000); // time in ms
 | 
			
		||||
    
 | 
			
		||||
    // Generate multiple channels with different waveforms
 | 
			
		||||
    const y = [
 | 
			
		||||
        // Channel 1: Sine wave 50Hz
 | 
			
		||||
        Array.from({ length: points }, (_, i) => Math.sin(2 * Math.PI * 50 * i / sampleRate) * 3.3),
 | 
			
		||||
        // Channel 2: Square wave 25Hz
 | 
			
		||||
        Array.from({ length: points }, (_, i) => Math.sign(Math.sin(2 * Math.PI * 25 * i / sampleRate)) * 5),
 | 
			
		||||
        // Channel 3: Sawtooth wave 33Hz
 | 
			
		||||
        Array.from({ length: points }, (_, i) => (2 * ((33 * i / sampleRate) % 1) - 1) * 2.5),
 | 
			
		||||
        // Channel 4: Noise + DC offset
 | 
			
		||||
        Array.from({ length: points }, () => Math.random() * 0.5 + 1.5)
 | 
			
		||||
    ];
 | 
			
		||||
    
 | 
			
		||||
    return { x, y };
 | 
			
		||||
type WaveformDataType = {
 | 
			
		||||
  x: number[];
 | 
			
		||||
  y: number[][];
 | 
			
		||||
  xUnit: "s" | "ms" | "us";
 | 
			
		||||
  yUnit: "V" | "mV" | "uV";
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
export { WaveformDisplay, generateTestData };
 | 
			
		||||
// Test data generator
 | 
			
		||||
function generateTestData(): WaveformDataType {
 | 
			
		||||
  const sampleRate = 1000; // 1kHz
 | 
			
		||||
  const duration = 0.1; // 10ms
 | 
			
		||||
  const points = Math.floor(sampleRate * duration);
 | 
			
		||||
 | 
			
		||||
  const x = Array.from({ length: points }, (_, i) => (i / sampleRate) * 1000); // time in ms
 | 
			
		||||
 | 
			
		||||
  // Generate multiple channels with different waveforms
 | 
			
		||||
  const y = [
 | 
			
		||||
    // Channel 1: Sine wave 50Hz
 | 
			
		||||
    Array.from(
 | 
			
		||||
      { length: points },
 | 
			
		||||
      (_, i) => Math.sin((2 * Math.PI * 50 * i) / sampleRate) * 3.3,
 | 
			
		||||
    ),
 | 
			
		||||
    // Channel 2: Square wave 25Hz
 | 
			
		||||
    Array.from(
 | 
			
		||||
      { length: points },
 | 
			
		||||
      (_, i) => Math.sign(Math.sin((2 * Math.PI * 25 * i) / sampleRate)) * 5,
 | 
			
		||||
    ),
 | 
			
		||||
    // Channel 3: Sawtooth wave 33Hz
 | 
			
		||||
    Array.from(
 | 
			
		||||
      { length: points },
 | 
			
		||||
      (_, i) => (2 * (((33 * i) / sampleRate) % 1) - 1) * 2.5,
 | 
			
		||||
    ),
 | 
			
		||||
    // Channel 4: Noise + DC offset
 | 
			
		||||
    Array.from({ length: points }, () => Math.random() * 0.5 + 1.5),
 | 
			
		||||
  ];
 | 
			
		||||
 | 
			
		||||
  return { x, y, xUnit: "ms", yUnit: "V" };
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
export { WaveformDisplay, generateTestData , type WaveformDataType };
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user