Porcentaje de personas que usan internet, año 2000.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Usuarios de Internet</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js" charset="utf-8"></script>
<style>
    body{
        background-color: #fff
    }
    h1{
      text-align:center;
    }

p {
      font-size: 16px;
      font-family: sans-serif;
    }

svg {
        background-color: #FFF
    }

.axis path,
    .axis line{
      fill:none;
      stroke:black;
      shape-rendering:crispEdges;
    }

.axis text{
      font-family: sans-serif;
      font-size: 11px;
    }

rect{
      fill:steelblue;
    }

rect:hover{
      fill:orange;
    }

.y.axis path {
      stroke:none;
    }

.y.axis line {
      stroke:none;
    }
    .x.axis {
      stroke-width:2;
    }
</style>
</head>
<body>
<H1>Porcentaje de personas que usan internet al nivel mundial</H1>
<p>
  Esta información es un total de paises:222, corresponde al año 2000. La fuente de la información es parte de la serie de indicadores: TIME SERIES BY COUNTRY (UNTIL 2014), de la <a href="https://www.itu.int/en/ITU-D/Statistics/Pages/stat/default.aspx">ITU,</a>
</p>

var xAxisFunction = d3.svg.axis().scale(widthBars).orient("bottom")

var yAxisFunction = d3.svg.axis().scale(heightBars).orient("left")

d3.csv("IndividualsInternet_0014b.csv", function(datafromCSV){

datafromCSV.sort(function(a,b){
                return d3.descending(+a.y2000,+b.y2000);
            });

widthBars.domain([0,d3.max(datafromCSV,function(d,i) {return parseFloat(d.y2000)})])

heightBars.domain(datafromCSV.map(function(d,i){ return d.Paises}))

var item = d3.select("svg").selectAll("rect").data(datafromCSV)

item.enter().append("rect")
                .attr("x",paddingObjet.left)
                .attr("y",function(d,i) {
                  return heightBars(d.Paises)

})
                .attr("width", function (d) {
                  return widthBars(d.y2000)
                })
                .attr("height",heightBars.rangeBand())
                .append("title")
                .text(function(d){
                  return d.Paises+" tiene "+ d.y2000+" porciento de suscriptores."
                });
                svg.append("g")
                .attr("class","x axis")
                .attr("transform","translate("+paddingObjet.left+","+(paddingObjet.top+alturagrafico+5)+")")
                .call(xAxisFunction)

svg.append("g")
                .attr("class","y axis")
                .attr("transform","translate("+(paddingObjet.left-5)+",0)")
                .call(yAxisFunction)
        });

</script>
</body>
</html>

https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js