feat: 支持修改单位
This commit is contained in:
parent
a9ab5926ed
commit
da7b3f4a4b
|
@ -14,6 +14,7 @@
|
||||||
import { computed, withDefaults } from "vue";
|
import { computed, withDefaults } from "vue";
|
||||||
import { forEach } from "lodash";
|
import { forEach } from "lodash";
|
||||||
import VChart from "vue-echarts";
|
import VChart from "vue-echarts";
|
||||||
|
import { type WaveformDataType } from "./index";
|
||||||
|
|
||||||
// Echarts
|
// Echarts
|
||||||
import { use } from "echarts/core";
|
import { use } from "echarts/core";
|
||||||
|
@ -61,15 +62,14 @@ type EChartsOption = ComposeOption<
|
||||||
|
|
||||||
const props = withDefaults(
|
const props = withDefaults(
|
||||||
defineProps<{
|
defineProps<{
|
||||||
data?: {
|
data?: WaveformDataType;
|
||||||
x: number[];
|
|
||||||
y: number[][];
|
|
||||||
};
|
|
||||||
}>(),
|
}>(),
|
||||||
{
|
{
|
||||||
data: () => ({
|
data: () => ({
|
||||||
x: [],
|
x: [],
|
||||||
y: [],
|
y: [],
|
||||||
|
xUnit: "s",
|
||||||
|
yUnit: "V",
|
||||||
}),
|
}),
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
@ -114,9 +114,9 @@ const option = computed((): EChartsOption => {
|
||||||
tooltip: {
|
tooltip: {
|
||||||
trigger: "axis",
|
trigger: "axis",
|
||||||
formatter: (params: any) => {
|
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) => {
|
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;
|
return result;
|
||||||
},
|
},
|
||||||
|
@ -144,7 +144,7 @@ const option = computed((): EChartsOption => {
|
||||||
],
|
],
|
||||||
xAxis: {
|
xAxis: {
|
||||||
type: "value",
|
type: "value",
|
||||||
name: "时间 (ms)",
|
name: `时间 (${props.data.xUnit})`,
|
||||||
nameLocation: "middle",
|
nameLocation: "middle",
|
||||||
nameGap: 30,
|
nameGap: 30,
|
||||||
axisLine: {
|
axisLine: {
|
||||||
|
@ -153,10 +153,13 @@ const option = computed((): EChartsOption => {
|
||||||
axisTick: {
|
axisTick: {
|
||||||
show: true,
|
show: true,
|
||||||
},
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
yAxis: {
|
yAxis: {
|
||||||
type: "value",
|
type: "value",
|
||||||
name: "电压 (V)",
|
name: `电压 (${props.data.yUnit})`,
|
||||||
nameLocation: "middle",
|
nameLocation: "middle",
|
||||||
nameGap: 40,
|
nameGap: 40,
|
||||||
axisLine: {
|
axisLine: {
|
||||||
|
@ -165,6 +168,9 @@ const option = computed((): EChartsOption => {
|
||||||
axisTick: {
|
axisTick: {
|
||||||
show: true,
|
show: true,
|
||||||
},
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
series: series,
|
series: series,
|
||||||
};
|
};
|
||||||
|
|
|
@ -1,26 +1,42 @@
|
||||||
import WaveformDisplay from "./WaveformDisplay.vue";
|
import WaveformDisplay from "./WaveformDisplay.vue";
|
||||||
|
|
||||||
// Test data generator
|
type WaveformDataType = {
|
||||||
const generateTestData = () => {
|
x: number[];
|
||||||
const sampleRate = 1000; // 1kHz
|
y: number[][];
|
||||||
const duration = 0.1; // 10ms
|
xUnit: "s" | "ms" | "us";
|
||||||
const points = Math.floor(sampleRate * duration);
|
yUnit: "V" | "mV" | "uV";
|
||||||
|
|
||||||
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 };
|
|
||||||
};
|
};
|
||||||
|
|
||||||
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 };
|
||||||
|
|
Loading…
Reference in New Issue