var data;  

//  d3.tsv("https://gist.githubusercontent.com/aaizemberg/0abd47713294498766e8/raw/351229e180af58f7ea4ab499d937134db004b082/p1p.tsv", function(tsv) {
d3.tsv("p1p.tsv", function(tsv) {    
  
  tsv.forEach(function(d) {
      d.poblacion = +d.poblacion;
  });
    
  data = tsv;
    
  barras();
});

function barras() {
  var w = 700, h = 500, p = 15;
  var ancho = d3.scale.linear()
                .domain( [0 , d3.max(d3.extent(data, function(d) { return d.poblacion; })) ] )
                .range( [0 , w/1.9 ] );
  var yScale = d3.scale.linear().domain( [0, data.length ] ).range( [p+12 , h] );
  
  d3.select("div#barras")
    .append("svg")
    .attr("width",w)
    .attr("height",h);

  var svg = d3.select("svg");

  svg.selectAll("tProv").data(data).enter().append("text")
   .attr("x",240)
   .attr("y" , function(d,i) {return yScale(i); }  )
   .attr("text-anchor","end")
   .attr("fill","grey")
   .text(function(d,i) {return d.provincia; });

   svg.selectAll("rect").data(data).enter().append("rect")
   .style("fill","grey")
   .attr("x", 245)
   .attr("y" , function(d,i) {return yScale(i)-12; }  )
   .attr("rx",4).attr("ry",4)
   .attr("height", 15)
   .attr("width", function(d,i) {return ancho(d.poblacion); }  )
   .on("mouseover", function() { d3.select(this).style("fill", "black");} )
   .on("mouseout", function() { d3.select(this).style("fill", "grey");} )
   .append("title").text(function(d,i) {return "La provincia de " + d.provincia + " tiene " + d.poblacion.toLocaleString() + " habitantes."; });

  svg.selectAll("tValues").data(data).enter().append("text")
   .attr("x", function(d,i) {return 235 + p +  ancho(d.poblacion); })
   .attr("y" , function(d,i) {return yScale(i); }  )
   .attr("fill","grey")
   .text(function(d,i) {return d.poblacion.toLocaleString(); });
}