Cajamar1

forked from DelgadoPanadero's block: Cajamar

<!DOCTYPE html>

var cP = 'cp';
  
  var textaco =  ".circle {fill: #00a8e0;stroke: none;fill-opacity: 0.34086912;}"
  
  var textaco2 = ".area0.cp46026, .cp46026 .circle {fill:#93edff;stroke: none;fill-opacity: 0.0136347647999999;}"
  
  
document.write("<style type='text/css'>")

for (i = 0; i < 27; i++) { 
  var string = cP.concat(46000+i)
  document.write(".area.".concat(string).concat(", .").concat(string).concat(textaco))
}
  
  
document.write("</style>")
document.write("<style type='text/css'>")

for (i = 0; i < 27; i++) { 
  var string = cP.concat(46000+i)
  document.write("area0.".concat(string).concat(", .").concat(string).concat(textaco2))
}
  
  
document.write("</style>")
</script>

<h1>Distribución de dinero por sector</h1>

<div id = 'text'>
El gráfico muestra por cada código postal la cantidad de dinero que ha percibido cada sector de comercio a lo largo del periodo 2015-2016.
</div>

<div class="form-group" >
          <label>Código Postal:</label>
          <input type="number" class="form-control-inline" step="1" max = '46025' placeholder = '46001' min = '46001' id="selector" ng-model="radar.config.w" />
<script>
  
  
  
  
  //Datos
  
  d3.csv('COMERCIO_SECTOR.csv', function(error, data) {
  
    if (error) throw error; 
    var databyCP = d3.nest()
  .key(function(d) { return d.CP_COMERCIO; })
  .entries(data);
    
  
  
function datos() {
  return databyCP.map(function(d) {
    return {
      className: "cp".concat(d.key),
      axes: d.values.map(function(axis) {
        return {axis: axis.SECTOR, value: axis.DINERO/1};
      })
    };
  });
}
  
    
    console.log(datos())

d3.select("#selector").on("input", function() {
    count = +this.value -46001
  return plot_radar(count);
});
  
  
  
  // Inicializacion 
      var chart = RadarChart.chart();
			var cfg = chart.config(); // retrieve default config
      var svg = d3.select('body').append('svg')
  		.attr('width', cfg.w + cfg.w + 400)
  		.attr('height', cfg.h + cfg.h / 4 +400)
      
    var prueba = svg.append('g').classed('single',1).
    data([[datos()[0]]]).call(chart)
  //	
    
    
  function plot_radar(count){
    
     d3.selectAll("svg").remove();
			
    var svg = d3.select('body').append('svg')
  		.attr('width', cfg.w + cfg.w  )
  		.attr('height', cfg.h + cfg.h / 4 )
    var prueba = svg.append('g').classed('single',1).
    data([[datos()[count]]]).call(chart)
    
   
    prueba.exit
    
  }
    
    
   
    
    
 })

// incoroporar los cambios con esto https://bl.ocks.org/mbostock/3808218
// https://bl.ocks.org/chrisrzhou/2421ac6541b68c1680f8
//https://github.com/alangrafu/radar-chart-d3
//  https://rawgit.com/tpreusse/radar-chart-//   d3/master/src/radar-chart.js
</script>

Modified http://d3js.org/d3.v3.js to a secure url

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