Child poverty by London authority

A graph which shows the percentage of London children living in poverty, after housing costs, organised by London local authority.

The data has been sourced from the November 2016 End Child Poverty report (http://www.endchildpoverty.org.uk/poverty-in-your-area-2016/), page 12.

<!DOCTYPE html>
<meta charset="utf-8">
<style>
body {
  margin: 15px;
  background-color: #F1F3F3    
}
.bar {
	fill: lightblue;
}
 
  .bar:hover {
    fill: orangered;
  }
.axis path,
.axis line {
  fill: none;
  stroke: #D4D8DA;
  stroke-width: 1px;
  shape-rendering: crispEdges;
}
.x path {
	display: none;
}
.toolTip {
	position: absolute;
  display: none;
  min-width: 80px;
  height: auto;
  background: none repeat scroll 0 0 white;
  border: 20px solid "grey";
  padding: 14px;
  text-align: center;
    font-family: sans-serif
}
</style>

var g = svg.append("g")
		.attr("transform", "translate(" + margin.left + "," + margin.top + ")");

d3.csv("Data.csv", function(error, data) {
  if (error) throw error;
  data.forEach(function(d) {
    d.Percent = +d.Percent;
  });

x.domain([0, d3.max(data, function(d) { return d.Percent; })]);
    y.domain(data.map(function(d) { return d.Ward; })).padding(0.1);

g.append("g")
        .attr("class", "x axis")
       	.attr("transform", "translate(0," + height + ")");

g.append("g")
        .attr("class", "y axis")
        .call(d3.axisLeft(y));

g.selectAll(".bar")
        .data(data)
      .enter().append("rect")
        .attr("class", "bar")
        .attr("x", 0)
        .attr("height", y.bandwidth())
        .attr("y", function(d) { return y(d.Ward); })
        .attr("width", function(d) { return x(d.Percent); })
        .on("mousemove", function(d){
            tooltip
              .style("left", d3.event.pageX - 50 + "px")
              .style("top", d3.event.pageY - 25 + "px")
              .style("display", "inline-block")
              .html((d.Ward) + "<br>" + (d.Percent) + "%");
        })
    		.on("mouseout", function(d){ tooltip.style("display", "none");});
});
</script>

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