2013-04-12

Co.Labs

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.



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




Add New Comment

0 Comments