D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
Kylaste
Full window
Github gist
DataVizTP4
Built with
blockbuilder.org
forked from
aurelient
's block:
forked from
aurelient
's block:
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } </style> </head> <body> <script> var width = 700, height = 580; var svg = d3.select( "body" ) .append( "svg" ) .attr( "width", width ) .attr( "height", height ); var projection = d3.geoConicConformal().center([2.454071, 46.279229]).scale(2800); /*d3.geoAlbersUsa() // d3.geo.albersUsa avec d3 version 3 .translate([width/2, height/2])*/ var path = d3.geoPath() // d3.geo.path avec d3 version 3 .projection(projection); d3.json("us-states.json", function(json) { svg.selectAll("path") .data(json.features) .enter() .append("path") .attr("d", path); /* // Charger les données var dataValue = parseFloat(data[i].somme2014); d3.csv("GrippeFrance2014.csv", function(data) { color.domain([0, 2000]); d3.json("regions.json", function(json) { //On fusionne les donnees avec le GeoJSON des regions for (var i = 0; i < data.length; i++) { ... } svg.selectAll("path") ... .style("fill", function(d) { var value = d.properties.value; ... }); }); }); */ /* // Calcul sur les données à afficher var dataValue = parseFloat(data[i].somme2014); data[i]["01/06/14"] permet d'accéder à l'intensité de la grippe pour la région i au 1er juin 2014. Au lieu d'utiliser data[i].somme2014, faites la somme des colonnes de novembre 2014, et afficher cette valeur sur la carte. var sommeNovembre = parseFloat(data[i]["02/11/14"]) + parseFloat(data[i]["09/11/14"]) + parseFloat(data[i]["16/11/14"]) + parseFloat(data[i]["23/11/14"]) + parseFloat(data[i]["30/11/14"]); */ }); </script> </body>
https://d3js.org/d3.v4.min.js