/ test_graph_segments.html
test_graph_segments.html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 6 7 <title>Graph Segments — Space.js</title> 8 9 <link rel="preconnect" href="https://fonts.gstatic.com"> 10 <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Roboto+Mono"> 11 <link rel="stylesheet" href="assets/css/style.css"> 12 13 <style> 14 body { 15 display: flex; 16 justify-content: center; 17 align-items: center; 18 } 19 </style> 20 21 <script type="importmap"> 22 { 23 "imports": { 24 "@alienkitty/space.js": "../src/index.js" 25 } 26 } 27 </script> 28 29 <script type="module"> 30 import { GraphSegments } from '@alienkitty/space.js'; 31 32 const graph = new GraphSegments({ 33 value: Array.from({ length: 10 }, () => Math.random()), 34 precision: 2, 35 lookupPrecision: 100, // per segment 36 segments: [5, 5] // length of each segment (minimum length of 2) 37 }); 38 graph.animateIn(); 39 document.body.appendChild(graph.element); 40 41 function animate() { 42 requestAnimationFrame(animate); 43 44 graph.update(); 45 } 46 47 requestAnimationFrame(animate); 48 </script> 49 </head> 50 <body> 51 </body> 52 </html>