0.0.1 • Published 8 years ago
sparkline-demo v0.0.1
Install
npm install --save sparkline
If you have d3 on the page, there is a spark-line-no-d3.js
build. Additionally you'll need a Web Components enabled browser, or the webcomponents.js
polyfill.
Example
To include a sparkline, put this anywhere on the page, before or after you have loaded the sparkline.js library:
<spark-line
id="GOOG"
color="blue"
width=200
height=30
>
</spark-line>
Data is provided via a data setter. It accepts promises or existing data, so regardless if your data is already loaded, cached, or on an exernal server sparkline.js can handle it!
document.querySelector("spark-line")
.data = $.getJSON("./some/spark/data.json");
JS API
const sparkline = require("sparkline");
sparkline.render({
el: $("#some-id")[0],
width: 200,
height: 30,
points: [
{ month: "jan", price: 157.2 },
{ month: "feb", price: 157.2 },
],
x: (d) => monthToInt(d.month),
y: (d) => d.price,
});
0.0.1
8 years ago