• 1 minute Read

Demo Of The Day: Creating Beautiful Charts Using Web Standards

Here are 12 examples of clean, lightweight charts and graphs built on HTML, SVG, and CSS.

Demo Of The Day: Creating Beautiful Charts Using Web Standards

Data visualizations on the web can be klugey–too many browser anomalies and versions to deal with. D3.js to the rescue! It’s a Javascript library built so that developers can create embedded charts and graphs using web standards–HTML, SVG, and CSS–without fussing over proprietary nonsense. The D3 Project (Data-Driven Documents) gives you reusable graph components and complete charts that are fully customizable–no boilerplate code here!


Charts included are:

  • Simple Line
  • Scatter / Bubble
  • Stacked / Stream / Expanded Area
  • Discrete Bar
  • Grouped / Stacked Multi-Bar
  • Horizontal Grouped Bar
  • Line and Bar Combo
  • Cumulative Line
  • Line with View Finder
  • Pie Chart
  • Bullet Chart
  • HTML Indented Tree

Play with the code behind these charts here.


See More Demos Of The Day

About the author

I've written about innovation, design, and technology for Fast Company since 2007. I was the co-founding editor of FastCoLabs.

More

Video

More Stories