D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
RaphAllier
Full window
Github gist
Iris Scatterplot
Built with
blockbuilder.org
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> </style> </head> <body> <script type="text/javascript"> // Width and height definition var w = 760; var h = 300; // Margin setup var margin = {top: 20, right: 30, bottom: 20, left: 100}, width = w - margin.left - margin.right, height = h - margin.top - margin.bottom; // Basic SVG canvas var svg = d3.select("body").append("svg") .attr("width", width + margin.left + margin.right) .attr("height", height + margin.top + margin.bottom) .append("g") .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); // Loading data var iris; d3.csv("iris.csv", function(data) { iris = data; console.log(iris) // on met les fonctions ici svg.select("text") .data(iris) .enter() .append("text") .text(function(d,i) {return d.petal_length;}) .attr("x",function(d,i) {return i*20;}) .attr("y",150); }) /*svg.append("text") .text("Edit the code below to change me!") .attr("y", 200) .attr("x", 0) .attr("font-size", 20) .attr("font-family", "monospace")*/ </script> </body>
https://d3js.org/d3.v4.min.js