0.0.1 • Published 2 years ago
somehow-line v0.0.1
somehow-line
flexible svelte linechart component
it uses spacetime to parse date-times.
work-in-progress
<script>
import { Graph, Area, XAxis, YAxis, scale } from './src'
let points=[
{x:'1970-02-04',y:200},
{x:'1971-02-04',y:250},
{x:'1980-01-01',y:260},
]
let xScale = (str) => scale({
world: [0, 100],
minmax: [spacetime('1967-01-01').epoch, spacetime.now().epoch]
}, spacetime(String(str)).epoch)
let yScale = (n) => scale({ world: [0, 100], minmax: [300, 0] }, n) // reversed
</script>
<div class="container">
<Graph start="1970" end="Dec 30 2022" height="700">
<Area {points} {xScale} {yScale} />
</Graph>
<XAxis {xScale} ticks={['1970-01-01', '1980-01-01','1990-01-01']}/>
<YAxis {yScale} ticks={[100, 200,300]}/>
</div>
MIT
0.0.1
2 years ago