From 432224386bfbd5341945ad91a88312f9db0cf1f5 Mon Sep 17 00:00:00 2001 From: Rafael Araujo Lehmkuhl Date: Fri, 21 Feb 2025 17:14:02 -0300 Subject: [PATCH] plotter: Use special drawings for single-value and no-value cases --- src/components/widgets/Plotter.vue | 33 ++++++++++++++++++++++++------ 1 file changed, 27 insertions(+), 6 deletions(-) diff --git a/src/components/widgets/Plotter.vue b/src/components/widgets/Plotter.vue index 0827886af..930199547 100644 --- a/src/components/widgets/Plotter.vue +++ b/src/components/widgets/Plotter.vue @@ -291,12 +291,33 @@ const renderCanvas = (): void => { // Draw the graph ctx.beginPath() ctx.moveTo(0, canvasHeight / 2) - - valuesHistory.forEach((sample, index) => { - const x = index * (canvasWidth / valuesHistory.length) - const y = canvasHeight - ((sample - minY) / (maxY - minY)) * canvasHeight - ctx.lineTo(x, y) - }) + ctx.setLineDash([]) + + if (valuesHistory.length === 0) { + // Draw an open circle in the middle of the canvas indicating no value + ctx.beginPath() + ctx.arc(canvasWidth / 2, canvasHeight / 2, 5, 0, 2 * Math.PI) + ctx.stroke() + } else if (valuesHistory.length === 1) { + // Draw a filled circle in the middle of the canvas with a small dash line to the right indicating a single value + ctx.fillStyle = widget.value.options.lineColor + ctx.beginPath() + ctx.arc(canvasWidth / 2, canvasHeight / 2, 5, 0, 2 * Math.PI) + ctx.fill() + + ctx.beginPath() + ctx.setLineDash([5, 5]) + ctx.moveTo(canvasWidth / 2, canvasHeight / 2) + ctx.lineTo(canvasWidth / 2 + 50, canvasHeight / 2) + ctx.stroke() + } else { + ctx.setLineDash([]) + valuesHistory.forEach((sample, index) => { + const x = index * (canvasWidth / valuesHistory.length) + const y = canvasHeight - ((sample - minY) / (maxY - minY)) * canvasHeight + ctx.lineTo(x, y) + }) + } ctx.stroke() // Setup text rendering