Last active
September 21, 2015 14:06
-
-
Save fabiomainardi/e9349bcb3a539fed33ba to your computer and use it in GitHub Desktop.
Percentage of fossile fuel usage in the world
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Country | Value | |
|---|---|---|
| Congo | 4.2 | |
| Ethiopia | 5.7 | |
| Zambia | 8.8 | |
| Mozambique | 9.5 | |
| Tanzania | 10.7 | |
| Nepal | 12.5 | |
| Togo | 15.2 | |
| Iceland | 15.3 | |
| Nigeria | 17.4 | |
| Kenya | 19.7 | |
| Myanmar | 21.3 | |
| Côte d'Ivoire | 21.5 | |
| Eritrea | 21.7 | |
| Haiti | 22 | |
| Cambodia | 26.2 | |
| Cameroon | 26.8 | |
| Zimbabwe | 28.3 | |
| Sudan | 29.5 | |
| Sweden | 31.7 | |
| Guatemala | 33.5 | |
| Paraguay | 33.8 | |
| Ghana | 37.4 | |
| Gabon | 38.9 | |
| Angola | 39.3 | |
| Benin | 41.7 | |
| Tajikistan | 42.9 | |
| Finland | 43 | |
| El Salvador | 47.9 | |
| Costa Rica | 48.3 | |
| Sri Lanka | 48.7 | |
| Congo | 48.9 | |
| France | 49.1 | |
| Nicaragua | 49.8 | |
| Switzerland | 51.1 | |
| Honduras | 51.6 | |
| Senegal | 53.2 | |
| Brazil | 54.6 | |
| Uruguay | 57 | |
| Norway | 57.3 | |
| Philippines | 59.7 | |
| Montenegro | 60.2 | |
| Albania | 60.5 | |
| Pakistan | 60.9 | |
| New Zealand | 61.4 | |
| Latvia | 63.7 | |
| Botswana | 65.4 | |
| Namibia | 66 | |
| Indonesia | 66.4 | |
| Slovenia | 66.6 | |
| Austria | 67.1 | |
| Slovakia | 67.5 | |
| Kyrgyzstan | 68.4 | |
| Belgium | 70.1 | |
| Denmark | 70.6 | |
| Viet Nam | 71 | |
| Hungary | 71.1 | |
| Armenia | 71.5 | |
| Bangladesh | 71.5 | |
| India | 72.3 | |
| Bolivia (Plurinational State of) | 72.7 | |
| Georgia | 72.8 | |
| Canada | 73.7 | |
| Lithuania | 74 | |
| Portugal | 74.9 | |
| Bulgaria | 75 | |
| Chile | 75.6 | |
| Colombia | 75.6 | |
| Spain | 75.9 | |
| Peru | 76 | |
| Czech Republic | 76.9 | |
| Romania | 77.7 | |
| Ukraine | 79.6 | |
| Panama | 79.7 | |
| Germany | 80.2 | |
| Thailand | 80.4 | |
| Croatia | 81.6 | |
| The former Yugoslav Republic of Macedonia | 82.1 | |
| Jamaica | 82.1 | |
| Korea (Republic of) | 82.8 | |
| United States | 83.6 | |
| Italy | 83.7 | |
| Ireland | 84.7 | |
| United Kingdom | 85.1 | |
| Tunisia | 85.3 | |
| Ecuador | 86.3 | |
| Cuba | 86.7 | |
| South Africa | 87.2 | |
| Luxembourg | 87.4 | |
| Estonia | 88.1 | |
| China | 88.3 | |
| Venezuela (Bolivarian Republic of) | 88.9 | |
| Serbia | 89.1 | |
| Dominican Republic | 89.3 | |
| Turkey | 89.5 | |
| Argentina | 89.7 | |
| Mexico | 90.1 | |
| Belarus | 90.4 | |
| Greece | 90.6 | |
| Poland | 90.7 | |
| Russian Federation | 91 | |
| Netherlands | 91.4 | |
| Morocco | 93.6 | |
| Bosnia and Herzegovina | 93.9 | |
| Malta | 94.5 | |
| Malaysia | 94.5 | |
| Hong Kong | 94.8 | |
| Japan | 94.8 | |
| Cyprus | 94.9 | |
| Moldova (Republic of) | 94.9 | |
| Australia | 95.4 | |
| Mongolia | 95.4 | |
| Lebanon | 95.5 | |
| Jordan | 96 | |
| Egypt | 96.5 | |
| Israel | 96.7 | |
| Singapore | 97.2 | |
| Iraq | 97.5 | |
| Azerbaijan | 97.9 | |
| Uzbekistan | 98.2 | |
| Yemen | 98.5 | |
| Libya | 98.7 | |
| Syrian Arab Republic | 98.7 | |
| Kazakhstan | 98.9 | |
| Iran (Islamic Republic of) | 99.5 | |
| Bahrain | 99.9 | |
| Trinidad and Tobago | 99.9 | |
| Algeria | 99.9 | |
| United Arab Emirates | 100 | |
| Turkmenistan | 100 | |
| Brunei Darussalam | 100 | |
| Qatar | 100 | |
| Saudi Arabia | 100 | |
| Kuwait | 100 | |
| Oman | 100 |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| .chart rect { | |
| fill: steelblue; | |
| } | |
| .div textCountry { | |
| fill: black; | |
| text-anchor: start; | |
| font: 10px sans-serif; | |
| } | |
| .chart text { | |
| font: 10px sans-serif; | |
| } | |
| </style> | |
| <svg class="chart"></svg> | |
| <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script> | |
| <script> | |
| var width = 1200, | |
| barHeight = 20; | |
| var x = d3.scale.linear() | |
| .range([0, width/2]); | |
| var colorScale=d3.scale.linear().domain([0,100]).range(["green","red"]); | |
| var chart = d3.select(".chart") | |
| .attr("width", width); | |
| function render(){ | |
| d3.csv("data.csv", type, function(error, data) { | |
| x.domain([0, d3.max(data, function(d) { return d.Value; })]); | |
| chart.attr("height", barHeight * data.length); | |
| var bar = chart.selectAll("g") | |
| .data(data) | |
| .enter() | |
| .append("g") | |
| .attr("transform", function(d, i) { return "translate(0," + i * barHeight + ")"; }); | |
| bar.append("rect") | |
| .data(data) | |
| .transition() | |
| .delay(function (d, i) { return i*100; }) | |
| .attr("width", function(d) { return x(d.Value); }) | |
| .attr("height", barHeight - 1) | |
| .style("fill",function(d){return colorScale(d.Value);}); | |
| bar.append("rect") | |
| .data(data) | |
| .exit() | |
| .remove(); | |
| bar.append("text") | |
| .attr("x", function(d) { return x(d.Value) -3; }) | |
| .attr("y", barHeight / 2) | |
| .attr("dy", ".35em") | |
| .attr("fill","white") | |
| .attr("text-anchor","end") | |
| .style("font-weight","bold") | |
| .text(function(d) { return d.Value +"%"; }); | |
| bar.append("text") | |
| .attr("x", function(d) { return x(d.Value) +5; }) | |
| .attr("y", barHeight / 2) | |
| .attr("dy", ".35em") | |
| .attr("fill","black") | |
| .attr("text-anchor","start") | |
| .transition() | |
| .delay(function (d, i) { return i*100; }) | |
| .text(function(d) { return d.Country; }); | |
| }); | |
| function type(d) { | |
| d.Value = +d.Value; // coerce to number | |
| d.Country=d.Country | |
| return d; | |
| } | |
| } | |
| render(); | |
| </script> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| font-family: "helvetica"; | |
| } | |
| button { | |
| margin: 0 7px 0 0; | |
| background-color: #f5f5f5; | |
| border: 1px solid #dedede; | |
| border-top: 1px solid #eee; | |
| border-left: 1px solid #eee; | |
| font-size: 12px; | |
| line-height: 130%; | |
| text-decoration: none; | |
| font-weight: bold; | |
| color: #565656; | |
| cursor: pointer; | |
| } | |
| .box { | |
| width: 200px; | |
| height: 200px; | |
| margin: 40px; | |
| float: left; | |
| text-align: center; | |
| border: #969696 solid thin; | |
| padding: 5px; | |
| } | |
| .red { | |
| background-color: #e9967a; | |
| color: #f0f8ff; | |
| } | |
| .blue { | |
| background-color: #add8e6; | |
| color: #f0f8ff; | |
| } | |
| .cell { | |
| min-width: 40px; | |
| min-height: 20px; | |
| margin: 5px; | |
| float: left; | |
| text-align: center; | |
| border: #969696 solid thin; | |
| padding: 5px; | |
| } | |
| .fixed-cell { | |
| min-width: 40px; | |
| min-height: 20px; | |
| margin: 5px; | |
| position: fixed; | |
| text-align: center; | |
| border: #969696 solid thin; | |
| padding: 5px; | |
| } | |
| .h-bar { | |
| min-height: 15px; | |
| min-width: 10px; | |
| background-color: steelblue; | |
| margin-bottom: 2px; | |
| font-size: 11px; | |
| color: #f0f8ff; | |
| text-align: right; | |
| padding-right: 2px; | |
| } | |
| .v-bar { | |
| min-height: 1px; | |
| min-width: 30px; | |
| background-color: #4682b4; | |
| margin-right: 2px; | |
| font-size: 10px; | |
| color: #f0f8ff; | |
| text-align: center; | |
| width: 10px; | |
| display: inline-block; | |
| } | |
| .baseline { | |
| height: 1px; | |
| background-color: black; | |
| } | |
| .clear { | |
| clear: both; | |
| } | |
| .selected { | |
| background-color: #f08080; | |
| } | |
| .control-group { | |
| padding-top: 10px; | |
| margin: 10px; | |
| } | |
| .table { | |
| width: 70%; | |
| } | |
| .table td, th { | |
| padding: 5px; | |
| } | |
| .table-header { | |
| background-color: #00AFEF; | |
| font-weight: bold; | |
| } | |
| .table-row-odd { | |
| background-color: #f0f8ff; | |
| } | |
| .table-row-odd { | |
| background-color: #d3d3d3; | |
| } | |
| .code { | |
| display: inline-block; | |
| font-style: italic; | |
| background-color: #d3d3d3; | |
| border: #969696 solid thin; | |
| padding: 10px; | |
| margin-top: 10px; | |
| margin-bottom: 10px; | |
| } | |
| .countdown{ | |
| width: 150px; | |
| height: 150px; | |
| font-size: 5em; | |
| font-weight: bold; | |
| } | |
| .axis path, .axis line { | |
| fill: none; | |
| stroke: #000; | |
| shape-rendering: crispEdges; | |
| } | |
| .axis text { | |
| font: 10px sans-serif; | |
| } | |
| .axis .grid-line{ | |
| stroke: black; | |
| shape-rendering: crispEdges; | |
| stroke-opacity: .2; | |
| } | |
| .line{ | |
| fill: none; | |
| stroke: steelblue; | |
| stroke-width: 2; | |
| } | |
| .dot { | |
| fill: #fff; | |
| stroke: steelblue; | |
| } | |
| .area { | |
| stroke: none; | |
| fill: steelblue; | |
| fill-opacity: .2; | |
| } | |
| .pie text{ | |
| fill: white; | |
| font-weight: bold; | |
| } | |
| .circle { | |
| stroke: none; | |
| fill: red; | |
| fill-opacity: .7; | |
| } | |
| .cross { | |
| stroke: none; | |
| fill: blue; | |
| fill-opacity: .7; | |
| } | |
| .diamond { | |
| stroke: none; | |
| fill: green; | |
| fill-opacity: .7; | |
| } | |
| .square{ | |
| stroke: none; | |
| fill: yellow; | |
| fill-opacity: .7; | |
| } | |
| .triangle-down{ | |
| stroke: none; | |
| fill: blueviolet; | |
| fill-opacity: .7; | |
| } | |
| .triangle-up{ | |
| stroke: none; | |
| fill: darkred; | |
| fill-opacity: .7; | |
| } | |
| .bubble{ | |
| fill-opacity: .3; | |
| } | |
| .bar{ | |
| stroke: none; | |
| fill: steelblue; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment