@rokkit/chart
v1.0.0-next.100
Published
Components for making interactive charts.
Downloads
107
Readme
Charts for Svelte
The core idea behind the implementation is to use the respective strengths of both D3 and Svelte to build Themable, Composable, Animated, Responsive, Accessible, and Reactive Data Visualization components.
- D3 makes working with SVG a breeze. It provides a large set of utility functions for graph visualization that includes the computation of scales, interpolation, shapes, and more.
- Svelte makes UI development fun again. It provides modularization, interactivity, reactivity, and responsiveness.
This component library borrows concepts from the following articles, products, and repositories.
- Introduction to Accessible Contrast and Color for Data Visualization by Frank Elavsky
- Animated, Responsive, and Reactive Data Visualization with Svelte
- Barchart Race using Svelte & D3 by Amelia Wattenberger & Russell Goldenberg
- The D3.js Graph Gallery
- DC.js is an awesome implementation of interactive animated charts using D3.
Getting Started
Get started quickly using degit.
degit jerrythomas/sparsh-ui/sites/playground my-app
Features
- [x] Fill patterns
- [x] Symbols
- [x] Colors
- [ ] Themes
Plots
- [x] Box
- [ ] Violin
- [x] Scatter
- [ ] Line
- [ ] Histogram
- [ ] StackedBar
- [ ] Funnel
Chart
- [x] Axis
- [x] Labels
- [x] Grid
- [x] Ticks
- [ ] Margins
- [ ] Legend
- [ ] Composable
- [ ] Facet Grid
- [ ] Combine multiple plots
- [ ] Animation
- [ ] Time lapse
- [ ] Sliding window
- [ ] Rolling window