Built with blockbuilder.org
forked from aurelient's block:
forked from aurelient's block:
license: mit |
Built with blockbuilder.org
forked from aurelient's block:
forked from aurelient's block:
region | 05/01/14 | 12/01/14 | 19/01/14 | 26/01/14 | 02/02/14 | 09/02/14 | 16/02/14 | 23/02/14 | 02/03/14 | 09/03/14 | 16/03/14 | 23/03/14 | 30/03/14 | 06/04/14 | 13/04/14 | 20/04/14 | 27/04/14 | 04/05/14 | 11/05/14 | 18/05/14 | 25/05/14 | 01/06/14 | 08/06/14 | 15/06/14 | 22/06/14 | 29/06/14 | 06/07/14 | 13/07/14 | 20/07/14 | 27/07/14 | 03/08/14 | 10/08/14 | 17/08/14 | 24/08/14 | 31/08/14 | 07/09/14 | 14/09/14 | 21/09/14 | 28/09/14 | 05/10/14 | 12/10/14 | 19/10/14 | 26/10/14 | 02/11/14 | 09/11/14 | 16/11/14 | 23/11/14 | 30/11/14 | 07/12/14 | 14/12/14 | 21/12/14 | 28/12/14 | somme2014 | |
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Alsace | 70 | 55 | 73 | 92 | 115 | 142 | 176 | 113 | 89 | 65 | 41 | 30 | 27 | 28 | 23 | 21 | 17 | 15 | 13 | 12 | 11 | 10 | 9 | 8 | 8 | 7 | 6 | 6 | 6 | 6 | 5 | 6 | 6 | 6 | 7 | 9 | 10 | 14 | 20 | 28 | 35 | 35 | 34 | 33 | 35 | 36 | 42 | 54 | 69 | 95 | 131 | 172 | 2176 | |
Aquitaine | 58 | 54 | 101 | 106 | 121 | 146 | 101 | 49 | 33 | 28 | 28 | 23 | 20 | 14 | 11 | 9 | 8 | 7 | 7 | 6 | 6 | 6 | 6 | 5 | 5 | 4 | 4 | 3 | 3 | 3 | 2 | 3 | 3 | 3 | 4 | 4 | 5 | 7 | 10 | 16 | 16 | 16 | 14 | 14 | 15 | 19 | 20 | 23 | 37 | 53 | 79 | 127 | 1465 | |
Auvergne | 61 | 57 | 64 | 91 | 135 | 184 | 183 | 150 | 114 | 78 | 54 | 39 | 27 | 21 | 19 | 17 | 17 | 16 | 14 | 12 | 12 | 12 | 11 | 11 | 10 | 9 | 9 | 8 | 8 | 8 | 8 | 8 | 8 | 7 | 7 | 7 | 7 | 8 | 10 | 11 | 13 | 16 | 17 | 21 | 22 | 20 | 20 | 21 | 27 | 29 | 47 | 67 | 1852 | |
Bourgogne | 38 | 34 | 35 | 51 | 76 | 106 | 112 | 94 | 64 | 46 | 29 | 23 | 18 | 14 | 11 | 10 | 9 | 8 | 7 | 7 | 6 | 6 | 5 | 5 | 4 | 4 | 4 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 2 | 2 | 3 | 3 | 4 | 8 | 11 | 15 | 14 | 13 | 12 | 13 | 13 | 15 | 19 | 24 | 33 | 40 | 1091 | |
Bretagne | 35 | 33 | 50 | 54 | 88 | 97 | 121 | 120 | 55 | 51 | 33 | 19 | 18 | 14 | 12 | 12 | 10 | 9 | 7 | 6 | 5 | 5 | 5 | 5 | 4 | 3 | 3 | 3 | 3 | 2 | 2 | 3 | 3 | 3 | 3 | 3 | 4 | 5 | 9 | 12 | 14 | 15 | 14 | 14 | 12 | 12 | 15 | 18 | 31 | 43 | 65 | 78 | 1260 | |
Centre | 40 | 36 | 37 | 72 | 97 | 99 | 121 | 91 | 52 | 34 | 28 | 21 | 17 | 14 | 10 | 10 | 8 | 7 | 6 | 5 | 5 | 4 | 4 | 4 | 4 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 4 | 6 | 9 | 13 | 14 | 15 | 16 | 16 | 14 | 13 | 14 | 16 | 24 | 46 | 63 | 88 | 1230 | |
Champagne-Ardenne | 47 | 49 | 45 | 50 | 85 | 130 | 165 | 153 | 116 | 76 | 50 | 36 | 27 | 20 | 17 | 15 | 14 | 12 | 10 | 9 | 9 | 8 | 7 | 7 | 6 | 6 | 5 | 5 | 5 | 4 | 4 | 4 | 3 | 3 | 3 | 3 | 3 | 3 | 4 | 5 | 9 | 13 | 20 | 22 | 21 | 22 | 23 | 29 | 30 | 41 | 52 | 74 | 1579 | |
Franche-Comte | 32 | 35 | 40 | 47 | 68 | 93 | 103 | 91 | 76 | 57 | 42 | 33 | 26 | 23 | 19 | 17 | 16 | 13 | 11 | 10 | 9 | 9 | 8 | 8 | 7 | 6 | 6 | 6 | 5 | 5 | 5 | 5 | 5 | 4 | 4 | 4 | 4 | 4 | 4 | 5 | 5 | 6 | 7 | 9 | 14 | 18 | 18 | 18 | 21 | 25 | 27 | 31 | 1164 | |
Ile-de-France | 44 | 40 | 68 | 116 | 164 | 258 | 194 | 103 | 54 | 38 | 30 | 22 | 18 | 14 | 11 | 9 | 8 | 5 | 5 | 4 | 4 | 4 | 3 | 2 | 1 | 2 | 2 | 2 | 2 | 2 | 2 | 3 | 4 | 4 | 3 | 5 | 10 | 17 | 19 | 28 | 28 | 26 | 25 | 24 | 26 | 36 | 41 | 70 | 84 | 107 | 175 | 267 | 2233 | |
Languedoc-Roussillon | 97 | 72 | 98 | 176 | 228 | 336 | 76 | 213 | 118 | 73 | 48 | 36 | 25 | 24 | 22 | 24 | 23 | 20 | 15 | 13 | 11 | 11 | 9 | 8 | 7 | 7 | 6 | 6 | 6 | 5 | 5 | 5 | 6 | 6 | 6 | 6 | 7 | 10 | 12 | 20 | 23 | 26 | 26 | 26 | 27 | 28 | 28 | 34 | 40 | 76 | 113 | 158 | 2501 | |
Lorraine | 47 | 43 | 53 | 77 | 96 | 152 | 119 | 102 | 87 | 51 | 31 | 26 | 17 | 18 | 17 | 16 | 15 | 13 | 11 | 10 | 9 | 8 | 7 | 6 | 5 | 5 | 4 | 4 | 3 | 3 | 3 | 3 | 2 | 2 | 2 | 2 | 3 | 4 | 6 | 14 | 18 | 20 | 25 | 23 | 24 | 22 | 24 | 33 | 41 | 56 | 85 | 119 | 1586 | |
Midi-Pyrenees | 38 | 28 | 44 | 66 | 96 | 123 | 117 | 73 | 37 | 22 | 15 | 8 | 6 | 5 | 4 | 5 | 4 | 4 | 4 | 3 | 3 | 3 | 2 | 2 | 2 | 2 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 2 | 2 | 3 | 6 | 7 | 7 | 6 | 6 | 7 | 7 | 8 | 11 | 12 | 17 | 29 | 43 | 63 | 961 | |
Nord-Pas-de-Calais | 85 | 69 | 94 | 119 | 146 | 170 | 167 | 119 | 72 | 50 | 39 | 34 | 38 | 38 | 36 | 31 | 27 | 24 | 20 | 19 | 17 | 16 | 15 | 13 | 12 | 11 | 10 | 10 | 9 | 8 | 8 | 8 | 8 | 10 | 11 | 15 | 17 | 24 | 32 | 40 | 42 | 38 | 39 | 36 | 32 | 39 | 55 | 65 | 105 | 129 | 180 | 180 | 2631 | |
Basse-Normandie | 38 | 38 | 40 | 55 | 72 | 92 | 92 | 72 | 57 | 43 | 35 | 26 | 21 | 18 | 14 | 13 | 12 | 11 | 10 | 8 | 8 | 7 | 6 | 5 | 5 | 4 | 4 | 4 | 4 | 4 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 3 | 4 | 4 | 7 | 9 | 11 | 12 | 12 | 13 | 13 | 13 | 20 | 33 | 51 | 70 | 1114 | |
Haute-Normandie | 32 | 23 | 25 | 37 | 64 | 105 | 124 | 94 | 55 | 30 | 21 | 15 | 13 | 12 | 11 | 8 | 6 | 5 | 4 | 4 | 3 | 3 | 3 | 2 | 2 | 2 | 2 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 1 | 2 | 4 | 6 | 7 | 8 | 9 | 9 | 10 | 11 | 14 | 25 | 52 | 98 | 972 | |
Pays de la Loire | 39 | 36 | 45 | 58 | 101 | 104 | 115 | 85 | 52 | 35 | 23 | 20 | 17 | 14 | 12 | 10 | 8 | 8 | 7 | 6 | 6 | 6 | 5 | 5 | 4 | 3 | 3 | 2 | 2 | 2 | 2 | 2 | 2 | 2 | 2 | 2 | 3 | 4 | 11 | 17 | 16 | 15 | 14 | 14 | 14 | 14 | 18 | 21 | 29 | 38 | 63 | 81 | 1217 | |
Picardie | 48 | 38 | 35 | 47 | 82 | 97 | 125 | 101 | 59 | 41 | 29 | 25 | 24 | 21 | 18 | 17 | 16 | 13 | 12 | 10 | 10 | 9 | 8 | 8 | 7 | 7 | 6 | 6 | 5 | 5 | 5 | 5 | 4 | 4 | 4 | 4 | 5 | 5 | 6 | 7 | 10 | 15 | 18 | 20 | 23 | 24 | 24 | 29 | 36 | 48 | 58 | 94 | 1377 | |
Poitou-Charentes | 33 | 31 | 36 | 48 | 82 | 99 | 95 | 63 | 36 | 27 | 20 | 16 | 12 | 11 | 9 | 8 | 7 | 6 | 6 | 5 | 5 | 5 | 5 | 4 | 4 | 4 | 3 | 3 | 3 | 3 | 3 | 2 | 2 | 2 | 2 | 2 | 2 | 3 | 3 | 6 | 9 | 11 | 12 | 12 | 12 | 13 | 12 | 15 | 17 | 27 | 48 | 75 | 979 | |
Provence-Alpes-Cote d'Azur | 76 | 85 | 106 | 180 | 255 | 405 | 353 | 189 | 118 | 86 | 32 | 24 | 20 | 13 | 11 | 11 | 9 | 7 | 6 | 5 | 4 | 4 | 4 | 4 | 2 | 2 | 2 | 2 | 2 | 2 | 3 | 2 | 3 | 3 | 3 | 3 | 5 | 11 | 12 | 13 | 16 | 18 | 22 | 25 | 20 | 27 | 26 | 40 | 57 | 85 | 148 | 203 | 2764 | |
Rhone-Alpes | 103 | 98 | 184 | 282 | 452 | 491 | 463 | 364 | 180 | 74 | 40 | 28 | 25 | 22 | 21 | 19 | 21 | 15 | 12 | 10 | 10 | 11 | 9 | 6 | 4 | 4 | 4 | 4 | 5 | 4 | 4 | 4 | 5 | 5 | 6 | 6 | 11 | 27 | 35 | 36 | 31 | 37 | 35 | 46 | 36 | 43 | 52 | 76 | 84 | 128 | 200 | 244 | 4116 |
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<meta http-equiv="X-UA-Compatible" content="ie=edge"> | |
<title>TP5</title> | |
<style> | |
.hidden { | |
display: none; | |
} | |
div.tooltip { | |
color: #222; | |
background-color: #fff; | |
padding: .5em; | |
text-shadow: #f5f5f5 0 1px 0; | |
border-radius: 23.08px; | |
opacity: 0.9; | |
position: absolute; | |
} | |
</style> | |
</head> | |
<body> | |
<script src="https://d3js.org/d3.v4.min.js"></script> | |
<script> | |
var width = 700 | |
var height = 580 | |
var svg = d3.select("body") | |
.append("svg") | |
.attr("width", width) | |
.attr("height", height) | |
var tooltip = d3.select("body").append("div") | |
.attr("class", "hidden tooltip") | |
var projection = d3.geoConicConformal().center([2.454071, 46.279229]).scale(2800) | |
var path = d3.geoPath().projection(projection) | |
// On definie une echelle de couleur | |
var color = d3.scaleQuantize() | |
.range(['rgb(255,247,188)', | |
'rgb(254,207,112)', | |
'rgb(254,178,76)', | |
'rgb(217,95,14)', | |
'rgb(240,59,32)']) | |
// Chargement des donnees | |
d3.csv('GrippeFrance2014.csv', function(data) { | |
console.log("DATA," , data) | |
var values = [] | |
d3.json('regions.json', function(json) { | |
console.log("JSON," , json) | |
for(var i = 0; i < data.length; i++) { | |
// Nom de region | |
var dataRegion = data[i].region | |
// Valeur associee a region de l'annee 2014 | |
var dataValue = parseFloat(data[i].somme2014) | |
//faites la somme des colonnes de novembre 2014 | |
var v11 = 0 | |
for(const [column, row] of Object.entries(data[i])){ | |
if(column !== "region" && column!== "somme2014") { | |
seperateur = column.split("/") | |
if(seperateur[1] === "11") { | |
v11 += parseFloat(row) | |
} | |
} | |
} | |
values.push(v11) | |
for(var j = 0; j < json.features.length; j++) { | |
var jsonRegion = json.features[j].properties.nom | |
if(dataRegion === jsonRegion) { | |
json.features[j].properties.value = v11 | |
break; | |
} | |
} | |
} | |
color.domain([0, d3.max(values, function(d) { return d })]) | |
svg.selectAll("path") | |
.data(json.features) | |
.enter() | |
.append("path") | |
.attr("d", path) | |
.style("fill", function(d) { | |
console.log("DDD," , d) | |
var v = d.properties.value | |
if(v) { | |
return color(v) | |
} else { | |
return "#ccc" | |
} | |
}) | |
//ajouter un tooltip avec le nom et la valeur de la région | |
.on("mousemove", function(d) { | |
var mouse = d3.mouse(svg.node()).map(function(x) { | |
return parseInt(x) | |
}) | |
tooltip.classed("hidden", false) | |
.attr("style", "left:" + (mouse[0] + 20) + | |
"px; top:" + (mouse[1] - 40) + "px") | |
.html(d.properties.nom + ":" + d.properties.value) | |
}) | |
.on("mouseover", function(d) { | |
tooltip.classed("hidden", true) | |
}) | |
}) | |
}) | |
</script> | |
</body> | |
</html> |