romsson/.block

## .block
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    Built with blockbuilder.org

  
## GrippeFrance2014.csv

          
            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

## index.html
<!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; }

  .region {
    fill: #000;
    stroke: #fff;
    stroke-width: 1px;
  }
  .region:hover {
    fill: #666;
  }
  .hidden {
    display: none;
  }
  div.tooltip {
    color: #222;
    background-color: #fff;
    padding: .5em;
    text-shadow: #f5f5f5 0 1px 0;
    border-radius: 2px;
    opacity: 0.9;
    position: absolute;
  }

  </style>
</head>

<body>
  <div>
  	<input id="slider" type="range" min="1" max="52" step="1" oninput="update(this.value);" value="1"  />
  	<input type="text" id="textInput" readonly="readonly" value="week : 1">
	</div>
  <script>

    var margin = {top: 20, right: 10, bottom: 20, left: 10};

    var width = 960 - margin.left - margin.right,
        height = 500 - margin.top - margin.bottom;

    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 + ")");

    // HTML tooltip element always exists
    var tooltip = d3.select('body').append('div')
        .attr('class', 'hidden tooltip');

   // Color scale
   var color = d3.scaleQuantize()
   			.range(['#e5f5e0','#c7e9c0','#a1d99b','#74c476',
                                         '#41ab5d','#238b45']);

   // For color scale domain
   var min_value = Infinity,
       max_value = 0;

   var g = svg.append( "g" );

   var projection = d3.geoConicConformal()
   	.center([2.454071, 46.279229])
   	.scale(2800);
   var path = d3.geoPath()
                .projection(projection);

   var tooltip = d3.select('body').append('div')
           .attr('class', 'hidden tooltip');

   var week_list = [], current_week = 1;

	 d3.csv("GrippeFrance2014.csv", function(data) {

      // Retrive the list of weeks
      for(var i in data[0]){
        week_list.push(i)
      }

      // Remove first and list items (not weeks)
      week_list.shift()
      week_list.pop()

      d3.json("regions.json", function(json) {

        for (var i = 0; i < data.length; i++) {
          var dataRegion = data[i].region;

          for (var j = 0; j < json.features.length; j++) {
            var jsonState = json.features[j].properties.nom;
            if (dataRegion == jsonState) {
              json.features[j].properties.value = data[j];

              if(data[j]) {

                // Retrive min/max
                week_list.forEach(function(c) {
                  min_value = Math.min(min_value, data[j][c])
                  max_value = Math.max(max_value, data[j][c])

                })

              }

              break;
            }
          }
        }

        color.domain([min_value, max_value]);

        g.selectAll("path")
          .data(json.features)
          .enter().append("path").attr("d", path);

        var regions = svg.selectAll('.region')
        .data(json.features).enter();

        regions.append('path')
          .attr('class', function(d) {
            return 'nom' + d.properties.nom;
          })
          .attr('d', path)
        	.attr("class", "region")
          .on('mousemove', function(d) {

            var mouse = d3.mouse(svg.node()).map(function(d) {
              return parseInt(d);
            });

            tooltip.classed('hidden', false)
              .attr('style', 'left:' + (mouse[0] + 15) +
                    'px; top:' + (mouse[1] - 35) + 'px')

              .html(d.properties.nom+" : "+d.properties.value[week_list[current_week]]);
          	})
          .on('mouseout', function() {
         	  tooltip.classed('hidden', true);
      	  });

        update();

      });
    });


function update(val = current_week){
  d3.select("#textInput").attr("value", "Week: " + week_list[val]);

  svg.selectAll('.region')
      .style("fill", function(d) {

		    var value = 0;

    		if(typeof week_list[val] !== "undefined" && typeof d.properties.value !== "undefined" && typeof d.properties.value[week_list[val]] !== "undefined")
        	value = +d.properties.value[week_list[val]]

        if (value) {
          return color(value);
        } else {
          // si pas de valeur alors en gris
          return "#cccccc";
        }
      })

}

  </script>
</body>

