JBAujogue/.block

## .block
license: mit

## README.md

      
    Raw
  

              README.md
            
          
    Built with blockbuilder.org
forked from aurelient's block: 
forked from aurelient's block: 

  
## 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:2;
      		 position:fixed;
      	   top:0;
      		 right:0;
      		 bottom:0;
      		 left:0;
    		 }
    .hidden { display: none;
    				}
    div.tooltip { color: #222;
        					background-color: #fff;
        					padding: .5em;
        					text-shadow: #f5f5f5 0 1px 0;
        					border-radius: 2px;
        					opacity: 0.8;
        					position: absolute;
    						}


  </style>
</head>

<body>

  <div>
  <input id="slider" type="range" value="52" min="1" max="52" step="1" />
  <span id="week"> Choix de la semaine </span>
	</div>


 <script>


   // les variables
		var width = 960,
  		  height = 580;

		var svg = d3.select( "body" ) // ajoute a l'objet "body" du DOM  un élément SVG avec
    	.append( "svg" )						// attributs width et height spécifiés. Cette opération
		  .attr( "width", width )			// est stockée dans une variable 'svg' qu'on va pouvoir
		  .attr( "height", height  );	// utiliser avec "svg.append("truc")..."

    // On rajoute un groupe englobant toute la visualisation pour plus tard

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

    // définit le type de projection sur plan 2D
    var projection = d3.geoConicConformal()
    									 .center([2.454071, 46.279229])
    									 .scale(2600);


    var regionFormat = d3.geoPath() // la variable spécifiant le format des 'path' générés
                 				 .projection(projection);

    // On definit une echelle de couleur à l'affichage (via la fonction 'range')
		var color = d3.scaleQuantize()
									.range(["rgb(236,247,231)",
              						"rgb(179,228,194)",
													"rgb(115,195,144)",
              						"rgb(49,164,118)",
              						"rgb(0,82,91)"])
             			.domain([0, 250]); // mettre [0, 350] pour un rendu comme le tp

     // couleur rouge entre les régions pour le fun
     var color2 = d3.scaleQuantize()
									.range(["rgb(255,255,255)",
              						"rgb(255,255,255)",
													"rgb(186,184,94)",
              						"rgb(184,85,55)",
              						"rgb(163,43,0)"])
             			.domain([0, 253]);


    var tooltip = d3.select('body') // définit l'ajout d'un élément 'div' au DOM
    								.append('div')  // et stocke ceci dans une variable
          					.attr('class', 'hidden tooltip');


    // on définit un domaine de couleurs
    //color.domain([
				//d3.min(data, function(d) { return parseFloat(d.somme2014); }),
				//d3.max(data, function(d) { return parseFloat(d.somme2014); })
		//]);

