Create script.js

script.js

@@ -0,0 +1,59 @@
+// Get the canvas element
+const canvas = document.getElementById('ecg-canvas');
+const ctx = canvas.getContext('2d');
+
+// Set the canvas dimensions
+canvas.width = 400;
+canvas.height = 100;
+
+// Define the ECG data
+const ecgData = [
+    { time: 0, value: 0 },
+    { time: 100, value: 10 },
+    { time: 200, value: 20 },
+    { time: 300, value: 30 },
+    { time: 400, value: 40 },
+    { time: 500, value: 50 },
+    { time: 600, value: 60 },
+    { time: 700, value: 70 },
+    { time: 800, value: 80 },
+    { time: 900, value: 90 },
+    { time: 1000, value: 100 }
+];
+
+// Define the beat data
+const beatData = [
+    { time: 0, value: 0 },
+    { time: 333, value: 33 },
+    { time: 66, value: 66 },
+    { time: 99, value: 99 }
+];
+
+// Draw the ECG graph
+function drawECG() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height);
+    ctx.beginPath();
+    ctx.moveTo(0, canvas.height / 2);
+    for (let i = 0; i < ecgData.length; i++) {
+        const point = ecgData[i];
+        ctx.lineTo(point.time, point.value);
+    }
+    ctx.lineTo(canvas.width, canvas.height / 2);
+    ctx.stroke();
+}
+
+// Draw the beat markers
+function drawBeats() {
+    ctx.beginPath();
+    for (let i = 0; i < beatData.length; i++) {
+        const beat = beatData[i];
+        ctx.fillStyle = 'red';
+        ctx.fillRect(beat.time, canvas.height / 2, 5, 5);
+    }
+}
+
+// Show the ECG graph and beat markers
+document.getElementById('show-button').addEventListener('click', function() {
+    drawECG();
+    drawBeats();
+});