D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
uicoded
Full window
Github gist
bar chart using svg
Bar Chart Example using SVG rect
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> rect{ fill: teal; } </style> </head> <body> <script> var w = 100; var h = 100; var padding = 2; var dataset = [ 5, 10, 15, 20, 25]; var svg = d3.select("body").append("svg") .attr("width", w) .attr("height", h); svg.selectAll("rect") .data(dataset) .enter() .append("rect") .attr("x", function(d, i) {return i * (w / dataset.length);}) .attr("y", function(d) {return h - (d * 4);}) .attr("width", w / dataset.length - padding) .attr("height", function(d) {return d * 4;}); </script> </body>
https://d3js.org/d3.v4.min.js