This is a design experiment for project project tomorrow. I used it as an proof of concept to grasp the usability for intermodal projections of global data. The sweet spots of the code are from Jason Davis Dorling World and Mike Bostocks Shape Tweening. Open the block in a sperate window for all of its functionality.
Last active
April 25, 2017 13:30
-
-
Save cpietsch/9b8254b1608e2fc6de58dc561d77e81f to your computer and use it in GitHub Desktop.
Geo Scatterplot Transitions
This file contains hidden or 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
| license: mit |
This file contains hidden or 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
| iso | value | |
|---|---|---|
| AFG | 3.033472553 | |
| ALB | -0.099830097 | |
| DZA | 1.940399184 | |
| ASM | 0.238404968 | |
| ADO | -4.19194055 | |
| AGO | 3.269552406 | |
| ATG | 1.011701141 | |
| ARG | 1.033055553 | |
| ARM | 0.465529171 | |
| ABW | 0.503969821 | |
| AUS | 1.565431283 | |
| AUT | 0.647909059 | |
| AZE | 1.276982804 | |
| BHS | 1.37024992 | |
| BHR | 0.92227535 | |
| BGD | 1.214377385 | |
| BRB | 0.309958314 | |
| BLR | 0.042247571 | |
| BEL | 0.378347065 | |
| BLZ | 2.159305277 | |
| BEN | 2.641076758 | |
| BMU | 0.276918817 | |
| BTN | 1.364945236 | |
| BOL | 1.545278399 | |
| BIH | -0.156496091 | |
| BWA | 1.975614057 | |
| BRA | 0.886360083 | |
| BRN | 1.422402986 | |
| BGR | -0.568389264 | |
| BFA | 2.911018317 | |
| BDI | 3.297803748 | |
| CPV | 1.302061946 | |
| KHM | 1.641596126 | |
| CMR | 2.498110306 | |
| CAN | 1.080977717 | |
| CYM | 1.366353005 | |
| CAF | 1.968283386 | |
| TCD | 3.301595089 | |
| CHI | 0.47930442 | |
| CHL | 1.057293581 | |
| CHN | 0.506311592 | |
| COL | 0.944004218 | |
| COM | 2.404550925 | |
| ZAR | 3.15317545 | |
| COG | 2.486347213 | |
| CRI | 1.081430428 | |
| CIV | 2.44243261 | |
| HRV | -0.407343185 | |
| CUB | 0.146040659 | |
| CUW | 1.324556891 | |
| CYP | 1.046142743 | |
| CZE | -0.035253542 | |
| DNK | 0.437745718 | |
| DJI | 1.335093432 | |
| DMA | 0.465548899 | |
| DOM | 1.203986962 | |
| ECU | 1.530902125 | |
| EGY | 2.218863304 | |
| SLV | 0.296162908 | |
| GNQ | 2.942546724 | |
| ERI | 2.208360412 | |
| EST | -0.330744377 | |
| ETH | 2.50680866 | |
| FRO | -0.147130465 | |
| FJI | 0.674955886 | |
| FIN | 0.451710861 | |
| FRA | 0.425985399 | |
| PYF | 1.083477045 | |
| GAB | 2.236266447 | |
| GMB | 3.231992692 | |
| GEO | 0.375919387 | |
| DEU | 0.301977923 | |
| GHA | 2.350075661 | |
| GRC | -0.635054055 | |
| GRL | -0.333398667 | |
| GRD | 0.421200052 | |
| GUM | 1.456149626 | |
| GTM | 2.048252145 | |
| GIN | 2.698294373 | |
| GNB | 2.438527521 | |
| GUY | 0.375100609 | |
| HTI | 1.340572727 | |
| HND | 1.424638087 | |
| HKG | 0.751257934 | |
| HUN | -0.317989532 | |
| ISL | 1.174491856 | |
| IND | 1.226730296 | |
| IDN | 1.260193359 | |
| IRN | 1.276545297 | |
| IRQ | 3.006160834 | |
| IRL | 0.313212277 | |
| IMY | 0.766181328 | |
| ISR | 1.914674953 | |
| ITA | 1.813714211 | |
| JAM | 0.239809415 | |
| JPN | -0.162550166 | |
| JOR | 2.250037525 | |
| KAZ | 1.479068715 | |
| KEN | 2.644121396 | |
| KIR | 1.758837015 | |
| PRK | 0.525083325 | |
| KOR | 0.405959707 | |
| KSV | 0.276387564 | |
| KWT | 4.3408509 | |
| KGZ | 1.983827978 | |
| LAO | 1.647676918 | |
| LVA | -1.113976603 | |
| LBN | 1.179986019 | |
| LSO | 1.24688598 | |
| LBR | 2.367408337 | |
| LBY | -0.111824622 | |
| LIE | 0.66195113 | |
| LTU | -0.963688184 | |
| LUX | 2.312929524 | |
| MAC | 1.720506326 | |
| MKD | 0.148595745 | |
| MDG | 2.783869737 | |
| MWI | 3.072287728 | |
| MYS | 1.470952411 | |
| MDV | 2.015181544 | |
| MLI | 2.933420467 | |
| MLT | 0.947375259 | |
| MHL | 0.211952693 | |
| MRT | 2.472382509 | |
| MUS | 0.181061469 | |
| MEX | 1.321217635 | |
| FSM | 0.313820879 | |
| MDA | -0.060885746 | |
| MCO | 0.252824448 | |
| MNG | 1.757597837 | |
| MNE | 0.09541379 | |
| MAR | 1.390819379 | |
| MOZ | 2.790970183 | |
| MMR | 0.85196116 | |
| NAM | 2.369479939 | |
| NPL | 1.213172492 | |
| NLD | 0.295621411 | |
| NCL | 1.515180502 | |
| NZL | 1.510339485 | |
| NIC | 1.141643124 | |
| NER | 4.029436517 | |
| NGA | 2.660487333 | |
| MNP | 1.23975391 | |
| NOR | 1.11300003 | |
| OMN | 8.08855916 | |
| PAK | 2.103437242 | |
| PLW | 0.847301337 | |
| PAN | 1.612187734 | |
| PNG | 2.094693178 | |
| PRY | 1.334291611 | |
| PER | 1.32499896 | |
| PHL | 1.593253248 | |
| POL | -0.117489523 | |
| PRT | -0.574471934 | |
| PRI | -1.328139143 | |
| QAT | 3.312783791 | |
| ROM | -0.364449926 | |
| RUS | 0.217632655 | |
| RWA | 2.35027091 | |
| WSM | 0.761315436 | |
| SMR | 0.64776526 | |
| STP | 2.145837472 | |
| SAU | 2.244392708 | |
| SEN | 3.125624981 | |
| SRB | -0.485590269 | |
| SYC | 1.792514345 | |
| SLE | 2.189341169 | |
| SGP | 1.297297588 | |
| SXM | 2.846525213 | |
| SVK | 0.094406353 | |
| SVN | 0.10989356 | |
| SLB | 2.027864725 | |
| SOM | 2.399954384 | |
| ZAF | 1.57611958 | |
| SSD | 3.915536494 | |
| ESP | -0.463196351 | |
| LKA | 0.758721601 | |
| KNA | 1.177184174 | |
| LCA | 0.732343757 | |
| MAF | 0.84721977 | |
| VCT | 0.030180121 | |
| SDN | 2.145269562 | |
| SUR | 0.895407485 | |
| SWZ | 1.466122343 | |
| SWE | 0.924592435 | |
| CHE | 1.239397114 | |
| SYR | 1.676527755 | |
| TJK | 2.242280464 | |
| TZA | 3.154369428 | |
| THA | 0.406217867 | |
| TMP | 2.678725623 | |
| TGO | 2.6553193 | |
| TON | 0.424250251 | |
| TTO | 0.461979352 | |
| TUN | 1.00626446 | |
| TUR | 1.221865501 | |
| TKM | 1.272383604 | |
| TCA | 1.90601644 | |
| TUV | 0.171986486 | |
| UGA | 3.25376537 | |
| UKR | -0.278913805 | |
| ARE | 0.509332471 | |
| GBR | 0.627596412 | |
| USA | 0.742746144 | |
| URY | 0.338250791 | |
| UZB | 1.686900359 | |
| VUT | 2.233477212 | |
| VEN | 1.370475368 | |
| VNM | 1.131807942 | |
| VIR | -0.542826609 | |
| WBG | 2.957994955 | |
| YEM | 2.515593122 | |
| ZMB | 3.069640155 | |
| ZWE | 2.307451177 |
This file contains hidden or 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> | |
| <html lang="en"> | |
| <head> | |
| <!-- | |
| ,-.----. ,----.. ,--. | |
| .--.--. \ / \ / / \ ,--.'| | |
| / / '. | : \ / . : ,--,: : | | |
| | : /`. / | | .\ : . / ;. \,`--.'`| ' : | |
| ; | |--` . : |: |. ; / ` ;| : : | | | |
| | : ;_ | | \ :; | ; \ ; |: | \ | : | |
| \ \ `. | : . /| : | ; | '| : ' '; | | |
| `----. \; | |`-' . | ' ' ' :' ' ;. ; | |
| __ \ \ || | ; ' ; \; / || | | \ | | |
| / /`--' /: ' | \ \ ', / ' : | ; .' | |
| '--'. / : : : ; : / | | '`--' | |
| `--'---' | | : \ \ .' ' : | | |
| `---'.| `---` ; |.' | |
| `---` '---' | |
| christopher pietsch, 2016 | |
| --> | |
| <meta charset="utf-8"> | |
| <title>Earth globe</title> | |
| <script src="https://zeigma.com/spon/globes/js/d3.v3.min.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/d3.geo.projection.v0.min.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/topojson.v1.min.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/queue.v1.min.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/colorbrewer.v1.min.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/d3.geo.zoom.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/d3-legend.js"></script> | |
| <script src="https://zeigma.com/spon/globes/js/d3.tip.v0.6.3.js"></script> | |
| </head> | |
| <style type="text/css"> | |
| body { | |
| font-family: Helvetica; | |
| } | |
| svg { | |
| /*padding: 20px;*/ | |
| clear: left; | |
| float: left; | |
| } | |
| .menu { | |
| float: left; | |
| padding: 20px; | |
| } | |
| .menu.side { | |
| width: 160px; | |
| } | |
| .menu .button { | |
| margin: 10px; | |
| padding: 0 16px; | |
| text-transform: uppercase; | |
| border: 1px solid #eee; | |
| float: left; | |
| position: relative; | |
| cursor: pointer; | |
| font-size: 12px; | |
| font-weight: bold; | |
| color:#000; | |
| background: rgba(158,158,158,.2); | |
| box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12); | |
| border-radius: 2px; | |
| text-align: center; | |
| line-height: 36px; | |
| vertical-align: middle; | |
| min-width: 64px; | |
| height: 36px; | |
| } | |
| .menu .button2 { | |
| margin: 10px; | |
| /* padding: 0 16px; */ | |
| text-transform: uppercase; | |
| border: 1px solid #eee; | |
| float: left; | |
| position: relative; | |
| cursor: pointer; | |
| font-size: 12px; | |
| font-weight: bold; | |
| color: #000; | |
| background: rgba(158,158,158,.2); | |
| box-shadow: 0 2px 2px 0 rgba(0,0,0,.14),0 3px 1px -2px rgba(0,0,0,.2),0 1px 5px 0 rgba(0,0,0,.12); | |
| border-radius: 2px; | |
| text-align: center; | |
| /* line-height: 36px; */ | |
| vertical-align: middle; | |
| min-width: 36px; | |
| /* height: 36px; */ | |
| } | |
| .menu .button2 img { | |
| } | |
| .colors { | |
| position: relative; | |
| clear: left; | |
| padding: 20px; | |
| float: left; | |
| } | |
| .colors input { | |
| width: 60px; | |
| border: none; | |
| float: left; | |
| padding: 10px; | |
| } | |
| text.label { | |
| font-size: 12px; | |
| } | |
| .water { | |
| fill: none; | |
| stroke: #000; | |
| } | |
| .d2 .water { | |
| stroke: none; | |
| } | |
| .land { | |
| fill: #888; | |
| stroke: rgba(0, 0, 0, 0.35); | |
| stroke-width: 0.7px; | |
| } | |
| .land:hover { | |
| fill:red; | |
| stroke-width: 1px; | |
| cursor: pointer; | |
| } | |
| .focused { | |
| fill: #33CC33; | |
| } | |
| .graticule { | |
| fill:none; | |
| stroke:#EEE; | |
| } | |
| .noData{ | |
| mask: url(#mask-stripe); | |
| } | |
| select { | |
| position: absolute; | |
| top: 20px; | |
| left: 580px; | |
| border: solid #ccc 1px; | |
| padding: 3px; | |
| box-shadow: inset 1px 1px 2px #ddd8dc; | |
| } | |
| .d3-tip { | |
| line-height: 1; | |
| font-weight: bold; | |
| padding: 12px; | |
| background: rgba(0, 0, 0, 0.8); | |
| color: #fff; | |
| border-radius: 2px; | |
| } | |
| /* Creates a small triangle extender for the tooltip */ | |
| .d3-tip:after { | |
| box-sizing: border-box; | |
| display: inline; | |
| font-size: 10px; | |
| width: 100%; | |
| line-height: 1; | |
| color: rgba(0, 0, 0, 0.8); | |
| content: "\25BC"; | |
| position: absolute; | |
| text-align: center; | |
| } | |
| /* Style northward tooltips differently */ | |
| .d3-tip.n:after { | |
| margin: -1px 0 0 0; | |
| top: 100%; | |
| left: 0; | |
| } | |
| .palette { | |
| padding: 20px; | |
| float: left; | |
| width: 820px; | |
| } | |
| h4 { | |
| float: left; | |
| /* clear: left; */ | |
| width: 100%; | |
| } | |
| .legendTitle { | |
| font-weight: bold; | |
| } | |
| .axis path, | |
| .axis line { | |
| fill: none; | |
| stroke: #000; | |
| shape-rendering: crispEdges; | |
| } | |
| .axis text { | |
| font-size: 11px; | |
| } | |
| </style> | |
| <body> | |
| <svg> | |
| <defs> | |
| <pattern id="pattern-stripe" | |
| width="4" height="4" | |
| patternUnits="userSpaceOnUse" | |
| patternTransform="rotate(45)"> | |
| <rect width="2" height="4" transform="translate(0,0)" fill="white"></rect> | |
| </pattern> | |
| <mask id="mask-stripe"> | |
| <rect x="0" y="0" width="100%" height="100%" fill="url(#pattern-stripe)" /> | |
| </mask> | |
| </defs> | |
| </svg> | |
| <script> | |
| var margin = {top: 20, right: 20, bottom: 40, left: 40}, | |
| width = 700 - margin.left - margin.right, | |
| height = 600 - margin.top - margin.bottom, | |
| sens = 0.25, | |
| focused; | |
| var speed = -0.1, | |
| start = 0; | |
| var datasets = [ | |
| { | |
| name: "Fleischkonsum pro Woche in kg", | |
| active: true, | |
| url : "meat.csv", | |
| unit: "kg" | |
| }, | |
| { | |
| name: "Bevölkerungswachstum 2014 in %", | |
| active: false, | |
| url : "bevolkerung.csv", | |
| unit: "%" | |
| } | |
| ]; | |
| var projections = [ | |
| { | |
| name: "globe", | |
| active: true, | |
| initialScale: 245, | |
| clipAngle: 90, | |
| geo: d3.geo.orthographic() | |
| .scale(245) | |
| .rotate([0, 0]) | |
| .translate([width / 2, height / 2]) | |
| .clipAngle(90) | |
| }, | |
| { | |
| name: "map", | |
| active: false, | |
| initialScale: (245/1.5), | |
| clipAngle: null, | |
| geo: d3.geo.winkel3() | |
| .scale(245/1.5) | |
| .translate([width / 2, height / 2]) | |
| .rotate([0, 0]) | |
| }, | |
| { | |
| name: "map", | |
| active: false, | |
| initialScale: (245/2.5), | |
| clipAngle: null, | |
| geo: d3.geo.mercator() | |
| .scale(245/2.5) | |
| .translate([width / 2, height / 2]) | |
| .rotate([0, 0]) | |
| } | |
| ]; | |
| var scales = [ | |
| { | |
| name: "linear", | |
| scale: d3.scale.linear().range([0,width]) | |
| }, | |
| { | |
| name: "linear", | |
| scale: d3.scale.linear().range([height,0]) | |
| } | |
| ]; | |
| var state = { | |
| mode: "globe", | |
| projection: projections[0], | |
| dataset: datasets[0], | |
| scale: 1, | |
| translate: [0,0], | |
| play: false, | |
| x: scales[0], | |
| y: scales[1], | |
| } | |
| var xAxis = d3.svg.axis() | |
| .scale(state.x.scale) | |
| .orient("bottom"); | |
| var yAxis = d3.svg.axis() | |
| .scale(state.y.scale) | |
| .orient("left") | |
| .tickFormat(d3.format("s")) | |
| var tip = d3.tip() | |
| .attr('class', 'd3-tip') | |
| .offset([-5, 0]) | |
| var path = d3.geo.path() | |
| .projection(state.projection.geo); | |
| var scale = 1 | |
| var translate = [0,60]; | |
| var rotate; | |
| var zoom = d3.behavior.zoom() | |
| .center([0,0]) | |
| .translate(translate) | |
| .on("zoom", function(d){ | |
| scale = d3.event.scale; | |
| translate = d3.event.translate; | |
| rotate = state.projection.geo.rotate(); | |
| // console.log("zoom", d3.event); | |
| state.projection.geo | |
| .rotate([(translate[0]/scale) * sens, -(translate[1]/scale) * sens, 0]) | |
| .scale(state.projection.initialScale * d3.event.scale) | |
| inner | |
| .selectAll("path") | |
| .attr("d", function(d) { return d.geometry ? path(d.geometry) : path(d); }); | |
| }) | |
| var menu = d3.select("body").append("div").classed("menu", true).classed("side", true); | |
| var palette = d3.select("body").append("div").classed("palette", true); | |
| palette.append("h4").text("Farbskala") | |
| var colors = palette.append("div").classed("colors", true); | |
| var colorBrewer = palette.append("div").classed("menu", true); | |
| var playButton = menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("Pause") | |
| .on("click", function(){ | |
| var d = d3.select(this); | |
| if(d.text()=="Play"){ | |
| state.play = true; | |
| d.text("Pause") | |
| } else { | |
| state.play = false; | |
| d.text("Play") | |
| } | |
| }) | |
| menu | |
| .append("h4") | |
| .text("Ansichten") | |
| menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("globus") | |
| .on("click", function(){ | |
| transform2d(0); | |
| }) | |
| // .append("img") | |
| // .attr("src", "img/globe.svg") | |
| menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("karte") | |
| .on("click", function(){ | |
| transform2d(1); | |
| }) | |
| // .append("img") | |
| // .attr("src", "img/map.svg") | |
| menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("Diagramm") | |
| .on("click", function(){ | |
| transformScatter(); | |
| }) | |
| // .append("img") | |
| // .attr("src", "img/chart.svg") | |
| //setTimeout(transformScatter, 800); | |
| var graticule = d3.geo.graticule(); | |
| var svg = d3.select("svg") | |
| .attr("width", width + margin.left + margin.right) | |
| .attr("height", height + margin.top + margin.bottom) | |
| .call(zoom) | |
| .call(tip) | |
| .append("g") | |
| .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); | |
| var axis = svg.append("g").style("opacity", 0); | |
| var inner = svg.append("g"); | |
| var outer = svg.append("g"); | |
| outer.append("path") | |
| .datum({type: "Sphere"}) | |
| .attr("class", "water") | |
| .attr("d", path) | |
| inner.append("path") | |
| .datum(graticule()) | |
| .attr("class", "graticule") | |
| .attr("d", path); | |
| axis.append("g") | |
| .attr("class", "x axis") | |
| .attr("transform", "translate(0," + height + ")") | |
| .call(xAxis) | |
| .append("text") | |
| .attr("class", "label") | |
| .attr("x", width) | |
| .attr("y", -6) | |
| .style("text-anchor", "end") | |
| // .text("fleischkonsum (kg/woche)"); | |
| axis.append("g") | |
| .attr("class", "y axis") | |
| .call(yAxis) | |
| .append("text") | |
| .attr("class", "label") | |
| .attr("transform", "rotate(-90)") | |
| .attr("y", 6) | |
| .attr("dy", ".71em") | |
| .style("text-anchor", "end") | |
| // .text("population") | |
| var colorScaleAbs = d3.scale.quantile().range(colorbrewer.Oranges[9]); | |
| var colorScaleDiverging = d3.scale.quantile().range(colorbrewer.BrBG[9]); | |
| var colorScale; | |
| var dataMap; | |
| var reverseCountryMap = {}; | |
| var isoCodesMap; | |
| var globalDataMap; | |
| var transform2d = function(id){ | |
| console.log("transform"); | |
| state.play = false; | |
| playButton.text("Play"); | |
| if(id == 0){ | |
| inner.selectAll(".graticule").transition().style("opacity", 1); | |
| } | |
| if(id == 1){ | |
| outer.selectAll(".water").transition().style("opacity", 0); | |
| } | |
| if(state.mode == "scatter"){ | |
| state.projection = projections[id]; | |
| path.projection(state.projection.geo); | |
| state.mode = "map"+id; | |
| transformScatterBack(); | |
| return; | |
| } | |
| state.mode = "map"+id; | |
| var b = projections[id]; | |
| var a = projections[(id+1)>1 ? 0:1]; | |
| svg | |
| .call(zoom.scale(scale).translate(translate).event) | |
| .transition() | |
| .duration(function() { | |
| var distance = (Math.abs(translate[0])+Math.abs(translate[1])); | |
| return distance*2; | |
| }) | |
| .call(zoom.scale(1).translate([0,0]).event) | |
| .each("end", function(){ | |
| inner.selectAll("path") | |
| .transition() | |
| .duration(1000) | |
| // .ease("circle-out") | |
| // .attrTween("d", projectionTween(active(projections).geo, inactive(projections).geo)) | |
| .attrTween("d", geoUtils.projectionTween(a.geo, b.geo)) | |
| .each("end", function(d,i){ | |
| if(i!=0) return; | |
| state.projection = b; | |
| path.projection(state.projection.geo); | |
| if(id == 0){ | |
| outer.selectAll(".water").transition().style("opacity", 1); | |
| //zoom.event(svg); | |
| } | |
| }) | |
| }) | |
| } | |
| var transformScatterBack = function (callback) { | |
| axis.transition().duration(1000).style("opacity", 0); | |
| //inner.selectAll(".graticule").transition().style("opacity", 1); | |
| inner.selectAll(".land") | |
| .transition() | |
| .ease("cubic-out") | |
| .duration(800) | |
| .attr("d", function (d) { | |
| return geoUtils.pathCircle(d.dorling.centroid[0], d.dorling.centroid[1], d.dorling.radius); | |
| }) | |
| .each("end", function(d) { | |
| // console.log(d) | |
| d3.select(this).attr("d", "M" + d.dorling.coordinates.join("L") + "Z"); | |
| }) | |
| .transition() | |
| .duration(500) | |
| .ease("cubic") | |
| .attr("d", function(d) { return path(d.geometry); }) | |
| .each("end",function (d,i) { | |
| if(i==0 && callback){ | |
| console.log("end", i); | |
| callback(); | |
| } | |
| }) | |
| } | |
| var transformScatter = function(){ | |
| console.log("transformScatter"); | |
| state.mode = "scatter"; | |
| state.projection.geo.clipAngle(null); | |
| outer.selectAll(".water").transition().style("opacity", 0); | |
| inner.selectAll(".graticule").transition().style("opacity", 0); | |
| axis.transition().duration(1000).style("opacity", 1); | |
| inner.selectAll(".land") | |
| .transition() | |
| .ease("cubic-out") | |
| .duration(800) | |
| .attr("d", function(d) { | |
| d.dorling = geoUtils.dorling(d.geometry); | |
| return "M" + d.dorling.coordinates.join("L") + "Z"; | |
| }) | |
| .each("end", function(d) { | |
| d = d.dorling; | |
| d3.select(this).attr("d", geoUtils.pathCircle(d.centroid[0], d.centroid[1], d.radius)); | |
| }) | |
| .transition() | |
| .duration(1500) | |
| .ease("cubic-out") | |
| .attr("d", function (d) { | |
| var yVal = globalDataMap.get(d.iso); | |
| var xVal = state.dataset.map.get(d.iso) | |
| // todo clean that data !! | |
| if(!yVal || !yVal.gdp || !xVal || !xVal.value){ | |
| // return pathCircle(d.dorling.centroid[0], d.dorling.centroid[1], 0); | |
| return; | |
| }; | |
| var x = state.x.scale(xVal.value); | |
| var y = state.y.scale(yVal.gdp); | |
| return geoUtils.pathCircle(x, y, 5) | |
| }) | |
| state.projection.geo.clipAngle(state.projection.clipAngle); | |
| } | |
| queue() | |
| .defer(d3.json, "world-110m.json") | |
| // .defer(d3.json, "data/world-50m.json") | |
| .defer(d3.csv, "iso3166.csv") | |
| .defer(d3.csv, datasets[0].url) | |
| .defer(d3.csv, datasets[1].url) | |
| .await(ready); | |
| function ready(error, world, isoCodes, ds1, ds2) { | |
| datasets[0].data = ds1; | |
| datasets[0].data.forEach(function(d){ d.value *= 1; }); | |
| datasets[0].map = d3.map(datasets[0].data, function(d){ return d.iso; }); | |
| datasets[1].data = ds2; | |
| datasets[1].data.forEach(function(d){ d.value *= 1; }); | |
| datasets[1].map = d3.map(datasets[1].data, function(d){ return d.iso; }); | |
| isoCodes.forEach(function(d){ d.numeric *= 1; d.population *= 1; d.gdp *= 1; }); | |
| isoCodesMap = d3.map(isoCodes, function(d){ return d.numeric; }); | |
| globalDataMap = d3.map(isoCodes, function(d){ return d.alpha3; }); | |
| // filter out antarctica | |
| world.objects.countries.geometries = world.objects.countries.geometries.filter(function(d) { return d.id != 10; }); | |
| var land = { | |
| type: "GeometryCollection", | |
| geometries: geoUtils.polygons(world.objects.countries.geometries) | |
| }; | |
| var nodes = topojson.feature(world, land).features.map(function(d) { | |
| //exterior(d.geometry); | |
| //var centroid = path.centroid(d.geometry); | |
| var iso = isoCodesMap.get(d.id); | |
| return { | |
| iso: reverseCountryMap[d.id], | |
| // x: centroid[0], | |
| // y: centroid[1], | |
| // ox: centroid[0], | |
| // oy: centroid[1], | |
| geometry: d.geometry, | |
| //dorling: dorling(d.geometry) | |
| }; | |
| }); | |
| console.log(nodes[0]); | |
| var populationExtent = d3.extent(datasets[1].data, function(d){ return d.value; }); | |
| var max = Math.max(Math.abs(populationExtent[0]), Math.abs(populationExtent[1])); | |
| console.log(populationExtent, max); | |
| colorScaleDiverging | |
| .domain([-max,max]) | |
| colorScaleAbs | |
| .domain([0, d3.max(datasets[0].data, function(d){ return d.value; })]) | |
| colorScale = colorScaleAbs; | |
| var getColor = function(d){ | |
| var entry = state.dataset.map.get(d.iso); | |
| return entry ? colorScale(entry.value) : "#B5B5B5"; | |
| } | |
| state.x.scale.domain(d3.extent(state.dataset.data, function(d) { return d.value; })); | |
| state.y.scale.domain(d3.extent(isoCodes, function(d) { return d.gdp; })); | |
| axis.select(".x.axis").call(xAxis); | |
| axis.select(".y.axis").call(yAxis); | |
| //console.log(state.x.scale.domain()); | |
| tip.html(function(d) { | |
| //console.log(d, isoCodesMap.get(d.id).name_deu,meatMap.get(d.iso).value) | |
| var map = state.dataset.map.get(d.iso); | |
| var val = map ? map.value : "n.v." | |
| return "<strong>"+ globalDataMap.get(d.iso).name_deu +"</strong> <span style='color:red'>" + val + "</span>"; | |
| }) | |
| var world = inner.selectAll("path.land") | |
| .data(nodes) | |
| .enter() | |
| .append("path") | |
| .attr("class", "land") | |
| .attr("d", function(d) { return path(d.geometry); }) | |
| .style("fill", getColor) | |
| .classed("noData", function(d){ return !state.dataset.map.get(d.iso); }) | |
| .on('mouseover', tip.show) | |
| .on('mousemove', tip.show) | |
| .on('mouseout', tip.hide) | |
| // var world = inner.selectAll("path.land") | |
| // .data(countries) | |
| // .enter() | |
| // .append("path") | |
| // .attr("class", "land") | |
| // .attr("d", path) | |
| // .style("fill", getColor) | |
| // .classed("noData", function(d){ return !active(datasets).map.get(d.iso); }) | |
| // .on('mouseover', tip.show) | |
| // .on('mousemove', tip.show) | |
| // .on('mouseout', tip.hide) | |
| var colorRange = colorScale.range(); | |
| colors | |
| .selectAll("input") | |
| .data(colorRange) | |
| .enter() | |
| .append("input") | |
| .attr("value", function(d){ return d; }) | |
| .style("background", function(d){ return d; }) | |
| .on("input", function(d,i){ | |
| d3.select(this).style("background",this.value); | |
| colorRange[i] = this.value; | |
| colorScale.range(colorRange); | |
| updateColors(); | |
| }) | |
| menu | |
| .append("h4") | |
| .text("Daten") | |
| menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("Fleischkonsum") | |
| .on("click", function(){ | |
| state.dataset = datasets[0]; | |
| colorScale = colorScaleAbs; | |
| colorRange = colorScale.range(); | |
| updateColors(); | |
| }) | |
| menu | |
| .append("div") | |
| .classed("button", true) | |
| .text("Bevölkerungswachstum") | |
| .on("click", function(){ | |
| state.dataset = datasets[1]; | |
| colorScale = colorScaleDiverging; | |
| colorRange = colorScale.range(); | |
| updateColors(); | |
| }) | |
| var updateColors = function(){ | |
| inner | |
| .selectAll("path.land") | |
| .classed("noData", function(d){ return !state.dataset.map.get(d.iso); }) | |
| .transition() | |
| .style("fill", getColor) | |
| legend | |
| .scale(colorScale) | |
| .title(state.dataset.name) | |
| svg.select(".legendQuant") | |
| .call(legend); | |
| colors | |
| .selectAll("input") | |
| .data(colorRange) | |
| .style("background", function(d){ return d; }) | |
| .attr("value", function(d){ return d; }) | |
| state.x.scale.domain(d3.extent(state.dataset.data, function(d) { return d.value; })); | |
| state.y.scale.domain(d3.extent(isoCodes, function(d) { return d.gdp; })); | |
| axis.select(".x.axis").call(xAxis); | |
| axis.select(".y.axis").call(yAxis); | |
| } | |
| var cbrew = d3.entries(colorbrewer).filter(function(d){ return d.value[9]; }); | |
| colorBrewer | |
| .selectAll("div") | |
| .data(cbrew) | |
| .enter() | |
| .append("div") | |
| .classed("button", true) | |
| .text(function(d){ return d.key; }) | |
| .on("click", function(d){ | |
| colorRange = colorbrewer[d.key][9]; | |
| colorScale.range(colorRange) | |
| updateColors(); | |
| }) | |
| svg.append("g") | |
| .attr("class", "legendQuant") | |
| .attr("transform", "translate(10,10)"); | |
| axis.select(".x.axis").call(xAxis); | |
| axis.select(".y.axis").call(yAxis); | |
| var legend = d3.legend.color() | |
| .labelFormat(d3.format(".2f")) | |
| .useClass(false) | |
| .labelFormat(function(d){ return d3.format("f")(d); }) | |
| .scale(colorScale) | |
| //.orient("horizontal") | |
| .title("Fleischkonsum pro Woche in kg") | |
| svg.select(".legendQuant") | |
| .call(legend); | |
| zoom.event(svg); | |
| d3.timer(function() { | |
| if(state.play){ | |
| // active(projections).geo | |
| // .rotate([speed * start++, -15]) | |
| // svg.selectAll("path").attr("d", path) | |
| zoom.translate([translate[0]+((5)*speed), translate[1]]).event(svg); | |
| } | |
| }) | |
| }; | |
| var geoUtils = {}; | |
| geoUtils.exterior = function(d) { | |
| // From Jason Davis https://www.jasondavies.com/maps/dorling-world/ | |
| switch (d.type) { | |
| case "Polygon": d.coordinates = [d.coordinates[0]]; break; | |
| case "MultiPolygon": d.coordinates = [[d.coordinates[0][0]]]; break; | |
| } | |
| return d; | |
| } | |
| geoUtils.projectRing = function(coordinates) { | |
| // From Jason Davis https://www.jasondavies.com/maps/dorling-world/ | |
| var ring = []; | |
| d3.geo.stream({type: "Polygon", coordinates: [coordinates]}, state.projection.geo.stream({ | |
| point: function(x, y) { ring.push([x, y]); }, | |
| lineStart: geoUtils.noop, | |
| lineEnd: geoUtils.noop, | |
| polygonStart: geoUtils.noop, | |
| polygonEnd: geoUtils.noop, | |
| sphere: geoUtils.noop | |
| })); | |
| ring.push(ring[0]); | |
| return ring; | |
| } | |
| geoUtils.dorling = function(d) { | |
| // From Jason Davis https://www.jasondavies.com/maps/dorling-world/ | |
| switch (d.type) { | |
| case "Polygon": return geoUtils.circle(geoUtils.projectRing(d.coordinates[0])); | |
| case "MultiPolygon": return geoUtils.circle(geoUtils.projectRing(d.coordinates[0][0])); | |
| } | |
| return {radius: 0, coordinates: []}; | |
| } | |
| geoUtils.circle = function(coordinates) { | |
| // From Mike Bostock’s http://bl.ocks.org/3081153 | |
| var circle = [], | |
| length = 0, | |
| lengths = [length], | |
| polygon = d3.geom.polygon(coordinates), | |
| p0 = coordinates[0], | |
| p1, | |
| x, | |
| y, | |
| i = 0, | |
| n = coordinates.length - 1; | |
| // Compute the distances of each coordinate. | |
| while (++i < n) { | |
| p1 = coordinates[i]; | |
| x = p1[0] - p0[0]; | |
| y = p1[1] - p0[1]; | |
| lengths.push(length += Math.sqrt(x * x + y * y)); | |
| p0 = p1; | |
| } | |
| var area = polygon.area(), | |
| radius = Math.sqrt(Math.abs(area) / Math.PI), | |
| centroid = polygon.centroid(-1 / (6 * area)), | |
| angleOffset = Math.atan2(coordinates[0][1] - centroid[1], coordinates[0][0] - centroid[0]), | |
| angle, | |
| i = -1, | |
| k = 2 * Math.PI / length; | |
| // Compute points along the circle’s circumference at equivalent distances. | |
| while (++i < n) { | |
| angle = angleOffset + lengths[i] * k; | |
| circle.push([ | |
| centroid[0] + radius * Math.cos(angle), | |
| centroid[1] + radius * Math.sin(angle) | |
| ]); | |
| } | |
| return {coordinates: circle, radius: radius, centroid: centroid}; | |
| } | |
| geoUtils.polygons = function(geometries) { | |
| // From Jason Davis https://www.jasondavies.com/maps/dorling-world/ | |
| var id = 0; | |
| return d3.merge(geometries.map(function(geometry) { | |
| var iso = isoCodesMap.get(geometry.id); | |
| var isoName = iso ? iso.alpha3 : ""; | |
| return (geometry.type === "MultiPolygon" ? geometry.arcs : [geometry.arcs]).map(function(d) { | |
| reverseCountryMap[++id] = isoName; | |
| return {id: id, type: "Polygon", arcs: d, parent: geometry}; | |
| }); | |
| })); | |
| } | |
| geoUtils.collide = function(node) { | |
| // From http://mbostock.github.com/d3/talk/20111018/collision.html | |
| var r = node.radius, | |
| nx1 = node.x - r, | |
| nx2 = node.x + r, | |
| ny1 = node.y - r, | |
| ny2 = node.y + r; | |
| return function(quad, x1, y1, x2, y2) { | |
| if (quad.point && (quad.point !== node)) { | |
| var x = node.x - quad.point.x, | |
| y = node.y - quad.point.y, | |
| l = Math.sqrt(x * x + y * y), | |
| r = node.dorling.radius + quad.point.dorling.radius; | |
| if (l < r) { | |
| l = (l - r) / l * .5; | |
| node.x -= x *= l; | |
| node.y -= y *= l; | |
| quad.point.x += x; | |
| quad.point.y += y; | |
| } | |
| } | |
| return x1 > nx2 | |
| || x2 < nx1 | |
| || y1 > ny2 | |
| || y2 < ny1; | |
| }; | |
| } | |
| geoUtils.noop = function() {} | |
| geoUtils.pathCircle = function(x, y, radius) { | |
| return "M" + x + "," + (y + radius) | |
| + "a" + radius + "," + radius + " 0 1,1 0," + -2 * radius | |
| + "a" + radius + "," + radius + " 0 1,1 0," + 2 * radius | |
| + "z"; | |
| } | |
| geoUtils.projectionTween = function(projection0, projection1) { | |
| // by Mike Bostock | |
| return function(d) { | |
| var t = 0; | |
| var projection = d3.geo.projection(project) | |
| .scale(1) | |
| .translate([width / 2, height / 2]); | |
| var path = d3.geo.path() | |
| .projection(projection); | |
| function project(λ, φ) { | |
| λ *= 180 / Math.PI, φ *= 180 / Math.PI; | |
| var p0 = projection0([λ, φ]), p1 = projection1([λ, φ]); | |
| var x = (1 - t) * p0[0] + t * p1[0]; | |
| var y = (1 - t) * -p0[1] + t * -p1[1]; | |
| // hacky error workaround | |
| if(x == Infinity || x == -Infinity ) x = -height-1; | |
| if(y == Infinity || y == -Infinity) y = -height-1; | |
| if(isNaN(x)) x = -height; | |
| if(isNaN(y)) y = -height; | |
| return [x, y]; | |
| } | |
| return function(_) { | |
| t = _; | |
| return d.geometry ? path(d.geometry) : path(d); | |
| }; | |
| }; | |
| } | |
| </script> | |
| </body> | |
| </html> |
This file contains hidden or 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
| numeric | alpha3 | name | gdp | population | name_deu | |
|---|---|---|---|---|---|---|
| 4 | AFG | Afghanistan | 21121935456 | 31627506 | Afghanistan | |
| 8 | ALB | Albania | 13413053494 | 2889676 | Albanien | |
| 12 | DZA | Algeria | 2.13518E11 | 38934334 | Algerien | |
| 16 | ASM | American,Samoa | #NV | #NV | Amerikanisch-Samoa | |
| 20 | AND | Andorra | #NV | #NV | Andorra | |
| 24 | AGO | Angola | 1.46676E11 | 24227524 | Angola | |
| 660 | AIA | Anguilla | 3.107929774E8 | 14460 | Anguilla | |
| 10 | ATA | Antarctica | #NV | #NV | Antarktika (Sonderstatus durch Antarktis-Vertrag) | |
| 28 | ATG | Antigua,and,Barbuda | 1248153953 | 90900 | Antigua und Barbuda | |
| 32 | ARG | Argentina | 5.4349E11 | 42980026 | Argentinien | |
| 51 | ARM | Armenia | 10888813703 | 3006154 | Armenien | |
| 533 | ABW | Aruba | 2663687151 | 103441 | Aruba | |
| 36 | AUS | Australia | 1.47144E12 | 23622353 | Australien | |
| 40 | AUT | Austria | 4.36888E11 | 8516916 | Österreich | |
| 31 | AZE | Azerbaijan | 75193456982 | 9629779 | Aserbaidschan | |
| 44 | BHS | Bahamas | 8510495770 | 383054 | Bahamas | |
| 48 | BHR | Bahrain | 33849994572 | 1361930 | Bahrain | |
| 50 | BGD | Bangladesh | 1.73062E11 | 159077513 | Bangladesch | |
| 52 | BRB | Barbados | 4352750000 | 283380 | Barbados | |
| 112 | BLR | Belarus | 76139252027 | 9500422 | Belarus (Weißrussland) | |
| 56 | BEL | Belgium | 5.31547E11 | 11226322 | Belgien | |
| 84 | BLZ | Belize | 1699150000 | 351706 | Belize | |
| 204 | BEN | Benin | 9575264608 | 10598482 | Benin | |
| 60 | BMU | Bermuda | 5601074000 | 62376 | Bermuda | |
| 64 | BTN | Bhutan | 1965048927 | 765008 | Bhutan | |
| 68 | BOL | Bolivia,,Plurinational,State,of | 32996188013 | 10561887 | Bolivien | |
| 535 | BES | Bonaire,,Sint,Eustatius,and,Saba | #NV | #NV | Bonaire, Sint Eustatius und Saba (Niederlande) | |
| 70 | BIH | Bosnia,and,Herzegovina | 18490920340 | 3817554 | Bosnien und Herzegowina | |
| 72 | BWA | Botswana | 15813393709 | 2219937 | Botswana | |
| 74 | BVT | Bouvet,Island | #NV | #NV | Bouvetinsel | |
| 76 | BRA | Brazil | 2.34652E12 | 206077898 | Brasilien | |
| 86 | IOT | British,Indian,Ocean,Territory | #NV | #NV | Britisches Territorium im Indischen Ozean | |
| 96 | BRN | Brunei,Darussalam | 17104193944 | 417394 | Brunei Darussalam | |
| 100 | BGR | Bulgaria | 56717843383 | 7201308 | Bulgarien | |
| 854 | BFA | Burkina,Faso | 12755524612 | 17589198 | Burkina Faso | |
| 108 | BDI | Burundi | 2868836461 | 10816860 | Burundi | |
| 116 | KHM | Cambodia | 16777820333 | 15328136 | Kambodscha | |
| 120 | CMR | Cameroon | 32050820689 | 22773014 | Kamerun | |
| 124 | CAN | Canada | 1.78539E12 | 35587793 | Kanada | |
| 132 | CPV | Cape,Verde | 1854766969 | 513906 | Kap Verde | |
| 136 | CYM | Cayman,Islands | 3479801474 | 59172 | Kaimaninseln | |
| 140 | CAF | Central,African,Republic | 1838020266 | 4804316 | Zentralafrikanische Republik | |
| 148 | TCD | Chad | 12790697438 | 13587053 | Tschad | |
| 152 | CHL | Chile | 2.58062E11 | 17762647 | Chile | |
| 156 | CHN | China | 1.04306E13 | 1369435670 | China, Volksrepublik | |
| 162 | CXR | Christmas,Island | #NV | #NV | Weihnachtsinsel | |
| 166 | CCK | Cocos,(Keeling),Islands | #NV | #NV | Kokosinseln | |
| 170 | COL | Colombia | 3.7774E11 | 47791393 | Kolumbien | |
| 174 | COM | Comoros | 6.477201025E8 | 769991 | Komoren | |
| 178 | COG | Congo | 14077122976 | 4504962 | Republik Kongo | |
| 180 | COD | Congo,,the,Democratic,Republic,of,the | 35909377660 | 74877030 | Kongo, Demokratische Republik (ehem. Zaire) | |
| 184 | COK | Cook,Islands | 310927296 | 20725 | Cookinseln | |
| 188 | CRI | Costa,Rica | 49552580543 | 4757606 | Costa Rica | |
| 191 | HRV | Croatia | 57136585614 | 4255853 | Kroatien | |
| 192 | CUB | Cuba | 82775000000 | 11379111 | Kuba | |
| 531 | CUW | Curaçao | 3159299887 | 155763 | Curaçao | |
| 196 | CYP | Cyprus | 23076808670 | 882577 | Zypern | |
| 203 | CZE | Czech,Republic | 2.0527E11 | 10542666 | Tschechische Republik | |
| 384 | CIV | Côte,d'Ivoire | 34254020640 | 22157107 | Côte d’Ivoire (Elfenbeinküste) | |
| 208 | DNK | Denmark | 3.46119E11 | 5646899 | Dänemark | |
| 262 | DJI | Djibouti | 1589025860 | 876174 | Dschibuti | |
| 212 | DMA | Dominica | 5.325157752E8 | 72341 | Dominica | |
| 214 | DOM | Dominican,Republic | 63968961566 | 10405943 | Dominikanische Republik | |
| 218 | ECU | Ecuador | 1.00917E11 | 15902916 | Ecuador | |
| 818 | EGY | Egypt | 2.82242E11 | 89579670 | Ägypten | |
| 222 | SLV | El,Salvador | 25163714670 | 6107706 | El Salvador | |
| 226 | GNQ | Equatorial,Guinea | 16731073670 | 820885 | Äquatorialguinea | |
| 232 | ERI | Eritrea | 3857795410 | 5110444 | Eritrea | |
| 233 | EST | Estonia | 26485155278 | 1316203 | Estland | |
| 231 | ETH | Ethiopia | 53638456999 | 96958732 | Äthiopien | |
| 238 | FLK | Falkland,Islands,(Malvinas) | #NV | #NV | Falklandinseln | |
| 234 | FRO | Faroe,Islands | #NV | #NV | Färöer | |
| 242 | FJI | Fiji | 4531698547 | 886450 | Fidschi | |
| 246 | FIN | Finland | 2.72217E11 | 5479660 | Finnland | |
| 250 | FRA | France | 2.82919E12 | 66100168 | Frankreich | |
| 254 | GUF | French,Guiana | #NV | #NV | Französisch-Guayana | |
| 258 | PYF | French,Polynesia | 5623186216 | 279781 | Französisch-Polynesien | |
| 260 | ATF | French,Southern,Territories | #NV | #NV | Französische Süd- und Antarktisgebiete | |
| 266 | GAB | Gabon | 17412499258 | 1687673 | Gabun | |
| 270 | GMB | Gambia | 850958281 | 1928201 | Gambia | |
| 268 | GEO | Georgia | 16530275226 | 4034774 | Georgien | |
| 276 | DEU | Germany | 3.86829E12 | 80646262 | Deutschland | |
| 288 | GHA | Ghana | 37176593579 | 26786598 | Ghana | |
| 292 | GIB | Gibraltar | #NV | #NV | Gibraltar | |
| 300 | GRC | Greece | 2.35574E11 | 11000777 | Griechenland | |
| 304 | GRL | Greenland | 2441226080 | 56211 | Grönland | |
| 308 | GRD | Grenada | 8.840407407E8 | 106349 | Grenada | |
| 312 | GLP | Guadeloupe | #NV | #NV | Guadeloupe | |
| 316 | GUM | Guam | #NV | #NV | Guam | |
| 320 | GTM | Guatemala | 58826840956 | 16015494 | Guatemala | |
| 831 | GGY | Guernsey | #NV | #NV | Guernsey (Kanalinsel) | |
| 324 | GIN | Guinea | 6578775676 | 12275527 | Guinea | |
| 624 | GNB | Guinea-Bissau | 1209484051 | 1800513 | Guinea-Bissau | |
| 328 | GUY | Guyana | 3085834784 | 763893 | Guyana | |
| 332 | HTI | Haiti | 8598928793 | 10572029 | Haiti | |
| 334 | HMD | Heard,Island,and,McDonald,Islands | #NV | #NV | Heard und McDonaldinseln | |
| 336 | VAT | Holy,See,(Vatican,City,State) | #NV | #NV | Vatikanstadt | |
| 340 | HND | Honduras | 19497198190 | 7961680 | Honduras | |
| 344 | HKG | Hong,Kong | 2.90896E11 | 7226869 | Hongkong | |
| 348 | HUN | Hungary | 1.38347E11 | 9889540 | Ungarn | |
| 352 | ISL | Iceland | 17036097482 | 327318 | Island | |
| 356 | IND | India | 2.05494E12 | 1295291543 | Indien | |
| 360 | IDN | Indonesia | 8.88538E11 | 254454778 | Indonesien | |
| 364 | IRN | Iran,,Islamic,Republic,of | 4.25326E11 | 78143644 | Iran, Islamische Republik | |
| 368 | IRQ | Iraq | 2.25422E11 | 35273293 | Irak | |
| 372 | IRL | Ireland | 2.50814E11 | 4675164 | Irland | |
| 833 | IMN | Isle,of,Man | #NV | #NV | Insel Man | |
| 376 | ISR | Israel | 3.05673E11 | 7939483 | Israel | |
| 380 | ITA | Italy | 2.14116E12 | 59788667 | Italien | |
| 388 | JAM | Jamaica | 13927105740 | 2783301 | Jamaika | |
| 392 | JPN | Japan | 4.60242E12 | 126794564 | Japan | |
| 832 | JEY | Jersey | #NV | #NV | Jersey (Kanalinsel) | |
| 400 | JOR | Jordan | 35826901408 | 7416083 | Jordanien | |
| 398 | KAZ | Kazakhstan | 2.16036E11 | 17371621 | Kasachstan | |
| 404 | KEN | Kenya | 60936427713 | 44863583 | Kenia | |
| 296 | KIR | Kiribati | 1.802739448E8 | 110470 | Kiribati | |
| 408 | PRK | Korea,,Democratic,People's,Republic,of | 17395832618 | 24997874 | Korea, Demokratische Volksrepublik (Nordkorea) | |
| 410 | KOR | Korea,,Republic,of | 1.41038E12 | 50074401 | Korea, Republik (Südkorea) | |
| 414 | KWT | Kuwait | 1.63637E11 | 3753121 | Kuwait | |
| 417 | KGZ | Kyrgyzstan | 7404418463 | 5843617 | Kirgisistan | |
| 418 | LAO | Lao,People's,Democratic,Republic | 11749111245 | 6689300 | Laos, Demokratische Volksrepublik | |
| 428 | LVA | Latvia | 31285533217 | 1989354 | Lettland | |
| 422 | LBN | Lebanon | 49630856940 | 5612096 | Libanon | |
| 426 | LSO | Lesotho | 2080536397 | 2109197 | Lesotho | |
| 430 | LBR | Liberia | 2122000000 | 4396554 | Liberia | |
| 434 | LBY | Libya | 41319258101 | 6258984 | Libyen | |
| 438 | LIE | Liechtenstein | 5855392374 | 37286 | Liechtenstein | |
| 440 | LTU | Lithuania | 48392319442 | 2916798 | Litauen | |
| 442 | LUX | Luxembourg | 64873963098 | 556573 | Luxemburg | |
| 446 | MAC | Macao | 55501545048 | 577914 | Macau | |
| 807 | MKD | Macedonia,,the,Former,Yugoslav,Republic,of | 11318959431 | 2075625 | Mazedonien | |
| 450 | MDG | Madagascar | 10673517838 | 23571713 | Madagaskar | |
| 454 | MWI | Malawi | 5720080522 | 16695253 | Malawi | |
| 458 | MYS | Malaysia | 3.26933E11 | 29901997 | Malaysia | |
| 462 | MDV | Maldives | 3032239478 | 357415 | Malediven | |
| 466 | MLI | Mali | 11978738474 | 17086022 | Mali | |
| 470 | MLT | Malta | 10535990657 | 417723 | Malta | |
| 584 | MHL | Marshall,Islands | 208814181 | 52898 | Marshallinseln | |
| 474 | MTQ | Martinique | #NV | #NV | Martinique | |
| 478 | MRT | Mauritania | 5092179849 | 3969625 | Mauretanien | |
| 480 | MUS | Mauritius | 12616414222 | 1268567 | Mauritius | |
| 175 | MYT | Mayotte | #NV | #NV | Mayotte | |
| 484 | MEX | Mexico | 1.29469E12 | 125385833 | Mexiko | |
| 583 | FSM | Micronesia,,Federated,States,of | 308000000 | 104044 | Mikronesien | |
| 498 | MDA | Moldova,,Republic,of | 7944167914 | 4072340 | Moldawien (Republik Moldau) | |
| 492 | MCO | Monaco | 7059948256 | 37623 | Monaco | |
| 496 | MNG | Mongolia | 12067051157 | 2909871 | Mongolei | |
| 499 | MNE | Montenegro | 4587741791 | 625292 | Montenegro | |
| 500 | MSR | Montserrat | 6.308518519E7 | 5094 | Montserrat | |
| 504 | MAR | Morocco | 1.10009E11 | 33921203 | Marokko | |
| 508 | MOZ | Mozambique | 17080913408 | 27216276 | Mosambik | |
| 104 | MMR | Myanmar | 66477754856 | 53437159 | Myanmar (Burma) | |
| 516 | NAM | Namibia | 13429307309 | 2402858 | Namibia | |
| 520 | NRU | Nauru | 181710650 | 10176 | Nauru | |
| 524 | NPL | Nepal | 19489214387 | 28174724 | Nepal | |
| 528 | NLD | Netherlands | 8.79319E11 | 16868020 | Niederlande | |
| 540 | NCL | New,Caledonia | 10233914888 | 259800 | Neukaledonien | |
| 554 | NZL | New,Zealand | 1.98652E11 | 4495482 | Neuseeland | |
| 558 | NIC | Nicaragua | 11805641121 | 6013913 | Nicaragua | |
| 562 | NER | Niger | 8168698935 | 19113728 | Niger | |
| 566 | NGA | Nigeria | 5.68499E11 | 177475986 | Nigeria | |
| 570 | NIU | Niue | #NV | #NV | Niue | |
| 574 | NFK | Norfolk,Island | #NV | #NV | Norfolkinsel | |
| 580 | MNP | Northern,Mariana,Islands | #NV | #NV | Nördliche Marianen | |
| 578 | NOR | Norway | 5.00519E11 | 5147970 | Norwegen | |
| 512 | OMN | Oman | 81796618986 | 4236057 | Oman | |
| 586 | PAK | Pakistan | 2.51255E11 | 185044286 | Pakistan | |
| 585 | PLW | Palau | 233500000 | 21097 | Palau | |
| 275 | PSE | Palestine,,State,of | 12765800000 | 4542059 | Palästina | |
| 591 | PAN | Panama | 49166000000 | 3867535 | Panama | |
| 598 | PNG | Papua,New,Guinea | 16576155295 | 7463577 | Papua-Neuguinea | |
| 600 | PRY | Paraguay | 30984748095 | 6552518 | Paraguay | |
| 604 | PER | Peru | 2.01809E11 | 30973148 | Peru | |
| 608 | PHL | Philippines | 2.84582E11 | 99138690 | Philippinen | |
| 612 | PCN | Pitcairn | #NV | #NV | Pitcairninseln | |
| 616 | POL | Poland | 5.44959E11 | 38619974 | Polen | |
| 620 | PRT | Portugal | 2.30117E11 | 10402343 | Portugal | |
| 630 | PRI | Puerto,Rico | 1.03676E11 | 3686517 | Puerto Rico | |
| 634 | QAT | Qatar | 2.11817E11 | 2172065 | Katar | |
| 642 | ROU | Romania | 1.38347E11 | 9889540 | Rumänien | |
| 643 | RUS | Russian,Federation | 1.84994E12 | 143429435 | Russische Föderation | |
| 646 | RWA | Rwanda | 7903362002 | 11341544 | Ruanda | |
| 638 | REU | Réunion | #NV | #NV | Réunion | |
| 652 | BLM | Saint,Barthélemy | #NV | #NV | Saint-Barthélemy | |
| 654 | SHN | Saint,Helena,,Ascension,and,Tristan,da,Cunha | #NV | #NV | St. Helena | |
| 659 | KNA | Saint,Kitts,and,Nevis | #NV | #NV | St. Kitts und Nevis | |
| 662 | LCA | Saint,Lucia | 1405794281 | 183645 | St. Lucia | |
| 663 | MAF | Saint,Martin,(French,part) | #NV | #NV | Saint-Martin (franz. Teil) | |
| 666 | SPM | Saint,Pierre,and,Miquelon | #NV | #NV | Saint-Pierre und Miquelon | |
| 670 | VCT | Saint,Vincent,and,the,Grenadines | 7.293093844E8 | 109360 | St. Vincent und die Grenadinen | |
| 882 | WSM | Samoa | 8.237238147E8 | 191845 | Samoa | |
| 674 | SMR | San,Marino | 1844924701 | 31595 | San Marino | |
| 678 | STP | Sao,Tome,and,Principe | 3.374134772E8 | 186342 | São Tomé und Príncipe | |
| 682 | SAU | Saudi,Arabia | 7.5246E11 | 30886545 | Saudi-Arabien | |
| 686 | SEN | Senegal | 15658083145 | 14672557 | Senegal | |
| 688 | SRB | Serbia | 43866419448 | 7127137 | Serbien | |
| 690 | SYC | Seychelles | 1510749016 | 95868 | Seychellen | |
| 694 | SLE | Sierra,Leone | 4893299323 | 6315627 | Sierra Leone | |
| 702 | SGP | Singapore | 3.07872E11 | 5506586 | Singapur | |
| 534 | SXM | Sint,Maarten,(Dutch,part) | 1058659218 | 37696 | Sint Maarten (niederl. Teil) | |
| 703 | SVK | Slovakia | 1.00249E11 | 5422861 | Slowakei | |
| 705 | SVN | Slovenia | 49491440620 | 2066068 | Slowenien | |
| 90 | SLB | Solomon,Islands | 1102683983 | 572171 | Salomonen | |
| 706 | SOM | Somalia | 1374625108 | 10517569 | Somalia | |
| 710 | ZAF | South,Africa | 3.49819E11 | 53969054 | Südafrika | |
| 239 | SGS | South,Georgia,and,the,South,Sandwich,Islands | #NV | #NV | Südgeorgien und die Südlichen Sandwichinseln | |
| 728 | SSD | South,Sudan | 11006755458 | 11911184 | Südsudan | |
| 724 | ESP | Spain | 1.38134E12 | 46259716 | Spanien | |
| 144 | LKA | Sri,Lanka | 74941145474 | 20618991 | Sri Lanka | |
| 729 | SDN | Sudan | 81893873233 | 39350274 | Sudan | |
| 740 | SUR | Suriname | 5210344242 | 538248 | Suriname | |
| 744 | SJM | Svalbard,and,Jan,Mayen | #NV | #NV | Svalbard und Jan Mayen | |
| 748 | SWZ | Swaziland | 4482250123 | 1269112 | Swasiland | |
| 752 | SWE | Sweden | 5.7109E11 | 9703247 | Schweden | |
| 756 | CHE | Switzerland | 7.01037E11 | 8211383 | Schweiz | |
| 760 | SYR | Syrian,Arab,Republic | 34184127956 | 18772481 | Syrien, Arabische Republik | |
| 158 | TWN | Taiwan,,Province,of,China | #NV | #NV | Republik China (Taiwan) | |
| 762 | TJK | Tajikistan | 9241627841 | 8295840 | Tadschikistan | |
| 834 | TZA | Tanzania,,United,Republic,of | 48030400639 | 50443621 | Tansania, Vereinigte Republik | |
| 764 | THA | Thailand | 4.04824E11 | 67725979 | Thailand | |
| 626 | TLS | Timor-Leste | 4969775094 | 1157360 | Osttimor (Timor-Leste) | |
| 768 | TGO | Togo | 4575764718 | 7115163 | Togo | |
| 772 | TKL | Tokelau | #NV | #NV | Tokelau | |
| 776 | TON | Tonga | 4.351913863E8 | 105586 | Tonga | |
| 780 | TTO | Trinidad,and,Tobago | 28068547186 | 1354483 | Trinidad und Tobago | |
| 788 | TUN | Tunisia | 47423435127 | 11130154 | Tunesien | |
| 792 | TUR | Turkey | 7.98414E11 | 77523788 | Türkei | |
| 795 | TKM | Turkmenistan | 47931929825 | 5307188 | Turkmenistan | |
| 796 | TCA | Turks,and,Caicos,Islands | 796759000 | 33740 | Turks- und Caicosinseln | |
| 798 | TUV | Tuvalu | 3.755372047E7 | 9893 | Tuvalu | |
| 800 | UGA | Uganda | 27464535495 | 37782971 | Uganda | |
| 804 | UKR | Ukraine | 1.31806E11 | 45002497 | Ukraine | |
| 784 | ARE | United,Arab,Emirates | 3.99451E11 | 9086139 | Vereinigte Arabische Emirate | |
| 826 | GBR | United,Kingdom | 2.98889E12 | 64331348 | Vereinigtes Königreich Großbritannien und Nordirland | |
| 840 | USA | United,States | 1.73481E13 | 319448634 | Vereinigte Staaten von Amerika | |
| 581 | UMI | United,States,Minor,Outlying,Islands | #NV | #NV | United States Minor Outlying Islands | |
| 858 | URY | Uruguay | 57471202066 | 3419516 | Uruguay | |
| 860 | UZB | Uzbekistan | 63029684684 | 29469913 | Usbekistan | |
| 548 | VUT | Vanuatu | 8.122456154E8 | 258883 | Vanuatu | |
| 862 | VEN | Venezuela,,Bolivarian,Republic,of | 5.09968E11 | 30693827 | Venezuela | |
| 704 | VNM | Viet,Nam | 1.86205E11 | 92423338 | Vietnam | |
| 92 | VGB | Virgin,Islands,,British | 902386167 | 29585 | Britische Jungferninseln | |
| 850 | VIR | Virgin,Islands,,U.S. | #NV | #NV | Amerikanische Jungferninseln | |
| 876 | WLF | Wallis,and,Futuna | #NV | #NV | Wallis und Futuna | |
| 732 | ESH | Western,Sahara | #NV | #NV | Westsahara | |
| 887 | YEM | Yemen | 37130520973 | 26183676 | Jemen | |
| 894 | ZMB | Zambia | 26963357469 | 15721343 | Sambia | |
| 716 | ZWE | Zimbabwe | 14719366527 | 15245855 | Simbabwe | |
| 248 | ALA | Åland,Islands | #NV | #NV | Åland |
This file contains hidden or 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
| name | value | iso | |
|---|---|---|---|
| Afghanistan | 13.38 | AFG | |
| Albania | 43.44 | ALB | |
| Algeria | 19.85 | DZA | |
| Angola | 31.86 | AGO | |
| Antigua and Barbuda | 79.55 | ATG | |
| Argentina | 101.72 | ARG | |
| Armenia | 42.17 | ARM | |
| Australia | 121.15 | AUS | |
| Austria | 106.37 | AUT | |
| Azerbaijan | 31.19 | AZE | |
| Bahamas | 95.63 | BHS | |
| Bangladesh | 4.1 | BGD | |
| Barbados | 74.47 | BRB | |
| Belarus | 78.73 | BLR | |
| Belgium | 76.77 | BEL | |
| Belize | 47.66 | BLZ | |
| Benin | 18.2 | BEN | |
| Bermuda | 123.08 | BMU | |
| Bolivia (Plurinational State of) | 67.22 | BOL | |
| Bosnia and Herzegovina | 33.86 | BIH | |
| Botswana | 29.69 | BWA | |
| Brazil | 92.97 | BRA | |
| Brunei Darussalam | 86 | BRN | |
| Bulgaria | 57.14 | BGR | |
| Burkina Faso | 16.25 | BFA | |
| Cabo Verde | 48.88 | CPV | |
| Cambodia | 14.93 | KHM | |
| Cameroon | 15.65 | CMR | |
| Canada | 92.24 | CAN | |
| Central African Republic | 37.87 | CAF | |
| Chad | 12.49 | TCD | |
| Chile | 80.08 | CHL | |
| China | 57.73 | CHN | |
| China, Hong Kong SAR | 153.91 | HKG | |
| China, Macao SAR | 106.43 | MAC | |
| China, mainland | 56.85 | CHN | |
| China, Taiwan Province of | 79.5 | TWN | |
| Colombia | 46.42 | COL | |
| Congo | 37.63 | COG | |
| Costa Rica | 48.97 | CRI | |
| C�te d'Ivoire | 14.15 | CIV | |
| Croatia | 61.98 | HRV | |
| Cuba | 49.66 | CUB | |
| Cyprus | 79.68 | CYP | |
| Czech Republic | 80.39 | CZE | |
| Democratic People's Republic of Korea | 13.9 | PRK | |
| Denmark | 75.16 | DNK | |
| Djibouti | 16.53 | DJI | |
| Dominica | 56.34 | DMA | |
| Dominican Republic | 50.46 | DOM | |
| Ecuador | 54.37 | ECU | |
| Egypt | 28 | EGY | |
| El Salvador | 28.13 | SLV | |
| Estonia | 60.28 | EST | |
| Ethiopia | 7.99 | ETH | |
| Fiji | 43.78 | FJI | |
| Finland | 74.41 | FIN | |
| France | 88.67 | FRA | |
| French Polynesia | 107.01 | PYF | |
| Gabon | 66.5 | GAB | |
| Gambia | 8.65 | GMB | |
| Georgia | 26.98 | GEO | |
| Germany | 87.92 | DEU | |
| Ghana | 16.88 | GHA | |
| Greece | 80.58 | GRC | |
| Grenada | 57.14 | GRD | |
| Guatemala | 27.82 | GTM | |
| Guinea | 8.42 | GIN | |
| Guinea-Bissau | 16.63 | GNB | |
| Guyana | 41.72 | GUY | |
| Haiti | 18.25 | HTI | |
| Honduras | 35.49 | HND | |
| Hungary | 73.73 | HUN | |
| Iceland | 86.96 | ISL | |
| India | 4.13 | IND | |
| Indonesia | 12.86 | IDN | |
| Iran (Islamic Republic of) | 35.36 | IRN | |
| Iraq | 18.88 | IRQ | |
| Ireland | 80.48 | IRL | |
| Israel | 101.96 | ISR | |
| Italy | 86.65 | ITA | |
| Jamaica | 62.22 | JAM | |
| Japan | 48.79 | JPN | |
| Jordan | 46.65 | JOR | |
| Kazakhstan | 69.7 | KAZ | |
| Kenya | 16.03 | KEN | |
| Kiribati | 40.4 | KIR | |
| Kuwait | 87.04 | KWT | |
| Kyrgyzstan | 36.83 | KGZ | |
| Lao People's Democratic Republic | 19.94 | LAO | |
| Latvia | 68.5 | LVA | |
| Lebanon | 43.77 | LBN | |
| Lesotho | 22.66 | LSO | |
| Liberia | 14.95 | LBR | |
| Lithuania | 72.93 | LTU | |
| Luxembourg | 98.84 | LUX | |
| Madagascar | 14.64 | MDG | |
| Malawi | 8.35 | MWI | |
| Malaysia | 53.27 | MYS | |
| Maldives | 21.08 | MDV | |
| Mali | 25.25 | MLI | |
| Malta | 84.51 | MLT | |
| Mauritania | 30.52 | MRT | |
| Mauritius | 51.82 | MUS | |
| Mexico | 60.97 | MEX | |
| Mongolia | 73.35 | MNG | |
| Montenegro | 77.29 | MNE | |
| Morocco | 33.69 | MAR | |
| Mozambique | 8.23 | MOZ | |
| Myanmar | 39.55 | MMR | |
| Namibia | 33.36 | NAM | |
| Nepal | 11.99 | NPL | |
| Netherlands | 72.72 | NLD | |
| New Caledonia | 80 | NCL | |
| New Zealand | 126.87 | NZL | |
| Nicaragua | 27.43 | NIC | |
| Niger | 17.87 | NER | |
| Nigeria | 9.48 | NGA | |
| Norway | 65.94 | NOR | |
| Oman | 58.94 | OMN | |
| Pakistan | 15.52 | PAK | |
| Panama | 64.27 | PAN | |
| Paraguay | 50.11 | PRY | |
| Peru | 21.24 | PER | |
| Philippines | 34.48 | PHL | |
| Poland | 75.59 | POL | |
| Portugal | 90.3 | PRT | |
| Republic of Moldova | 37.54 | MDA | |
| Romania | 53.42 | ROU | |
| Russian Federation | 66.9 | RUS | |
| Rwanda | 6.19 | RWA | |
| Saint Kitts and Nevis | 75.47 | KANN | |
| Saint Lucia | 89.39 | LCA | |
| Saint Vincent and the Grenadines | 91.74 | VCT | |
| Samoa | 96.26 | WSM | |
| Sao Tome and Principe | 21.86 | STP | |
| Saudi Arabia | 61.99 | SAU | |
| Senegal | 14.48 | SEN | |
| Serbia | 49.29 | SRB | |
| Sierra Leone | 9.21 | SLE | |
| Slovakia | 58.64 | SVK | |
| Slovenia | 81.96 | SVN | |
| Solomon Islands | 16.73 | SLB | |
| South Africa | 59.33 | ZAF | |
| Spain | 93.09 | ESP | |
| Sri Lanka | 6.34 | LKA | |
| Suriname | 54.72 | SUR | |
| Swaziland | 23.1 | SWZ | |
| Sweden | 81.91 | SWE | |
| Switzerland | 74.67 | CHE | |
| Tajikistan | 13.95 | TJK | |
| Thailand | 27.89 | THA | |
| The former Yugoslav Republic of Macedonia | 35.65 | MKD | |
| Timor-Leste | 35.58 | TLS | |
| Togo | 12.21 | TGO | |
| Trinidad and Tobago | 69.02 | TTO | |
| Tunisia | 25.67 | TUN | |
| Turkey | 33.43 | TUR | |
| Turkmenistan | 57.76 | TKM | |
| Uganda | 12.55 | UGA | |
| Ukraine | 49.01 | UKR | |
| United Arab Emirates | 55.57 | ARE | |
| United Kingdom | 82.46 | GBR | |
| United Republic of Tanzania | 9.75 | TZA | |
| United States of America | 117.61 | USA | |
| Uruguay | 69.46 | URY | |
| Uzbekistan | 33.89 | UZB | |
| Vanuatu | 37.19 | VUT | |
| Venezuela (Bolivarian Republic of) | 81.22 | VEN | |
| Viet Nam | 57.6 | VNM | |
| Yemen | 18.61 | YEM | |
| Zambia | 13.41 | ZMB | |
| Zimbabwe | 20.76 | ZWE |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment