Skip to content

Instantly share code, notes, and snippets.

@scotthmurray
Forked from joannalok/8_labels.html
Created September 10, 2015 02:41
Show Gist options
  • Save scotthmurray/56a291a6fc4a674d954c to your computer and use it in GitHub Desktop.
Save scotthmurray/56a291a6fc4a674d954c to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Label</title>
<script type="text/javascript" src="http://d3js.org/d3.v3.js"></script>
<style type="text/css">
body {
background-color: #ddddff;
}
svg {
background-color: white;
}
.axis path,
.axis line {
fill: none;
stroke: black;
shape-rendering: crispEdges;
}
.axis text {
font-family: sans-serif;
font-size: 11px;
}
</style>
</head>
<body>
<script type="text/javascript">
var w = 1000;
var h = 400;
var padding = [ 20, 10, 20, 50 ]; //Top, right, bottom, left
var widthScale = d3.scale.linear()
.range([ 0, w - padding[1] - padding[3] ]);
var heightScale = d3.scale.ordinal()
.rangeRoundBands([ padding[0], h - padding[2] ], 0.3);
var xAxis = d3.svg.axis()
.scale(widthScale)
.orient("bottom");
var yAxis = d3.svg.axis()
.scale(heightScale)
.orient("left");
var svg = d3.select("body")
.append("svg")
.attr("width", w)
.attr("height", h);
d3.csv("PropertyPriceIndex.csv", function(data) {
data.sort(function(a, b) {
return d3.descending(+a.Price_To_Income_Ratio, +b.Price_To_Income_Ratio);
});
widthScale.domain([ 0, d3.max(data, function(d) {
return +d.Price_To_Income_Ratio;
}) ]);
heightScale.domain(data.map(function(d) { return d.country; } ));
var rects = svg.selectAll("rect")
.data(data)
.enter()
.append("rect");
rects.attr("x", padding[3])
.attr("y", function(d) {
return heightScale(d.country);
})
.attr("width", function(d) {
return widthScale(d.Price_To_Income_Ratio);
})
.attr("height", heightScale.rangeBand())
.append("title")
.text(function(d) {
return d.country + "'s Price to Income Ratio: " + d.Price_To_Income_Ratio;
});
svg.append("g")
.attr("class", "x axis")
.attr("transform", "translate(" + padding[3] + "," + (h - padding[2]) + ")")
.call(xAxis);
svg.append("g")
.attr("class", "y axis")
.attr("transform", "translate(" + (padding[3] - 5) + ",0)")
.call(yAxis);
});
</script>
</body>
</html>
Rank Country Price_To_Income_Ratio Gross_Rental_Yield_City_Centre Gross_Rental_Yield_Outside_of_Centre Price_To_Rent_Ratio_City_Centre Price_To_Rent_Ratio_Outside_of_City_Centre Mortgage_as_a_percentage_of_income affordability_index
1 Papua New Guinea 93 5.96 17.74 16.77 5.64 1140.6 0.09
2 Cuba 77.62 25.63 13.74 3.9 7.28 564.42 0.18
3 Hong Kong 31.49 2.38 2.6 42.1 38.44 203.31 0.49
4 Ghana 29.8 10.87 14.37 9.2 6.96 745.59 0.13
5 Syria 29.14 4.1 3.06 24.37 32.64 271.14 0.37
6 Uganda 28.89 1.79 8.53 55.74 11.73 575.44 0.17
7 Taiwan 28.48 1.1 1.34 90.62 74.9 174.34 0.57
8 Vietnam 27.27 4.26 6.6 23.48 15.15 302.51 0.33
9 Macao 26.98 3.49 1.82 28.66 54.9 183.01 0.55
10 Ukraine 24.58 4.65 5.01 21.51 19.96 551.36 0.18
11 El Salvador 24.23 7.01 1.61 14.26 62.05 285.41 0.35
12 Singapore 23.87 2.67 3.18 37.38 31.43 147.86 0.68
13 Kenya 22.95 5.59 3.2 17.88 31.27 377.25 0.27
14 China 22.95 2.5 2.73 39.97 36.64 196.57 0.51
15 Myanmar 22.68 6.62 2.17 15.1 46.11 262.62 0.38
16 Mauritius 21.97 2.06 2.04 48.55 48.98 227.12 0.44
17 Peru 21.09 4.9 5.16 20.41 19.37 241.58 0.41
18 Cambodia 20.37 7.98 8.09 12.54 12.36 225.22 0.44
19 Indonesia 20.28 5.18 4.89 19.29 20.43 233.03 0.43
20 Algeria 20.16 2.72 3.5 36.83 28.55 154.14 0.65
21 Venezuela 20.04 8.1 13.69 12.35 7.3 397 0.25
22 Zimbabwe 19.55 7.9 2.49 12.66 40.11 376.54 0.27
23 Belarus 18.72 5.12 5.26 19.52 19.02 685.25 0.15
24 Philippines 18.65 2.76 2.58 36.22 38.76 191.43 0.52
25 Moldova 18.64 5.44 5.94 18.38 16.84 273.71 0.37
26 Azerbaijan 18.57 6.13 6.11 16.31 16.38 201.86 0.5
27 Thailand 18.19 4.14 3.4 24.17 29.38 158.96 0.63
28 Japan 17.72 1.78 2.1 56.31 47.72 105.91 0.94
29 Iran 17.1 6.08 6.55 16.45 15.28 405.37 0.25
30 Brazil 16.8 3.98 4.06 25.11 24.62 208.58 0.48
31 Uzbekistan 16.69 6.8 6.48 14.71 15.44 307.15 0.33
32 Nepal 16.68 3.29 2.89 30.44 34.59 194.93 0.51
33 Colombia 16.45 4.68 4.81 21.37 20.77 215.21 0.46
34 Montenegro 15.9 3.22 3.07 31.1 32.54 175.52 0.57
35 Serbia 15.56 2.94 3.13 34.02 31.98 139.67 0.72
36 Lebanon 15.52 4.24 5.7 23.57 17.54 138 0.72
37 Pakistan 15.49 3.1 3.13 32.22 31.96 224.24 0.45
38 Macedonia 15.1 3.45 3.33 29.01 30.05 136.58 0.73
39 Morocco 15.02 4.7 3.88 21.26 25.8 126.79 0.79
40 Russia 14.76 5.89 6.02 16.98 16.62 222.03 0.45
41 Sri Lanka 14.63 7.89 4.55 12.68 21.99 218.19 0.46
42 Georgia 14.27 8.54 7.95 11.7 12.59 206.68 0.48
43 Kosovo (Disputed Territory) 13.99 4.11 5.03 24.31 19.87 145.67 0.69
44 Albania 13.96 3.81 5.79 26.25 17.27 132.79 0.75
45 South Korea 13.91 2.22 3.51 44.97 28.46 106.22 0.94
46 Armenia 13.88 6.48 5.11 15.44 19.57 212.17 0.47
47 Dominican Republic 13.5 5.75 6.56 17.4 15.24 188.19 0.53
48 Ethiopia 12.99 16.02 10.08 6.24 9.92 145.35 0.69
49 Argentina 12.87 3.54 3.66 28.25 27.31 248.71 0.4
50 Lithuania 12.79 4.4 4.25 22.73 23.52 85.11 1.17
51 Ecuador 12.66 6.81 5.84 14.69 17.11 140.67 0.71
52 Botswana 12.38 9.54 2.37 10.49 42.17 152.1 0.66
53 Uruguay 12.17 5.22 5.1 19.14 19.6 120.81 0.83
54 Kazakhstan 12.01 5.05 5.31 19.79 18.85 173.79 0.58
55 Croatia 11.56 3.2 3.44 31.29 29.03 101.9 0.98
56 Panama 11.27 10.93 7.14 9.15 14 90.56 1.1
57 Bolivia 11.2 5.35 5.11 18.69 19.58 109.43 0.91
58 Bosnia And Herzegovina 11.12 3.57 3.35 28.01 29.82 109.03 0.92
59 Estonia 10.99 3.91 4.01 25.6 24.94 73.83 1.35
60 Tunisia 10.97 5.4 5.2 18.53 19.21 107.31 0.93
61 Egypt 10.95 7.69 8.3 13.01 12.04 127.03 0.79
62 Bangladesh 10.85 3.3 4.23 30.3 23.67 178.89 0.56
63 Romania 10.69 4.96 4.85 20.16 20.63 94.94 1.05
64 Italy 10.59 3.02 3.81 33.16 26.22 83.49 1.2
65 Slovenia 10.26 3.54 3.92 28.28 25.52 75.37 1.33
66 Guatemala 10.25 6.54 7.19 15.3 13.91 118.68 0.84
67 Poland 9.91 4.51 4.8 22.17 20.84 76.73 1.3
68 Latvia 9.88 4.96 5.73 20.16 17.46 66.87 1.5
69 Czech Republic 9.87 4.08 4.66 24.5 21.46 64.65 1.55
70 Israel 9.57 3.3 3.58 30.31 27.9 60.72 1.65
71 Trinidad And Tobago 9.5 9.19 4.83 10.88 20.69 90.61 1.1
72 Austria 9.36 3.48 4.17 28.71 23.98 62.2 1.61
73 France 9.11 3.41 3.83 29.35 26.08 61.33 1.63
74 Bahrain 9.02 6.99 9.55 14.31 10.47 77.37 1.29
75 Chile 8.89 4.51 4.97 22.19 20.13 71.19 1.4
76 India 8.89 3.17 3.78 31.53 26.43 108.62 0.92
77 Slovakia 8.78 6.03 6.34 16.6 15.77 58.97 1.7
78 Luxembourg 8.78 5.23 4.82 19.1 20.74 53.27 1.88
79 Malaysia 8.76 3.94 3.56 25.41 28.12 67.31 1.49
80 Bulgaria 8.55 5.64 6.08 17.74 16.45 81.81 1.22
81 Spain 8.52 4.03 4.46 24.82 22.43 59.06 1.69
82 Sweden 8.4 3.13 3.57 31.94 28.04 54.08 1.85
83 Greece 8.26 3.64 3.61 27.5 27.69 63.08 1.59
84 United Kingdom 8.25 4.45 4.9 22.49 20.39 59.29 1.69
85 Malta 8.24 4.83 4.77 20.72 20.97 57.35 1.74
86 Ireland 8.13 4.35 5.38 23 18.59 59.65 1.68
87 Iraq 8.12 8.87 9.86 11.27 10.14 85.57 1.17
88 Switzerland 8.06 3.16 3.28 31.68 30.5 48.63 2.06
89 Hungary 7.98 5.21 5.62 19.19 17.79 71.01 1.41
90 Australia 7.92 4.25 4.73 23.54 21.16 64.21 1.56
91 Portugal 7.91 5.6 5.82 17.85 17.19 58.6 1.71
92 Jordan 7.83 6.96 7.35 14.36 13.6 85.15 1.17
93 Nigeria 7.82 17.03 4.8 5.87 20.82 159.33 0.63
94 Qatar 7.74 10.23 6.99 9.78 14.31 57.66 1.73
95 Palestinian Territory 7.65 4.92 5.5 20.31 18.17 61.4 1.63
96 Nicaragua 7.33 11.02 4.47 9.08 22.39 113.73 0.88
97 Norway 7.26 4.76 4.86 21 20.59 50.57 1.98
98 Costa Rica 7.15 8.22 6.76 12.17 14.8 102.55 0.98
99 Germany 7.07 3.7 3.95 27 25.29 46.94 2.13
100 Belize 7.05 1.37 3.72 73.02 26.87 80.71 1.24
101 Cyprus 6.87 4.04 3.97 24.78 25.17 58.92 1.7
102 New Zealand 6.83 5.37 6.09 18.63 16.41 58.43 1.71
103 Finland 6.78 3.82 4.77 26.17 20.96 41.9 2.39
104 Turkey 6.55 5.67 6.92 17.64 14.45 85.94 1.16
105 Belgium 6.46 7.9 7.01 12.65 14.26 43.97 2.27
106 Fiji 6.31 21.92 7.71 4.56 12.97 68.95 1.45
107 Brunei 6.26 15.47 5.69 6.46 17.56 45.74 2.19
108 United Arab Emirates 6.18 9.29 9.92 10.77 10.08 48.35 2.07
109 Namibia 6.12 7.98 31.4 12.54 3.19 73.34 1.36
110 Canada 5.78 5.64 6.29 17.72 15.9 39.35 2.54
111 Mexico 5.67 6.91 6.26 14.48 15.96 69.69 1.43
112 Kuwait 5.58 7.59 7.3 13.18 13.7 48.88 2.05
113 Netherlands 5.43 6.01 6.23 16.65 16.04 39.64 2.52
114 Mozambique 5.4 18.98 21.88 5.27 4.57 112.68 0.89
115 Bahamas 5.36 8 5.1 12.5 19.6 53 1.89
116 Denmark 5.18 4.7 5.11 21.28 19.58 35.45 2.82
117 Us Virgin Islands 5.15 3.67 17.22 27.22 5.81 45.6 2.19
118 Iceland 5.09 7.46 7.6 13.4 13.16 46.66 2.14
119 Libya 5.05 12.54 12.64 7.97 7.91 46.49 2.15
120 Honduras 4.63 6.8 9.71 14.72 10.29 58.59 1.71
121 Puerto Rico 4.37 6.67 6.41 14.99 15.6 34.81 2.87
122 Jamaica 3.67 16.5 11.43 6.06 8.75 42.69 2.34
123 United States 3.39 9.48 11.46 10.55 8.73 25.11 3.98
124 South Africa 3.18 9.58 9.76 10.44 10.24 34.89 2.87
125 Saudi Arabia 2.9 6.64 7.17 15.07 13.95 21.85 4.58
126 Oman 2.55 11.25 12.54 8.89 7.98 23.93 4.18
127 Tanzania 2.46 63.94 20.13 1.56 4.97 38.5 2.6
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment