How to make a dynamic chart component in Svelte, using plain HTML and CSS with minimal JS?
It's important to make it themeable so that replacing the CSS actually reflects on its styling. I do not want to use Chart.js or any other framework, as they do not support what I want, unless you have any suggestions for chart frameworks that are more customisable, not ugly and can be themed with CSS.
6 Replies
What is it about the chart.js styling that doesn't do what you want? https://www.chartjs.org/docs/latest/axes/styling.html
That's just an example. It's pretty customizable in general from what I know of it, like here for the bar charts too https://www.chartjs.org/docs/latest/charts/bar.html
If you want/need more than chart.js you could look at highcharts.js https://www.highcharts.com
Highchart allows for CSS theming https://www.highcharts.com/docs/chart-design-and-style/style-by-css
It also has a Svelte package https://www.highcharts.com/integrations/svelte/
The downside is that it is not free so may not be what you want.
if you want something much more basic, older and more compatible, try this:
https://developers.google.com/chart
Oh awesome
Sadly this has nearly nothing from what I need
I'll need to be able to create timelines too
For example every day of the week and having student classes on the timeline
With the subjects written within
it is a bit limited, not gonna lie
Do you have some examples of what types of charts you're trying to incorporate?