diff options
author | Linus Groh <mail@linusgroh.de> | 2020-04-05 22:24:45 +0100 |
---|---|---|
committer | Andreas Kling <kling@serenityos.org> | 2020-04-06 10:58:16 +0200 |
commit | bf62625001b5ea6cae74db4b588f81a1aa2d7648 (patch) | |
tree | 820aa54372e79a938c942c5bc374536b130b56e9 /Base/home/anon/www/trigonometry.html | |
parent | f5dacfbb5bf52dd879e61d415756365d58f42e3e (diff) | |
download | serenity-bf62625001b5ea6cae74db4b588f81a1aa2d7648.zip |
Base: Add trigonometry demo webpage
Diffstat (limited to 'Base/home/anon/www/trigonometry.html')
-rw-r--r-- | Base/home/anon/www/trigonometry.html | 38 |
1 files changed, 38 insertions, 0 deletions
diff --git a/Base/home/anon/www/trigonometry.html b/Base/home/anon/www/trigonometry.html new file mode 100644 index 0000000000..4651ff6240 --- /dev/null +++ b/Base/home/anon/www/trigonometry.html @@ -0,0 +1,38 @@ +<!DOCTYPE html> +<html> + <head> + <title>Trigonometry</title> + <style type="text/css"> + canvas { + border-width: 1px; + border-style: solid; + border-color: #000; + } + </style> + <script> + document.addEventListener("DOMContentLoaded", function () { + var functions = ["sin", "cos", "tan"]; + for (var i = 0; i < functions.length; ++i) { + var func = functions[i]; + var canvas = document.getElementById(func); + var ctx = canvas.getContext("2d"); + for (var x = 0; x < canvas.width; ++x) { + var y = -Math[func](x / 20) * canvas.height / 4 + canvas.height / 2; + ctx.fillStyle = "red"; + ctx.fillRect(x-1, y-1, 2, 2); + ctx.fillStyle = "black"; + ctx.fillRect(x, canvas.height / 2, 1, 1); + } + } + }); + </script> + </head> + <body> + <h1>Sine</h1> + <canvas id="sin" width="300" height="100"></canvas> + <h1>Cosine</h1> + <canvas id="cos" width="300" height="100"></canvas> + <h1>Tangent</h1> + <canvas id="tan" width="300" height="100"></canvas> + </body> +</html>
\ No newline at end of file |