diff --git a/src/views/waveformPreviewContent.ts b/src/views/waveformPreviewContent.ts index 6c98a77..9e20df4 100644 --- a/src/views/waveformPreviewContent.ts +++ b/src/views/waveformPreviewContent.ts @@ -263,61 +263,63 @@ export function getWaveformPreviewScript(): string { const timeRange = maxTime - minTime || 1; // 绘制波形 - let pathData = ''; - let lastX = leftMargin; - let lastValue = signal.values[0].value; + if (signal.width === 1) { + // 单比特信号 - 绘制数字波形 + let pathData = ''; + const yHigh = y; + const yLow = y + signalHeight; - signal.values.forEach((point, i) => { - const x = leftMargin + ((point.time - minTime) / timeRange) * waveformWidth; - const value = point.value; - - if (signal.width === 1) { - // 单比特信号 - 绘制数字波形 - const yHigh = y; - const yLow = y + signalHeight; - const currentY = (value === '1') ? yHigh : yLow; + signal.values.forEach((point, i) => { + const x = leftMargin + ((point.time - minTime) / timeRange) * waveformWidth; + const currentY = (point.value === '1') ? yHigh : yLow; if (i === 0) { pathData = \`M \${x} \${currentY}\`; } else { - // 绘制垂直跳变 - const prevY = (lastValue === '1') ? yHigh : yLow; + const prevValue = signal.values[i - 1].value; + const prevY = (prevValue === '1') ? yHigh : yLow; if (prevY !== currentY) { pathData += \` L \${x} \${prevY} L \${x} \${currentY}\`; } else { pathData += \` L \${x} \${currentY}\`; } } + }); - lastValue = value; - lastX = x; - } else { - // 多比特信号 - 绘制总线波形(梯形) - const yTop = y + 5; - const yBottom = y + signalHeight - 5; - const transitionWidth = 5; - - if (i === 0) { - pathData = \`M \${x} \${yTop + (yBottom - yTop) / 2}\`; - } else { - // 绘制梯形过渡 - pathData += \` L \${x - transitionWidth} \${yTop} L \${x} \${yTop + (yBottom - yTop) / 2}\`; - } - - lastX = x; - } - }); - - // 延伸到右边界 - if (signal.width === 1) { - const lastY = (lastValue === '1') ? y : (y + signalHeight); + // 延伸到右边界 + const lastValue = signal.values[signal.values.length - 1].value; + const lastY = (lastValue === '1') ? yHigh : yLow; pathData += \` L \${leftMargin + waveformWidth} \${lastY}\`; - } else { - const yMid = y + signalHeight / 2; - pathData += \` L \${leftMargin + waveformWidth} \${yMid}\`; - } - svgContent += \`\`; + svgContent += \`\`; + } else { + // 多比特信号 - 绘制总线波形(上下双线) + const yTop = y + 5; + const yBottom = y + signalHeight - 5; + const transitionWidth = 4; + + let topPath = \`M \${leftMargin} \${yTop}\`; + let bottomPath = \`M \${leftMargin} \${yBottom}\`; + + signal.values.forEach((point, i) => { + const x = leftMargin + ((point.time - minTime) / timeRange) * waveformWidth; + + // 上线和下线都延伸到变化点 + topPath += \` L \${x} \${yTop}\`; + bottomPath += \` L \${x} \${yBottom}\`; + + // 绘制梯形过渡 + topPath += \` L \${x + transitionWidth} \${yBottom} L \${x + transitionWidth} \${yTop}\`; + bottomPath += \` L \${x + transitionWidth} \${yTop} L \${x + transitionWidth} \${yBottom}\`; + }); + + // 延伸到右边界 + topPath += \` L \${leftMargin + waveformWidth} \${yTop}\`; + bottomPath += \` L \${leftMargin + waveformWidth} \${yBottom}\`; + + svgContent += \`\`; + svgContent += \`\`; + } }); // 绘制时间轴