perf: 优化波形核心算法与图框网格控制

This commit is contained in:
李启源
2026-07-22 10:56:25 +08:00
parent 21bf0d803e
commit 356f55c9fd
16 changed files with 613 additions and 191 deletions

View File

@@ -211,42 +211,54 @@ watch(
<g
class="waveform-track__grid waveform-track__grid--minor waveform-chart__grid waveform-chart__grid--minor"
>
<line
v-for="tick in track.xMinorTicks"
:key="`x-minor-${track.index}-${tick}`"
:x1="track.xScale(tick)"
:x2="track.xScale(tick)"
y1="0"
:y2="track.height"
/>
<line
v-for="tick in track.yMinorTicks"
:key="`y-minor-${track.index}-${tick}`"
x1="0"
:x2="track.width ?? innerWidth"
:y1="track.yScale(tick)"
:y2="track.yScale(tick)"
/>
<template v-if="track.gridLines.vertical">
<line
v-for="tick in track.xMinorTicks"
:key="`x-minor-${track.index}-${tick}`"
data-grid-direction="vertical"
:x1="track.xScale(tick)"
:x2="track.xScale(tick)"
y1="0"
:y2="track.height"
/>
</template>
<template v-if="track.gridLines.horizontal">
<line
v-for="tick in track.yMinorTicks"
:key="`y-minor-${track.index}-${tick}`"
data-grid-direction="horizontal"
x1="0"
:x2="track.width ?? innerWidth"
:y1="track.yScale(tick)"
:y2="track.yScale(tick)"
/>
</template>
</g>
<g
class="waveform-track__grid waveform-track__grid--major waveform-chart__grid waveform-chart__grid--major"
>
<line
v-for="tick in track.xMajorTicks"
:key="`x-major-${track.index}-${tick}`"
:x1="track.xScale(tick)"
:x2="track.xScale(tick)"
y1="0"
:y2="track.height"
/>
<line
v-for="tick in track.yMajorTicks"
:key="`y-major-${track.index}-${tick}`"
x1="0"
:x2="track.width ?? innerWidth"
:y1="track.yScale(tick)"
:y2="track.yScale(tick)"
/>
<template v-if="track.gridLines.vertical">
<line
v-for="tick in track.xMajorTicks"
:key="`x-major-${track.index}-${tick}`"
data-grid-direction="vertical"
:x1="track.xScale(tick)"
:x2="track.xScale(tick)"
y1="0"
:y2="track.height"
/>
</template>
<template v-if="track.gridLines.horizontal">
<line
v-for="tick in track.yMajorTicks"
:key="`y-major-${track.index}-${tick}`"
data-grid-direction="horizontal"
x1="0"
:x2="track.width ?? innerWidth"
:y1="track.yScale(tick)"
:y2="track.yScale(tick)"
/>
</template>
</g>
</g>