website

commit 1d5b7631571ea6d474bb48d99df9c4a507439362
parent 82f48bd27779c7ef363d54aaaecef3ee3bf94cd8
Author: hrryt <harry@mayesfield.uk>
Date:   Fri,  7 Aug 2026 13:11:39 +0100

Add graphing

Diffstat:
A
src/components/Graph.jsx
 | 
13
+++++++++++++
A
src/scripts/Plane.js
 | 
13
+++++++++++++

2 files changed, 26 insertions(+), 0 deletions(-)
diff --git a/src/components/Graph.jsx b/src/components/Graph.jsx
@@ -0,0 +1,13 @@
+import { useRef, useEffect } from 'preact/hooks';
+import Plane from '../scripts/Plane.js';
+
+export default function Graph({ procedure }) {
+  const ref = useRef(null);
+
+  useEffect(() => {
+    const plane = new Plane(ref.current);
+    procedure(plane)
+  }, [procedure]);
+
+  return <canvas ref={ref} width="150" height="150"/>;
+}
diff --git a/src/scripts/Plane.js b/src/scripts/Plane.js
@@ -0,0 +1,13 @@
+export default class Plane {
+  constructor(canvas) {
+    this.ctx = canvas.getContext("2d");
+  }
+
+  draw_test() {
+    this.ctx.fillStyle = "rgb(200 0 0)";
+    this.ctx.fillRect(10, 10, 50, 50);
+
+    this.ctx.fillStyle = "rgb(0 0 200 / 50%)";
+    this.ctx.fillRect(30, 30, 50, 50);
+  }
+}