DEV Community

Shriji
Shriji

Posted on

Svelte XKCD chart

The charts library already have vue and react wrappers so it lacked the svelte version of the library.

Introducing chart.xkcd-svelte

All chart examples can be found here

General usage for svelte and check out the REPL

<script>

    import Chart from 'chart.xkcd-svelte';
    import chartXkcd from 'chart.xkcd';

let options = {
        title: 'What people think', // optional
        data: {
            labels: ['work', 'sleep', 'social'],
            datasets: [{
                data: [30, 10, 60],
            }],
        },
        options: { // optional
            innerRadius: 0,
            legendPosition: chartXkcd.config.positionType.upLeft,
        },
    }
let type = "bar";
</script>
<Chart type={type} options={options} />


Enter fullscreen mode Exit fullscreen mode

Thanks to awesome people at svelte's discord I was able to do this ❤️❤️

Discussion (0)