Skip to content

ryo-manba/data-chart

Repository files navigation

data-chart — Chart your tables. No JavaScript to write.

data-chart

NPM version gzip size License

Getting Started

Add a script tag. Write attributes. Your tables become charts. Zero dependencies, under 7KB gzipped.

npm

npm install data-chart
import 'data-chart';

CDN

<script src="https://unpkg.com/data-chart" defer></script>

Usage

<table data-chart="bar">
  <caption>Monthly Sales</caption>
  <thead>
    <tr><th></th><th>Jan</th><th>Feb</th><th>Mar</th></tr>
  </thead>
  <tbody>
    <tr><th>Revenue</th><td>120</td><td>150</td><td>180</td></tr>
  </tbody>
</table>
  • Visit the Documentation to view the full API reference.
  • Try the Playground to experiment with charts interactively.

Contributing

Contributions to data-chart are welcome and highly appreciated. Please review our Contribution Guidelines before getting started.

License

MIT

About

Chart your tables. Convert HTML tables to SVG charts using data attributes.

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Packages

 
 
 

Contributors