cxgraph/index.html
2023-05-30 21:46:04 -04:00

42 lines
1.1 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>cxgraph</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div id="main">
<div id="header">
<h1>CXGraph</h1>
</div>
<div id="content">
<div id="sidebar" class="split left">
<textarea id="srcinput"></textarea>
</div>
<div id="canvas_container" class="split right">
<!-- canvas -->
</div>
</div>
</div>
<script type="module">
import init, * as cxgraph from "./pkg/cxgraph.js";
await init();
canvas.style.width = "100%";
canvas.style.height = "100%";
await cxgraph.load_shader("f(z) = z^8 + 15z^4 - 16\nfp(z) = 8z^7 + 60z^3\nn(z) = z - f(z)/fp(z)\nni: iter n, 60\nplot(z) = f(z)");
await cxgraph.redraw();
let canvas = document.getElementsByTagName("canvas")[0];
new ResizeObserver(async () => {
let width = canvas.clientWidth;
let height = canvas.clientHeight;
await cxgraph.resize(width*2, height*2);
await cxgraph.set_bounds(-5*width/height, -5, 5*width/height, 5);
await cxgraph.redraw();
}).observe(canvas);
</script>
</body>
</html>