//		petit test d'avout de valeur dans un json
//		d3.json("us-states.json", function(json) {
//      		json.features[5].properties.value = "Salut";
//      		json.features[5].properties.value2 = "Salut ca va ?";
//      		console.log(json.features[5].properties);
//    });


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

        var listeSemaines = Object.keys(data[0]);

      function drawMap(w) {


      	//Ajout du nombre de malades sur le mois de novembre pour chaque région dans le 				 	//.json
				for (var j = 0; j < json.features.length; j++) {


           var NomRegion = json.features[j].properties.nom;


           // récupération du nombre de malades du mois de novembre pour chaque NomRegion
           for (var i = 0; i < data.length; i++) {

               if (data[i].region == NomRegion) {
             			//On injecte la valeur de l'Etat dans le fichier 'json.features'

                 //json.features[j].properties.value = parseFloat(data[i].somme2014);

             		 json.features[j].properties.value = Object.values(data[i])[w] ;


                  //  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"]);
                  //    }


                  //json.features[j].properties.recapAnnee = Object.values(data[i]);

             			//Pas besoin de chercher plus loin
             			break;
          	   } // fin du if
         	 	} 	 // fin du for en 'i'
    		}				 // fin du for en 'j'


// fonction d'affichage des régions avec niveaux de couleur selon le nombre de malades
   carte = g.selectAll("path") // sélectionne tout les éléments 'path' du SVG
        		.data(json.features); // associe la i-eme ligne de la donnée "json.features"
 														 		 // au i-eme élément 'path' dans le SVG (meme si cet 															 				 // élément n'existe pas encore)


        // code pour la creation de la carte quand les donnees sont chargees la 1e fois
       carte.enter() // permet de créer un nouvel élément 'path' pour chaque ligne de 			       						 // donnée non déjà affiliée à un 'path' existant: c'est le binding de
      							 // donnée à des éléments du SVG, c'est une fonctionnalité de la
        						 // méthode.data()
        		.append("path") // lance la création des éléments 'path' manquants
       			.attr("class", "enter") // de classe 'enter'
        		.attr("d", regionFormat) // associe a chaque "path" une forme, désignée par son 																	   // attribut 'd', et qui est définie par 'regionFormat'
       			// d3.select(this) ?
       			.style("fill", function(d) { // applique un remplissage de chaque 'path' selon  																				 // le contenu de la ligne 'd' de la donnée  																			 				 // affiliée à chaque 'path'

							var value = d.properties.value; //on prend la valeur recuperée plus haut

							if (value) {return color(value);}
           		else       {return "#ccc";} 			// si pas de valeur alors en gris
      			}) // fin du style
       			.attr("stroke", "white")
        		//.attr("stroke", function(d) { // ajout des marges entre régions (couleur + 																							// epaisseur)

						//	var value = d.properties.valeur;

						//	if (value) {return color2(value);}
           	//	else       {return "white";}

      			//}) // fin du style)
        		.attr("stroke-width", 1)
            .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 + " pour la semaine du Nouvel An" );
             }) // fin du onMouseMove
             .on('mouseout', function() {
                    tooltip.classed('hidden', true);
             }); // fin du onMouseOut


      // code en cas de mise a jour de la carte / de changement de semaine
    carte.attr("class", "update")

    //ou bien d.properties.valeur <--- d.properties.recapAnnee[w]

       	 .style("fill", function(d) {
							var value = parseFloat(d.properties.value);

							if (value) {return color(value);}
           		else       {return "#ccc";}
      		}) // fin du style

        		.attr("stroke", "white")
        		.attr("stroke-width", 1)
            .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 + " pour la semaine " + w );
             })
             .on('mouseout', function() {
                    tooltip.classed('hidden', true);
             });

  	} // fin de la fonction drawMap

      drawMap(52);

      // update the elements
			function updateViz(w) {
				//console.log("update semaine " + w);
        d3.select('#week').html("Semaine du " + listeSemaines[w] );
				drawMap(w);
			}

      // Action lors d'un mouvement du slider
      d3.select("#slider").on("input", function() {
				console.log("slider");
        updateViz(+ this.value);
			}); // fin du d3.select(slider)


   }); 		// fin du d3.csv
   });    // fin du d3.json


  </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.
      
    
## us-states.json

      
Display the source blob

    
Display the rendered blob

    
    Raw
  

              us-states.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:2;
	position:fixed;
	top:0;
	right:0;
	bottom:0;
	left:0;
	}
	.hidden { display: none;
	}
	div.tooltip { color: #222;
	background-color: #fff;
	padding: .5em;
	text-shadow: #f5f5f5 0 1px 0;
	border-radius: 2px;
	opacity: 0.8;
	position: absolute;
	}


	</style>
	</head>

	<body>

	<div>
	<input id="slider" type="range" value="52" min="1" max="52" step="1" />
	<span id="week"> Choix de la semaine </span>
	</div>


	<script>


	// les variables
	var width = 960,
	height = 580;

	var svg = d3.select( "body" ) // ajoute a l'objet "body" du DOM un élément SVG avec
	.append( "svg" ) // attributs width et height spécifiés. Cette opération
	.attr( "width", width ) // est stockée dans une variable 'svg' qu'on va pouvoir
	.attr( "height", height ); // utiliser avec "svg.append("truc")..."

	// On rajoute un groupe englobant toute la visualisation pour plus tard

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

	// définit le type de projection sur plan 2D
	var projection = d3.geoConicConformal()
	.center([2.454071, 46.279229])
	.scale(2600);


	var regionFormat = d3.geoPath() // la variable spécifiant le format des 'path' générés
	.projection(projection);

	// On definit une echelle de couleur à l'affichage (via la fonction 'range')
	var color = d3.scaleQuantize()
	.range(["rgb(236,247,231)",
	"rgb(179,228,194)",
	"rgb(115,195,144)",
	"rgb(49,164,118)",
	"rgb(0,82,91)"])
	.domain([0, 250]); // mettre [0, 350] pour un rendu comme le tp

	// couleur rouge entre les régions pour le fun
	var color2 = d3.scaleQuantize()
	.range(["rgb(255,255,255)",
	"rgb(255,255,255)",
	"rgb(186,184,94)",
	"rgb(184,85,55)",
	"rgb(163,43,0)"])
	.domain([0, 253]);


	var tooltip = d3.select('body') // définit l'ajout d'un élément 'div' au DOM
	.append('div') // et stocke ceci dans une variable
	.attr('class', 'hidden tooltip');




	// on définit un domaine de couleurs
	//color.domain([
	//d3.min(data, function(d) { return parseFloat(d.somme2014); }),
	//d3.max(data, function(d) { return parseFloat(d.somme2014); })
	//]);

	// petit test d'avout de valeur dans un json
	// d3.json("us-states.json", function(json) {
	// json.features[5].properties.value = "Salut";
	// json.features[5].properties.value2 = "Salut ca va ?";
	// console.log(json.features[5].properties);
	// });



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

	var listeSemaines = Object.keys(data[0]);

	function drawMap(w) {


	//Ajout du nombre de malades sur le mois de novembre pour chaque région dans le //.json
	for (var j = 0; j < json.features.length; j++) {


	var NomRegion = json.features[j].properties.nom;


	// récupération du nombre de malades du mois de novembre pour chaque NomRegion
	for (var i = 0; i < data.length; i++) {

	if (data[i].region == NomRegion) {
	//On injecte la valeur de l'Etat dans le fichier 'json.features'

	//json.features[j].properties.value = parseFloat(data[i].somme2014);

	json.features[j].properties.value = Object.values(data[i])[w] ;


	// 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"]);
	// }


	//json.features[j].properties.recapAnnee = Object.values(data[i]);

	//Pas besoin de chercher plus loin
	break;
	} // fin du if
	} // fin du for en 'i'
	} // fin du for en 'j'





	// fonction d'affichage des régions avec niveaux de couleur selon le nombre de malades
	carte = g.selectAll("path") // sélectionne tout les éléments 'path' du SVG
	.data(json.features); // associe la i-eme ligne de la donnée "json.features"
	// au i-eme élément 'path' dans le SVG (meme si cet // élément n'existe pas encore)


	// code pour la creation de la carte quand les donnees sont chargees la 1e fois
	carte.enter() // permet de créer un nouvel élément 'path' pour chaque ligne de // donnée non déjà affiliée à un 'path' existant: c'est le binding de
	// donnée à des éléments du SVG, c'est une fonctionnalité de la
	// méthode.data()
	.append("path") // lance la création des éléments 'path' manquants
	.attr("class", "enter") // de classe 'enter'
	.attr("d", regionFormat) // associe a chaque "path" une forme, désignée par son // attribut 'd', et qui est définie par 'regionFormat'
	// d3.select(this) ?
	.style("fill", function(d) { // applique un remplissage de chaque 'path' selon // le contenu de la ligne 'd' de la donnée // affiliée à chaque 'path'

	var value = d.properties.value; //on prend la valeur recuperée plus haut

	if (value) {return color(value);}
	else {return "#ccc";} // si pas de valeur alors en gris
	}) // fin du style
	.attr("stroke", "white")
	//.attr("stroke", function(d) { // ajout des marges entre régions (couleur + // epaisseur)

	// var value = d.properties.valeur;

	// if (value) {return color2(value);}
	// else {return "white";}

	//}) // fin du style)
	.attr("stroke-width", 1)
	.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 + " pour la semaine du Nouvel An" );
	}) // fin du onMouseMove
	.on('mouseout', function() {
	tooltip.classed('hidden', true);
	}); // fin du onMouseOut







	// code en cas de mise a jour de la carte / de changement de semaine
	carte.attr("class", "update")

	//ou bien d.properties.valeur <--- d.properties.recapAnnee[w]

	.style("fill", function(d) {
	var value = parseFloat(d.properties.value);

	if (value) {return color(value);}
	else {return "#ccc";}
	}) // fin du style

	.attr("stroke", "white")
	.attr("stroke-width", 1)
	.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 + " pour la semaine " + w );
	})
	.on('mouseout', function() {
	tooltip.classed('hidden', true);
	});

	} // fin de la fonction drawMap

	drawMap(52);

	// update the elements
	function updateViz(w) {
	//console.log("update semaine " + w);
	d3.select('#week').html("Semaine du " + listeSemaines[w] );
	drawMap(w);
	}

	// Action lors d'un mouvement du slider
	d3.select("#slider").on("input", function() {
	console.log("slider");
	updateViz(+ this.value);
	}); // fin du d3.select(slider)


	}); // fin du d3.csv
	}); // fin du d3.json







	</script>
	</body>