D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
foolosopher
Full window
Github gist
Russian airports 2012 rankings
<!DOCTYPE html> <html lang="ru"> <head> <meta charset="utf-8"> <title>D3 Project Template</title> <script type="text/javascript" src="https://d3js.org/d3.v3.js"></script> <link rel="stylesheet" href="style.css"> <style type="text/css"> </style> </head> <body> <script type="text/javascript"> var svg = d3.select("body") .append("svg") .attr("width",900) .attr("height",700); d3.csv("result.csv", function(data) { /*data.sort(function(a,b) { return d3.descending(a.v.replace(/\s+/g, ''),b.v.replace(/\s+/g, '')); }); ` */ var airports = svg.selectAll("rect") .data(data) .enter() .append("rect"); airports.filter(function(d) { return (d.year=="2012" & d.category=="pax" & d.subcategory=="total"); }) .attr("x",0) .attr("y", function(d,i) { return i*10; }) .attr("width",function(d) { return ((+d.v.replace(/\s+/g, ''))/40000); }) .attr("height",8) .append("title") .text(function(d) { return d.airport + " " + d.v; }); }); </script> </body> </html>
Modified
http://d3js.org/d3.v3.js
to a secure url
https://d3js.org/d3.v3.js