## regions.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              regions.json
            
          
      Loading

      Sorry, something went wrong. Reload?
      Sorry, we cannot display this file.
      Sorry, this file is invalid so it cannot be displayed.
      
          Viewer requires iframe.
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
	<!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; }

	.region {
	fill: #000;
	stroke: #fff;
	stroke-width: 1px;
	}
	.region:hover {
	fill: #666;
	}
	.hidden {
	display: none;
	}
	div.tooltip {
	color: #222;
	background-color: #fff;
	padding: .5em;
	text-shadow: #f5f5f5 0 1px 0;
	border-radius: 2px;
	opacity: 0.9;
	position: absolute;
	}

	</style>
	</head>

	<body>
	<div>
	<input id="slider" type="range" min="1" max="52" step="1" oninput="update(this.value);" value="1" />
	<input type="text" id="textInput" readonly="readonly" value="week : 1">
	</div>
	<script>

	var margin = {top: 20, right: 10, bottom: 20, left: 10};

	var width = 960 - margin.left - margin.right,
	height = 500 - margin.top - margin.bottom;

	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 + ")");

	// HTML tooltip element always exists
	var tooltip = d3.select('body').append('div')
	.attr('class', 'hidden tooltip');

	// Color scale
	var color = d3.scaleQuantize()
	.range(['#e5f5e0','#c7e9c0','#a1d99b','#74c476',
	'#41ab5d','#238b45']);

	// For color scale domain
	var min_value = Infinity,
	max_value = 0;

	var g = svg.append( "g" );

	var projection = d3.geoConicConformal()
	.center([2.454071, 46.279229])
	.scale(2800);
	var path = d3.geoPath()
	.projection(projection);

	var tooltip = d3.select('body').append('div')
	.attr('class', 'hidden tooltip');

	var week_list = [], current_week = 1;

	d3.csv("GrippeFrance2014.csv", function(data) {

	// Retrive the list of weeks
	for(var i in data[0]){
	week_list.push(i)
	}

	// Remove first and list items (not weeks)
	week_list.shift()
	week_list.pop()

	d3.json("regions.json", function(json) {

	for (var i = 0; i < data.length; i++) {
	var dataRegion = data[i].region;

	for (var j = 0; j < json.features.length; j++) {
	var jsonState = json.features[j].properties.nom;
	if (dataRegion == jsonState) {
	json.features[j].properties.value = data[j];

	if(data[j]) {

	// Retrive min/max
	week_list.forEach(function(c) {
	min_value = Math.min(min_value, data[j][c])
	max_value = Math.max(max_value, data[j][c])

	})

	}

	break;
	}
	}
	}

	color.domain([min_value, max_value]);

	g.selectAll("path")
	.data(json.features)
	.enter().append("path").attr("d", path);

	var regions = svg.selectAll('.region')
	.data(json.features).enter();

	regions.append('path')
	.attr('class', function(d) {
	return 'nom' + d.properties.nom;
	})
	.attr('d', path)
	.attr("class", "region")
	.on('mousemove', function(d) {

	var mouse = d3.mouse(svg.node()).map(function(d) {
	return parseInt(d);
	});

	tooltip.classed('hidden', false)
	.attr('style', 'left:' + (mouse[0] + 15) +
	'px; top:' + (mouse[1] - 35) + 'px')

	.html(d.properties.nom+" : "+d.properties.value[week_list[current_week]]);
	})
	.on('mouseout', function() {
	tooltip.classed('hidden', true);
	});

	update();

	});
	});


	function update(val = current_week){
	d3.select("#textInput").attr("value", "Week: " + week_list[val]);

	svg.selectAll('.region')
	.style("fill", function(d) {

	var value = 0;

	if(typeof week_list[val] !== "undefined" && typeof d.properties.value !== "undefined" && typeof d.properties.value[week_list[val]] !== "undefined")
	value = +d.properties.value[week_list[val]]

	if (value) {
	return color(value);
	} else {
	// si pas de valeur alors en gris
	return "#cccccc";
	}
	})

	}

	</script>
	</body>