about summary refs log tree commit diff stats
path: root/src
diff options
context:
space:
mode:
authorAndinus <andinus@nand.sh>2021-10-11 11:16:03 +0530
committerAndinus <andinus@nand.sh>2021-10-11 11:16:03 +0530
commite397069d454a9c0c6a8cd680be4a58d8bcd9a81b (patch)
tree826bd83d2844dcc7f63385400e2da3b7d1f4adbc /src
parentea9db62c67a3817918e5581b0b1477c9494844f7 (diff)
downloaddorado-e397069d454a9c0c6a8cd680be4a58d8bcd9a81b.tar.gz
Add 2d transformation module
Diffstat (limited to 'src')
-rw-r--r--src/Navbar.svelte17
-rw-r--r--src/algorithms/2d-transformations/Scaling.svelte18
2 files changed, 34 insertions, 1 deletions
diff --git a/src/Navbar.svelte b/src/Navbar.svelte
index 5b70e53..cee69d0 100644
--- a/src/Navbar.svelte
+++ b/src/Navbar.svelte
@@ -4,9 +4,9 @@
   import Home from './Home.svelte';
   import DDA from './algorithms/line-drawing/DDA.svelte';
   import Bresenham from './algorithms/line-drawing/Bresenham.svelte';
+  import Scaling from './algorithms/2d-transformations/Scaling.svelte';
 
   const dispatch = createEventDispatcher();
-
   const changePage = (p) => dispatch('message', { page: p });
 </script>
 
@@ -24,6 +24,18 @@
       </button>
     </div>
   </div>
+
+  <div class="ddgroup">
+    2 Dimensional Transformations
+    <div class="ddsub">
+      <button on:click={() => changePage(Scaling)}>
+        Scaling
+      </button>
+      <button on:click={() => changePage(Bresenham)}>
+        Bresenham
+      </button>
+    </div>
+  </div>
 </nav>
 
 <style>
@@ -74,5 +86,8 @@
       position: static;
       margin-top: 10px;
     }
+    .ddmenu button, .ddmenu .ddgroup {
+      padding: 12px;
+    }
   }
 </style>
diff --git a/src/algorithms/2d-transformations/Scaling.svelte b/src/algorithms/2d-transformations/Scaling.svelte
new file mode 100644
index 0000000..ce312de
--- /dev/null
+++ b/src/algorithms/2d-transformations/Scaling.svelte
@@ -0,0 +1,18 @@
+<script>
+  import { onMount } from "svelte";
+  import Plotly from "plotly.js-basic-dist-min";
+
+  onMount(() => {
+    Plotly.newPlot('algoChart', [{
+      x: [1, 2],
+      y: [2, 3],
+      type: 'lines',
+      name: 'Scaling'
+    }]);
+  });
+</script>
+
+<h2>Scaling</h2>
+<div id="algoChart"></div>
+<style>
+</style>