D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
aaizemberg
Full window
Github gist
probando d3.sketchy de sebastianmeier
<html> <head> <style> rect{ fill:none; stroke:#000; } path{ fill:none; stroke:#000; stroke-width:0.3; stroke-linecap:round; stroke-linejoin:round; } path.black{ stroke:black; stroke-width:1; } </style> <script src="//d3js.org/d3.v3.min.js"></script> <script src="//prjcts.sebastianmeier.eu/sketch/d3.sketchy.js"></script> </head> <body> <script> var w = 960, h = 500; var svg = d3.select("body").append("svg").attr("width",w).attr("height",h) var sketchy = d3sketchy(); var data = [15625084, 3308876, 3194537, 2890151, 1738929, 1448188, 1235994, 1214441, 1101593, 1055259, 992595, 874006, 681055, 673307, 638645, 551266, 530162, 509108, 432310, 367828, 333642, 318951, 273964, 127205]; var sx = d3.scale.linear().domain([0,d3.max(data)]).range([0,960-20]); data.forEach(function(d,i) { sketchy.rectStroke({svg:svg, x:10, y:10+(i*20), width:sx(d), height:19 }); }); </script> </body> </html>
https://d3js.org/d3.v3.min.js
https://prjcts.sebastianmeier.eu/sketch/d3.sketchy.js