Last active
April 12, 2017 15:41
-
-
Save jadiehm/daab3c38d6e283052d4360e333329e12 to your computer and use it in GitHub Desktop.
Small multiple bubble maps with tooltips
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-GB'> | |
<head></head> | |
<style> | |
h3 { | |
font-family: sans-serif; | |
font-size: 22px; | |
font-weight: 700; | |
line-height: 26px; | |
margin: -5px 0 -5px 0; | |
padding: 10px 0 0 0; | |
} | |
.g-sentence-div { | |
margin: 10px 0 0 0; | |
} | |
.g-sentence { | |
font-family: sans-serif; | |
font-size: 16px; | |
margin: 0; | |
} | |
.g-country { | |
font-family: sans-serif; | |
font-size: 16px; | |
margin: 0; | |
font-weight: 700; | |
} | |
p { | |
font-family: sans-serif; | |
font-size: 14px; | |
} | |
/*template styles*/ | |
.heds { | |
margin-bottom: 20px; | |
} | |
.gia-chart-wrapper { | |
max-width: 960px; | |
margin: 0 auto; | |
} | |
.heds { | |
float: left; | |
width: 62%; | |
} | |
.gia-chart { | |
width: 100%; | |
clear:both; | |
} | |
.g-chart-container { | |
width: 33.3%; | |
float: left; | |
margin: 0; | |
} | |
.g-chart-container:last-of-type { | |
margin-bottom: 15px; | |
} | |
.key { | |
float: right; | |
} | |
.keyblock { | |
display: inline-block; | |
margin: 13px 2px 0 0; | |
position: relative; | |
height: 50px; | |
width: 50px; | |
} | |
.circle10000 { | |
border-radius: 50%; | |
border: 1px solid #b82266; | |
background-color: #ebb2c3; | |
width: 17px; | |
height: 17px; | |
opacity: 0.5; | |
position: absolute; | |
bottom: 0px; | |
} | |
.circle25000 { | |
border-radius: 50%; | |
border: 1px solid #b82266; | |
background-color: #ebb2c3; | |
width: 25px; | |
height: 25px; | |
opacity: 0.5; | |
position: absolute; | |
bottom: 0px; | |
} | |
.circle50000 { | |
border-radius: 50%; | |
border: 1px solid #b82266; | |
background-color: #ebb2c3; | |
width: 33px; | |
height: 33px; | |
opacity: 0.5; | |
position: absolute; | |
bottom: 0px; | |
} | |
.circle100000 { | |
border-radius: 50%; | |
border: 1px solid #b82266; | |
background-color: #ebb2c3; | |
width: 50px; | |
height: 50px; | |
opacity: 0.5; | |
position: absolute; | |
bottom: 0px; | |
} | |
circle.highlighted { | |
fill: '#ebb2c3'; | |
opacity: 0.7; | |
stroke: #b82266; | |
stroke-width: 2; | |
} | |
.bil10, .bil25, .bil50, .bil100 { | |
margin: 0 0 0 0; | |
font-size: 12px; | |
text-align: center; | |
position: absolute; | |
bottom: -20px; | |
color: #bdbdbd; | |
} | |
.bil10 { | |
margin-left: -13px; | |
} | |
.bil25 { | |
margin-left: -8px; | |
} | |
.bil50 { | |
margin-left: -5px; | |
} | |
/*map styles */ | |
.states { | |
fill: #e2e2e2; | |
stroke: #ffffff; | |
stroke-linejoin: round; | |
} | |
.China { | |
fill: #ebb2c3; | |
opacity: 0.4; | |
stroke: #b82266; | |
stroke-width: 1px; | |
} | |
.Germany { | |
fill: #ebb2c3; | |
opacity: 0.4; | |
stroke: #b82266; | |
stroke-width: 1px; | |
} | |
.Canada { | |
fill: #ebb2c3; | |
opacity: 0.4; | |
stroke: #b82266; | |
stroke-width: 1px; | |
} | |
.default { | |
fill: #ebb2c3; | |
opacity: 0.4; | |
stroke: #b82266; | |
stroke-width: 1px; | |
} | |
.label { | |
font-family: 'Guardian Text Sans Web',Arial,sans-serif; | |
font-size: 14px; | |
fill: #333333; | |
text-anchor: start; | |
} | |
.visible { | |
transition: opacity 0.3s; | |
opacity: 1; | |
} | |
.tooltip { | |
position: fixed; | |
text-align: left; | |
padding: 2px; | |
font-family: sans-serif; | |
font-size: 13px; | |
line-height: 16px; | |
pointer-events: none; | |
color: #333333; | |
opacity: 0; | |
background-color: #ffffff; | |
border: 1px solid #dcdcdc; | |
} | |
.visible { | |
transition: opacity 0.3s; | |
opacity: 1; | |
} | |
.bolded { | |
font-weight: 700; | |
} | |
.circleLabels { | |
opacity: 0; | |
} | |
@media(max-width: 900px) { | |
.g-sentence-div { | |
margin-right: 80px; | |
} | |
} | |
@media(max-width: 740px) { | |
.g-chart-container { | |
width: 50%; | |
} | |
.g-sentence-div { | |
margin-right: 0px; | |
} | |
.heds { | |
width: 55%; | |
} | |
} | |
@media(max-width: 520px) { | |
.heds { | |
width: 100%; | |
margin-bottom: -10px; | |
} | |
.key { | |
float: left; | |
clear:both; | |
margin: 0 0 20px 12px; | |
} | |
} | |
@media(max-width: 605px) { | |
.g-sentence-div { | |
margin-right: 100px; | |
} | |
} | |
@media(max-width: 500px) { | |
.g-sentence-div { | |
margin-right: 40px; | |
} | |
} | |
@media(max-width: 450px) { | |
.g-chart-container { | |
width: 100%; | |
} | |
} | |
</style> | |
<body> | |
<main> | |
<div class='gia-chart-wrapper'> | |
<div class='gia-chart-top'> | |
<div class="heds"> | |
<h3>The United States' biggest import partners</h3> | |
<p class="intro">In 2016, China, Mexico, Canada, Japan, Germany and South Korea accounted for over 60 percent of the US' import value in billions.</p> | |
</div> | |
<div class="key"> | |
<div class='keyblock'> | |
<div class="circle10000"></div> | |
<p class="bil10">$10 bil.</p> | |
</div> | |
<div class='keyblock'> | |
<div class="circle25000"></div> | |
<p class="bil25">$25 bil.</p> | |
</div> | |
<div class='keyblock'> | |
<div class="circle50000"></div> | |
<p class="bil50">$50 bil.</p> | |
</div> | |
<div class='keyblock'> | |
<div class="circle100000"></div> | |
<p class="bil100">$100 bil.</p> | |
</div> | |
</div> | |
</div> | |
<div class='gia-chart'></div> | |
</div> | |
</main> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/queue-async/1.0.7/queue.min.js"></script> | |
<script src="https://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.19/topojson.min.js"></script> | |
<script> | |
//Country list | |
var allCountries = ["China", "Mexico", "Canada", "Japan", "Germany", "South Korea"]; | |
//Load the files | |
queue() | |
.defer(d3.json, "usmap.json") | |
.defer(d3.csv, "states.csv") | |
.await(ready); | |
//Comma formater | |
var format = d3.format("0,000"); | |
//Make all charts and call resize | |
function ready(error, us, data) { | |
if (error) throw error; | |
//Map the countries to the data | |
allCountries = d3.set(data.map(function(d) { return d.country; })).values(); | |
//Make a map for each country | |
var charts = allCountries.map(makeChart); | |
d3.select(window).on("resize", function() { | |
charts.forEach(function(chart) { | |
chart.resize(); | |
}); | |
}); | |
//Create data lookup by importer | |
var dataByImporter = {}; | |
allCountries.forEach(function (country) { | |
dataByImporter[country] = {}; | |
}); | |
data.forEach(function (record) { | |
dataByImporter[record.country][record.FIPS] = record; | |
}); | |
//Make each individual chart | |
function makeChart(country) { | |
//Filter data for each country | |
var chartData = data.filter(function(d) { | |
return d.country === country; | |
}); | |
//Pair data with state id | |
var dataByFIPS = {}; | |
chartData.forEach(function(d) { dataByFIPS[d.FIPS] = d.value; }); | |
//Pair state name with state id | |
var stateByFIPS = {}; | |
chartData.forEach(function(d) { stateByFIPS[d.FIPS] = d.state; }); | |
//Pair country with state id | |
var abbrevByFIPS = {}; | |
chartData.forEach(function(d) { abbrevByFIPS[d.FIPS] = d.abbrev; }); | |
//Append individual chart div | |
var chartContainer = d3.select(".gia-chart").append("div") | |
.attr("class", "g-chart-container") | |
//Attaches a data attribute to each chart | |
.attr('data-importer', country); | |
//Sets dimensions | |
var margin = {top: 0, left: 5, bottom: 5, right: 5}, | |
width = d3.select(".g-chart-container").node().clientWidth, | |
width = width - margin.left - margin.right, | |
mapRatio = .65, | |
height = width * mapRatio; | |
//Tells the map what projection to use | |
var projection = d3.geo.albersUsa() | |
.scale(width *1.25) | |
.translate([width / 2, height / 2]); | |
//Tells the map how to draw the paths from the projection | |
var path = d3.geo.path() | |
.projection(projection); | |
//Appends div for country sentence | |
var chartSentence = chartContainer.append("div") | |
.attr("class", "g-sentence-div"); | |
//Appends spans for country sentence | |
var chartStart = chartSentence.append("span") | |
.text("Where ") | |
.attr("class", "g-sentence"); | |
var chartCountry = chartSentence.append("span") | |
.text(country) | |
.attr("class", "g-country"); | |
var chartEnd = chartSentence.append("span") | |
.text(" is a top-10 importer") | |
.attr("class", "g-sentence"); | |
//Appends the country map div to each container | |
var chart = chartContainer.append("div") | |
.attr("class", "g-chart"); | |
//Appened svg to page | |
var map = chart.append("svg") | |
.style('height', height + 'px') | |
.style('width', width + 'px'); | |
//Appends tooltip | |
var div = chartContainer.append("div") | |
.attr("class", "tooltip"); | |
//Creates geo feature array for each map using the data for each country | |
var features = topojson.feature(us, us.objects.states).features.filter( function ( feature ) { | |
return feature.id in dataByFIPS; | |
}); | |
//Append states | |
map.append("g") | |
.attr("class", "states") | |
.selectAll("path") | |
.data(features) | |
.enter().append("path") | |
.attr("d", path) | |
.style("fill", "#eaeaea") | |
//Also attaches hovers to states for greater area | |
.on("mouseover", mouseover) | |
.on("mouseout", mouseout); | |
//Append proportional bubbles | |
map.append("g") | |
.attr("class", "bubble-group") | |
.selectAll(".bubble") | |
.data(features) | |
.enter().append("circle") | |
//Class by state abbreviation | |
.attr("class", function(d) { | |
return "default " + abbrevByFIPS[d.id] | |
}) | |
.attr("d", path) | |
.attr("transform", function(d) { | |
var centroid = path.centroid( d ); | |
return "translate(" + centroid + ")"; | |
}) | |
.attr("r", function(d) { | |
var r = Math.sqrt(dataByFIPS[d.id]/200); | |
return r; | |
}) | |
.on("mouseover", mouseover) | |
.on("mouseout", mouseout); | |
//Show tooltip on hover | |
function mouseover(d) { | |
highlightState(d.id); | |
} | |
//Hide tooltip on exit | |
function mouseout(d) { | |
dehighlightStates(); | |
} | |
//RESPONSIVENESS | |
return { | |
resize: function() { | |
//Get page width | |
var w = d3.select(".g-chart-container").node().clientWidth; | |
//Adjust things when the window size changes | |
width = w - margin.left - margin.right; | |
height = width * mapRatio; | |
//Update projection | |
var newProjection = d3.geo.albersUsa() | |
.scale(width*1.25) | |
.translate([width / 2, height / 2]); | |
//Update path | |
path = d3.geo.path() | |
.projection(newProjection); | |
//Resize the map container | |
map | |
.style('width', width + 'px') | |
.style('height', height + 'px'); | |
//Resize the map | |
map.selectAll("path").attr('d', path); | |
//Resize the bubbles | |
map.selectAll("circle") | |
.attr("transform", function(d) { return "translate(" + path.centroid(d) + ")";}) | |
} | |
} | |
//Highlights all corresponding bubbles and states across all maps | |
function highlightState (fips) { | |
//Get the FIPS from the state abbrevation array | |
var postal = abbrevByFIPS[fips]; | |
allCountries.forEach(function (country) { | |
//Select all circles with a matching FIPS | |
var circle = d3.select('[data-importer="' + country + '"] .' + postal); | |
//Change their class to be highlighted on hover | |
circle.classed('highlighted', true); | |
//Select all tooltips with match FIPS | |
var tooltip = d3.select('[data-importer="' + country + '"] .tooltip'); | |
//Get the associated data by country and FIPS | |
var data = dataByImporter[country][fips]; | |
//Align the tooltip with the bounding rectangle around it | |
var bcr = circle.node().getBoundingClientRect(); | |
var left = bcr.right; | |
var top = (bcr.top + bcr.bottom) / 2; | |
//Style and fill the tooltip | |
tooltip | |
.html("<span class='bolded'>" + postal + "</span><br>" + "$" + format(Math.round(data.value))) | |
.style("left", left + "px") | |
.style("top", top + "px") | |
.classed('visible', function(d){ | |
//Only show tooltips when the value is not 0 | |
return data.value != '0'; | |
}); | |
}); | |
} | |
function dehighlightStates () { | |
//Unhighlight the circle by class | |
d3.selectAll('circle.highlighted').classed('highlighted', false); | |
//Hide the tooltip by class | |
allCountries.forEach(function (country) { | |
var tooltip = d3.select('[data-importer="' + country + '"] .tooltip'); | |
tooltip | |
.classed('visible', false); | |
}); | |
} | |
} | |
} | |
</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
state | abbrev | FIPS | country | value | |
---|---|---|---|---|---|
Alabama | AL | 1 | China | 1711 | |
Alaska | AK | 2 | China | 420.4 | |
Arizona | AZ | 4 | China | 2307.8 | |
Arkansas | AR | 5 | China | 2842.2 | |
California | CA | 6 | China | 131213.1 | |
Colorado | CO | 8 | China | 2062.8 | |
Connecticut | CT | 9 | China | 2162.2 | |
Delaware | DE | 10 | China | 356.2 | |
Florida | FL | 12 | China | 10932.3 | |
Georgia | GA | 13 | China | 16965.9 | |
Hawaii | HI | 15 | China | 225.1 | |
Idaho | ID | 16 | China | 1270.3 | |
Illinois | IL | 17 | China | 27841.1 | |
Indiana | IN | 18 | China | 7228.2 | |
Iowa | IA | 19 | China | 1275.7 | |
Kansas | KS | 20 | China | 2185.7 | |
Kentucky | KY | 21 | China | 5391 | |
Louisiana | LA | 22 | China | 1051.7 | |
Maine | ME | 23 | China | 334.7 | |
Maryland | MD | 24 | China | 2830.6 | |
Massachusetts | MA | 25 | China | 3993.9 | |
Michigan | MI | 26 | China | 9003.1 | |
Minnesota | MN | 27 | China | 9595 | |
Mississippi | MS | 28 | China | 3880.2 | |
Missouri | MO | 29 | China | 3936.9 | |
Montana | MT | 30 | China | 81.2 | |
Nebraska | NE | 31 | China | 816 | |
Nevada | NV | 32 | China | 4508.4 | |
New Hampshire | NH | 33 | China | 838.7 | |
New Jersey | NJ | 34 | China | 16238.4 | |
New Mexico | NM | 35 | China | 672.9 | |
New York | NY | 36 | China | 19095.8 | |
North Carolina | NC | 37 | China | 9327.1 | |
North Dakota | ND | 38 | China | 192.3 | |
Ohio | OH | 39 | China | 11271.6 | |
Oklahoma | OK | 40 | China | 1823.9 | |
Oregon | OR | 41 | China | 1973.9 | |
Pennsylvania | PA | 42 | China | 15400.3 | |
Rhode Island | RI | 44 | China | 1093.3 | |
South Carolina | SC | 45 | China | 5461 | |
South Dakota | SD | 46 | China | 184.7 | |
Tennessee | TN | 47 | China | 21473.2 | |
Texas | TX | 48 | China | 33576.5 | |
Utah | UT | 49 | China | 1783.2 | |
Vermont | VT | 50 | China | 229.3 | |
Virginia | VA | 51 | China | 6542.3 | |
Washington | WA | 53 | China | 10530 | |
West Virginia | WV | 54 | China | 165.6 | |
Wisconsin | WI | 55 | China | 5302.4 | |
Wyoming | WY | 56 | China | 138.8 | |
Alabama | AL | 1 | Mexico | 2898.4 | |
Alaska | AK | 2 | Mexico | 0 | |
Arizona | AZ | 4 | Mexico | 6872.9 | |
Arkansas | AR | 5 | Mexico | 546.7 | |
California | CA | 6 | Mexico | 42792.2 | |
Colorado | CO | 8 | Mexico | 1418.2 | |
Connecticut | CT | 9 | Mexico | 2282 | |
Delaware | DE | 10 | Mexico | 254.5 | |
Florida | FL | 12 | Mexico | 5279.9 | |
Georgia | GA | 13 | Mexico | 5942.2 | |
Hawaii | HI | 15 | Mexico | 0 | |
Idaho | ID | 16 | Mexico | 106.9 | |
Illinois | IL | 17 | Mexico | 10841.2 | |
Indiana | IN | 18 | Mexico | 4142.3 | |
Iowa | IA | 19 | Mexico | 1076.6 | |
Kansas | KS | 20 | Mexico | 768.9 | |
Kentucky | KY | 21 | Mexico | 4788.4 | |
Louisiana | LA | 22 | Mexico | 1020.1 | |
Maine | ME | 23 | Mexico | 66.4 | |
Maryland | MD | 24 | Mexico | 2048.9 | |
Massachusetts | MA | 25 | Mexico | 3204.2 | |
Michigan | MI | 26 | Mexico | 44832 | |
Minnesota | MN | 27 | Mexico | 1885 | |
Mississippi | MS | 28 | Mexico | 1433.8 | |
Missouri | MO | 29 | Mexico | 2494.4 | |
Montana | MT | 30 | Mexico | 92.9 | |
Nebraska | NE | 31 | Mexico | 231.1 | |
Nevada | NV | 32 | Mexico | 429.9 | |
New Hampshire | NH | 33 | Mexico | 396.3 | |
New Jersey | NJ | 34 | Mexico | 4344.6 | |
New Mexico | NM | 35 | Mexico | 647.7 | |
New York | NY | 36 | Mexico | 0 | |
North Carolina | NC | 37 | Mexico | 4200.1 | |
North Dakota | ND | 38 | Mexico | 108.1 | |
Ohio | OH | 39 | Mexico | 7365.9 | |
Oklahoma | OK | 40 | Mexico | 763.7 | |
Oregon | OR | 41 | Mexico | 796.4 | |
Pennsylvania | PA | 42 | Mexico | 3700.1 | |
Rhode Island | RI | 44 | Mexico | 1018.4 | |
South Carolina | SC | 45 | Mexico | 3146.2 | |
South Dakota | SD | 46 | Mexico | 63.7 | |
Tennessee | TN | 47 | Mexico | 6802.4 | |
Texas | TX | 48 | Mexico | 74585.7 | |
Utah | UT | 49 | Mexico | 3075.9 | |
Vermont | VT | 50 | Mexico | 36.3 | |
Virginia | VA | 51 | Mexico | 0 | |
Washington | WA | 53 | Mexico | 1205.5 | |
West Virginia | WV | 54 | Mexico | 212.8 | |
Wisconsin | WI | 55 | Mexico | 2529.8 | |
Wyoming | WY | 56 | Mexico | 95.6 | |
Alabama | AL | 1 | Canada | 1899.6 | |
Alaska | AK | 2 | Canada | 463.5 | |
Arizona | AZ | 4 | Canada | 1187 | |
Arkansas | AR | 5 | Canada | 694.8 | |
California | CA | 6 | Canada | 25633.1 | |
Colorado | CO | 8 | Canada | 2519.8 | |
Connecticut | CT | 9 | Canada | 2523.7 | |
Delaware | DE | 10 | Canada | 388.7 | |
Florida | FL | 12 | Canada | 3921.4 | |
Georgia | GA | 13 | Canada | 3671.5 | |
Hawaii | HI | 15 | Canada | 205.9 | |
Idaho | ID | 16 | Canada | 914.7 | |
Illinois | IL | 17 | Canada | 22834.2 | |
Indiana | IN | 18 | Canada | 6703.5 | |
Iowa | IA | 19 | Canada | 2246.7 | |
Kansas | KS | 20 | Canada | 1497.1 | |
Kentucky | KY | 21 | Canada | 3172.4 | |
Louisiana | LA | 22 | Canada | 1319.2 | |
Maine | ME | 23 | Canada | 1543.8 | |
Maryland | MD | 24 | Canada | 1742.1 | |
Massachusetts | MA | 25 | Canada | 6665.5 | |
Michigan | MI | 26 | Canada | 44532.8 | |
Minnesota | MN | 27 | Canada | 6790.8 | |
Mississippi | MS | 28 | Canada | 836.5 | |
Missouri | MO | 29 | Canada | 2686.9 | |
Montana | MT | 30 | Canada | 2605.1 | |
Nebraska | NE | 31 | Canada | 679.8 | |
Nevada | NV | 32 | Canada | 787.3 | |
New Hampshire | NH | 33 | Canada | 3917.8 | |
New Jersey | NJ | 34 | Canada | 6665 | |
New Mexico | NM | 35 | Canada | 236 | |
New York | NY | 36 | Canada | 16331.8 | |
North Carolina | NC | 37 | Canada | 3131.7 | |
North Dakota | ND | 38 | Canada | 1264.8 | |
Ohio | OH | 39 | Canada | 10545 | |
Oklahoma | OK | 40 | Canada | 2338.5 | |
Oregon | OR | 41 | Canada | 2261.6 | |
Pennsylvania | PA | 42 | Canada | 9208.3 | |
Rhode Island | RI | 44 | Canada | 374.7 | |
South Carolina | SC | 45 | Canada | 2704.4 | |
South Dakota | SD | 46 | Canada | 336.8 | |
Tennessee | TN | 47 | Canada | 4770.6 | |
Texas | TX | 48 | Canada | 13837.7 | |
Utah | UT | 49 | Canada | 1811 | |
Vermont | VT | 50 | Canada | 2375.4 | |
Virginia | VA | 51 | Canada | 1770.5 | |
Washington | WA | 53 | Canada | 11682.2 | |
West Virginia | WV | 54 | Canada | 1007.7 | |
Wisconsin | WI | 55 | Canada | 3791.2 | |
Wyoming | WY | 56 | Canada | 497.2 | |
Alabama | AL | 1 | Japan | 770.1 | |
Alaska | AK | 2 | Japan | 80.5 | |
Arizona | AZ | 4 | Japan | 628.2 | |
Arkansas | AR | 5 | Japan | 118.2 | |
California | CA | 6 | Japan | 37098.6 | |
Colorado | CO | 8 | Japan | 0 | |
Connecticut | CT | 9 | Japan | 784 | |
Delaware | DE | 10 | Japan | 0 | |
Florida | FL | 12 | Japan | 3367.1 | |
Georgia | GA | 13 | Japan | 4682.8 | |
Hawaii | HI | 15 | Japan | 338.6 | |
Idaho | ID | 16 | Japan | 313.7 | |
Illinois | IL | 17 | Japan | 9041.9 | |
Indiana | IN | 18 | Japan | 3559.7 | |
Iowa | IA | 19 | Japan | 417.1 | |
Kansas | KS | 20 | Japan | 369.5 | |
Kentucky | KY | 21 | Japan | 4682.8 | |
Louisiana | LA | 22 | Japan | 0 | |
Maine | ME | 23 | Japan | 56.8 | |
Maryland | MD | 24 | Japan | 3190.8 | |
Massachusetts | MA | 25 | Japan | 2126.4 | |
Michigan | MI | 26 | Japan | 2882.7 | |
Minnesota | MN | 27 | Japan | 380.5 | |
Mississippi | MS | 28 | Japan | 811.6 | |
Missouri | MO | 29 | Japan | 332.3 | |
Montana | MT | 30 | Japan | 12.7 | |
Nebraska | NE | 31 | Japan | 191.3 | |
Nevada | NV | 32 | Japan | 241.9 | |
New Hampshire | NH | 33 | Japan | 174.4 | |
New Jersey | NJ | 34 | Japan | 3792.4 | |
New Mexico | NM | 35 | Japan | 29.1 | |
New York | NY | 36 | Japan | 0 | |
North Carolina | NC | 37 | Japan | 2564.1 | |
North Dakota | ND | 38 | Japan | 0 | |
Ohio | OH | 39 | Japan | 4409.7 | |
Oklahoma | OK | 40 | Japan | 327.4 | |
Oregon | OR | 41 | Japan | 1961.9 | |
Pennsylvania | PA | 42 | Japan | 1869.8 | |
Rhode Island | RI | 44 | Japan | 794.6 | |
South Carolina | SC | 45 | Japan | 1440.5 | |
South Dakota | SD | 46 | Japan | 26.7 | |
Tennessee | TN | 47 | Japan | 6798.9 | |
Texas | TX | 48 | Japan | 4533.6 | |
Utah | UT | 49 | Japan | 0 | |
Vermont | VT | 50 | Japan | 76.3 | |
Virginia | VA | 51 | Japan | 1095.6 | |
Washington | WA | 53 | Japan | 5508 | |
West Virginia | WV | 54 | Japan | 1015.6 | |
Wisconsin | WI | 55 | Japan | 628.1 | |
Wyoming | WY | 56 | Japan | 4.5 | |
Alabama | AL | 1 | Germany | 3662.3 | |
Alaska | AK | 2 | Germany | 0 | |
Arizona | AZ | 4 | Germany | 809.6 | |
Arkansas | AR | 5 | Germany | 286.5 | |
California | CA | 6 | Germany | 10125.5 | |
Colorado | CO | 8 | Germany | 642.5 | |
Connecticut | CT | 9 | Germany | 1324.2 | |
Delaware | DE | 10 | Germany | 0 | |
Florida | FL | 12 | Germany | 3957.9 | |
Georgia | GA | 13 | Germany | 12794.7 | |
Hawaii | HI | 15 | Germany | 0 | |
Idaho | ID | 16 | Germany | 74.4 | |
Illinois | IL | 17 | Germany | 4540.4 | |
Indiana | IN | 18 | Germany | 2305.9 | |
Iowa | IA | 19 | Germany | 522.5 | |
Kansas | KS | 20 | Germany | 843.8 | |
Kentucky | KY | 21 | Germany | 2339.6 | |
Louisiana | LA | 22 | Germany | 0 | |
Maine | ME | 23 | Germany | 95.8 | |
Maryland | MD | 24 | Germany | 3942.1 | |
Massachusetts | MA | 25 | Germany | 1668.4 | |
Michigan | MI | 26 | Germany | 3875.3 | |
Minnesota | MN | 27 | Germany | 934 | |
Mississippi | MS | 28 | Germany | 591.9 | |
Missouri | MO | 29 | Germany | 1204.9 | |
Montana | MT | 30 | Germany | 193.6 | |
Nebraska | NE | 31 | Germany | 262.6 | |
Nevada | NV | 32 | Germany | 156.4 | |
New Hampshire | NH | 33 | Germany | 472.2 | |
New Jersey | NJ | 34 | Germany | 5526.4 | |
New Mexico | NM | 35 | Germany | 88.9 | |
New York | NY | 36 | Germany | 3724.6 | |
North Carolina | NC | 37 | Germany | 2770.1 | |
North Dakota | ND | 38 | Germany | 112.9 | |
Ohio | OH | 39 | Germany | 4367.7 | |
Oklahoma | OK | 40 | Germany | 249.8 | |
Oregon | OR | 41 | Germany | 419.2 | |
Pennsylvania | PA | 42 | Germany | 5376.9 | |
Rhode Island | RI | 44 | Germany | 2055.3 | |
South Carolina | SC | 45 | Germany | 6161.9 | |
South Dakota | SD | 46 | Germany | 30.7 | |
Tennessee | TN | 47 | Germany | 3311.5 | |
Texas | TX | 48 | Germany | 6171.6 | |
Utah | UT | 49 | Germany | 180.1 | |
Vermont | VT | 50 | Germany | 51 | |
Virginia | VA | 51 | Germany | 1915.7 | |
Washington | WA | 53 | Germany | 725.3 | |
West Virginia | WV | 54 | Germany | 151.7 | |
Wisconsin | WI | 55 | Germany | 1261.2 | |
Wyoming | WY | 56 | Germany | 11.4 | |
Alabama | AL | 1 | South Korea | 4158.9 | |
Alaska | AK | 2 | South Korea | 288.5 | |
Arizona | AZ | 4 | South Korea | 0 | |
Arkansas | AR | 5 | South Korea | 0 | |
California | CA | 6 | South Korea | 12842.5 | |
Colorado | CO | 8 | South Korea | 360.8 | |
Connecticut | CT | 9 | South Korea | 0 | |
Delaware | DE | 10 | South Korea | 0 | |
Florida | FL | 12 | South Korea | 0 | |
Georgia | GA | 13 | South Korea | 5757.6 | |
Hawaii | HI | 15 | South Korea | 156.5 | |
Idaho | ID | 16 | South Korea | 103.8 | |
Illinois | IL | 17 | South Korea | 5435.9 | |
Indiana | IN | 18 | South Korea | 0 | |
Iowa | IA | 19 | South Korea | 0 | |
Kansas | KS | 20 | South Korea | 236.1 | |
Kentucky | KY | 21 | South Korea | 0 | |
Louisiana | LA | 22 | South Korea | 0 | |
Maine | ME | 23 | South Korea | 0 | |
Maryland | MD | 24 | South Korea | 0 | |
Massachusetts | MA | 25 | South Korea | 0 | |
Michigan | MI | 26 | South Korea | 4576.7 | |
Minnesota | MN | 27 | South Korea | 0 | |
Mississippi | MS | 28 | South Korea | 0 | |
Missouri | MO | 29 | South Korea | 0 | |
Montana | MT | 30 | South Korea | 0 | |
Nebraska | NE | 31 | South Korea | 0 | |
Nevada | NV | 32 | South Korea | 209.6 | |
New Hampshire | NH | 33 | South Korea | 0 | |
New Jersey | NJ | 34 | South Korea | 3697.9 | |
New Mexico | NM | 35 | South Korea | 0 | |
New York | NY | 36 | South Korea | 0 | |
North Carolina | NC | 37 | South Korea | 0 | |
North Dakota | ND | 38 | South Korea | 155.9 | |
Ohio | OH | 39 | South Korea | 0 | |
Oklahoma | OK | 40 | South Korea | 0 | |
Oregon | OR | 41 | South Korea | 1579.2 | |
Pennsylvania | PA | 42 | South Korea | 2838.4 | |
Rhode Island | RI | 44 | South Korea | 0 | |
South Carolina | SC | 45 | South Korea | 0 | |
South Dakota | SD | 46 | South Korea | 0 | |
Tennessee | TN | 47 | South Korea | 1775.6 | |
Texas | TX | 48 | South Korea | 6741.9 | |
Utah | UT | 49 | South Korea | 0 | |
Vermont | VT | 50 | South Korea | 0 | |
Virginia | VA | 51 | South Korea | 0 | |
Washington | WA | 53 | South Korea | 2042.9 | |
West Virginia | WV | 54 | South Korea | 0 | |
Wisconsin | WI | 55 | South Korea | 0 | |
Wyoming | WY | 56 | South Korea | 7 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment