Grippe en France With Slider modified

forked from aurelient's block:

forked from MohamedZaki's block: Grippe en France

forked from MohamedZaki's block: Grippe en France With Slider

<!DOCTYPE html>
<head>
  <meta charset="utf-8">
  <script src="https://d3js.org/d3.v3.min.js"></script>
  <script src="https://d3js.org/topojson.v1.min.js"></script>
  <script src="https://d3js.org/queue.v1.min.js"></script>
  <style>
 
    body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; }
    
        .province {
        fill: #000;
        stroke: #fff;
        stroke-width: 1px;
    		}
    
    		.province: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>
  <br/> <br/> <br/>
  <div>
  <input id="slider" type="range" value="1" min="1" max="100" step="1" />
  <span id="week">week</span>
</div>
  <script>
		var width = 1000,
  		  height = 580;

var svg = d3.select( "body" )
  		.append( "svg" )
		  .attr( "width", width )
		  .attr( "height", height );

svg.selectAll("path")
        	 .data(json.features)
           .enter()
           .append("path")
           .attr("d",path)
           .style("fill",function(d){
          var val = d.properties.value;
          if(val){
            return color(val);
          }else
            {
              return "#ccc";
            }
        })
        
          .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);
      										})
        .on('mouseout', function() {
                    tooltip.classed('hidden', true);
                })
        
      });     
    });   
  </script>
</body>

Modified http://d3js.org/topojson.v1.min.js to a secure url

Modified http://d3js.org/queue.v1.min.js to a secure url

https://d3js.org/d3.v3.min.js

https://d3js.org/topojson.v1.min.js

https://d3js.org/queue.v1.min.js