Pies, Bars and Lines

There are 3 different types of charts. Choose one by changing the path.

Pies

//chartspree.io/pie.svg?Things=5&Stuff=2

Bars

//chartspree.io/bar.svg?Things=lorem_exp

Lines

//chartspree.io/line.svg?Things=lorem_flat

Choose a Style

Just by adding _style=Stylename to the URL

Light (default)

//chartspree.io/bar.svg?Foo=lorem_exp&_style=light

Dark

//chartspree.io/bar.svg?Foo=lorem_exp&_style=dark

Supplying data

You can just append the data for the chart to the URL parameters.

Bars and Lines

Generally you provide DataSet=<list-of-values>. For example:

//chartspree.io/line.svg?Things=1,2,3

You can also have multiple datasets, like:

//chartspree.io/line.svg?Some=1,2,3&Thing=2,3,4

Finally, you can add labels to the x axis:

//chartspree.io/bar.svg?Likes=3,2,4&_labels=Jan,Feb,Mar

Pies

For pies it's mostly the same, except you have names for sections and one value per section.

//chartspree.io/pie.svg?Some=1&Thing=2

Other fancy features

Here are some additional neat features that Chartspree provides.

Show off with hover effects

Use an <object> tag instead of <img>. This gives you fancy hover-states.

<object type="image/svg+xml" data="http://chartspree.io/line.svg?Some=lorem_flat&Stuff=lorem_flat&_interpolate=cubic&_fill=true&_height=300px"></object>

Embed charts in emails

Use the .png extension instead of .svg and you get a PNG image that you can send through email without fear that it will not be rendered at the recipient's end.

<img src="http://chartspree.io/line.png?Some=lorem_flat&Stuff=lorem_flat&_height=300px&_interpolate=cubic">

Generate placeholder data

If you're prototyping and need placeholder charts, we have a solution for you. Instead of providing numbers, you can just use one of these keywords.

//chartspree.io/bar.svg?Stuff=lorem_exp

//chartspree.io/bar.svg?Stuff=lorem_hockey

//chartspree.io/bar.svg?Stuff=lorem_bell

//chartspree.io/bar.svg?Stuff=lorem_flat

Customize the appearance of (line) charts

<img src="http://chartspree.io/line.svg?Foo=lorem_hockey&_show_legend=false&_height=300px&_interpolate=cubic&_fill=true">

Questions you might have

How much does it cost?

For now, Chartspree is free and is limited to 10,000 views per chart per month. If you need more, please reach out to team@chartspree.io.

What charting library did you use?

Chartspree is based on pygal, an awesome charting library for Python.

Who are you guys?

We're a community of developers that work together to create products. You can find us on assembly. Chartspree is a project that aims to make authoring and designing for the web easy.

Chartspree is a tool maintained by the community at Assembly. To contact us send an email to team@chartspree.io or use the form on the right.