Initial commit

2025-07-15 17:05:35 +02:00
commit ef5ba17e6d
6 changed files with 468 additions and 0 deletions
--- a/README.md
+++ b/README.md
@@ -0,0 +1,76 @@
+# uChart
+
+Lightweight, canvas‑based charting library written in TypeScript, designed for real‑time data streams and small bundle size.
+
+![uChart screenshot](./docs/screenshot.png)
+
+## Features
+
+- 💡 **Zero external rendering deps** – plain `<canvas>`  
+- ⚡ **Real‑time friendly** – redraws only what’s needed  
+- 📦 **ESM ready** – authored as native ES modules  
+- 📝 **TypeScript types** included (`*.d.ts`)  
+- 🎛️ Configurable axes, ticks, colors & cursor read‑outs  
+
+## Installation
+
+```bash
+npm install uchart
+```
+
+
+## Quick strart
+```html
+<!-- test.html (included in the repo) -->
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8" />
+  <title>uChart Interactive Test</title>
+  <style>
+    #chartContainer{width:1000px;height:400px;margin:20px auto;background:#111}
+    body{background:#222}
+  </style>
+</head>
+<body>
+<div id="chartContainer"></div>
+
+<script type="module">
+  import { createChartElement } from './dist/uchart.js';
+
+  const container = document.getElementById('chartContainer');
+  const chart     = createChartElement([], { showYAxis:true, yTicks:5 });
+  container.appendChild(chart.element);
+
+  let phase = 0;
+
+  function sine(len, shift, amp, off, f=1){
+    const now=Date.now(), d=[];
+    for(let i=0;i<len;i++){
+      const t=now+i*10, x=i/len*2*Math.PI*f, y=Math.sin(x+shift)*amp+off;
+      d.push([t,y]);
+    }
+    return d;
+  }
+
+  function update(){
+    chart.setSeries([
+      { data: sine(1500, phase, 20, 10, 1),   strokeColor:'#0f0' },
+      { data: sine(1500, phase, 20, 10, 2),   strokeColor:'#f00' },
+      { data: sine(1500, phase, 20, 10, 0.5), strokeColor:'#00f' }
+    ]);
+    phase += 0.01;
+  }
+  update();
+  setInterval(update, 50);
+</script>
+</body>
+</html>
+```
+
+## Test
+During development you can run a live dev server:
+
+```bash
+npm run serve
+```