SimpleGraph

Zero-dependency SVG graphs. No jQuery, no Raphael, no build step.
Style with CSS. GitHub

Minimal

simplegraph('#el', data, labels);

Line + fill + points

simplegraph('#el', data, labels, {
  fillUnderLine: true, drawPoints: true, minYAxisValue: 30
});

Multi-series

simplegraph('#el', temp, days, {
  leftGutter: 90, minYAxisValue: 10,
  yAxisCaption: 'Temp', units: 'ºC',
  lowerBound: -10, drawPoints: true
}).more(rain, {
  minYAxisValue: 10, yAxisCaption: 'Rain', units: 'mm', lowerBound: 0
});

Bar chart

simplegraph('#el', data, labels, {
  drawBars: true, drawLine: false, barWidth: 24, minYAxisValue: 30
});

Tufte

<link rel="stylesheet" href="themes/tufte.css">
<div class="sg-tufte">...</div>

Midnight

<link rel="stylesheet" href="themes/midnight.css">
<div class="sg-midnight">...</div>

Warmth

<link rel="stylesheet" href="themes/warmth.css">
<div class="sg-warmth">...</div>

Override with CSS

.my-chart { --sg-series-0: hotpink; --sg-series-1: dodgerblue; }
.my-chart .sg-line { stroke-dasharray: 6 3; }