| license: gpl-3.0 | |
| height: 600 | |
| border: no | |
| redirect: https://observablehq.com/@mbostock/coastal-graph-distance |
This map shows the graph distance of each county from the Pacific or Atlantic coast; it is a recreation of a map posted to /r/dataisbeautiful using TopoJSON. Coastal counties are dark blue, while counties nine or more counties away from the coast are light yellow. (I opted not to reuse the original’s cycling color scale.)
See also the underlying graph.
| id | |
| 01003 | |
| 01097 | |
| 02013 | |
| 02016 | |
| 02020 | |
| 02050 | |
| 02060 | |
| 02070 | |
| 02100 | |
| 02110 | |
| 02122 | |
| 02130 | |
| 02150 | |
| 02164 | |
| 02170 | |
| 02180 | |
| 02185 | |
| 02188 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02201 | |
| 02220 | |
| 02232 | |
| 02261 | |
| 02270 | |
| 02280 | |
| 02282 | |
| 06001 | |
| 06013 | |
| 06015 | |
| 06023 | |
| 06037 | |
| 06041 | |
| 06045 | |
| 06053 | |
| 06055 | |
| 06059 | |
| 06073 | |
| 06075 | |
| 06079 | |
| 06081 | |
| 06083 | |
| 06085 | |
| 06087 | |
| 06095 | |
| 06097 | |
| 06111 | |
| 09001 | |
| 09007 | |
| 09009 | |
| 09011 | |
| 10001 | |
| 10003 | |
| 10005 | |
| 11001 | |
| 12005 | |
| 12009 | |
| 12011 | |
| 12015 | |
| 12017 | |
| 12021 | |
| 12029 | |
| 12031 | |
| 12033 | |
| 12035 | |
| 12037 | |
| 12045 | |
| 12053 | |
| 12057 | |
| 12061 | |
| 12065 | |
| 12071 | |
| 12075 | |
| 12081 | |
| 12085 | |
| 12086 | |
| 12087 | |
| 12089 | |
| 12091 | |
| 12099 | |
| 12101 | |
| 12103 | |
| 12109 | |
| 12111 | |
| 12113 | |
| 12115 | |
| 12123 | |
| 12127 | |
| 12129 | |
| 12131 | |
| 13029 | |
| 13039 | |
| 13051 | |
| 13127 | |
| 13179 | |
| 13191 | |
| 15001 | |
| 15003 | |
| 15007 | |
| 15007 | |
| 15009 | |
| 15009 | |
| 15009 | |
| 15009 | |
| 22023 | |
| 22045 | |
| 22051 | |
| 22057 | |
| 22071 | |
| 22075 | |
| 22087 | |
| 22101 | |
| 22103 | |
| 22109 | |
| 22113 | |
| 23005 | |
| 23009 | |
| 23011 | |
| 23013 | |
| 23015 | |
| 23023 | |
| 23027 | |
| 23029 | |
| 23031 | |
| 24003 | |
| 24005 | |
| 24009 | |
| 24011 | |
| 24015 | |
| 24017 | |
| 24019 | |
| 24025 | |
| 24029 | |
| 24033 | |
| 24035 | |
| 24037 | |
| 24039 | |
| 24041 | |
| 24045 | |
| 24047 | |
| 24510 | |
| 25001 | |
| 25005 | |
| 25007 | |
| 25009 | |
| 25017 | |
| 25019 | |
| 25021 | |
| 25023 | |
| 25025 | |
| 28045 | |
| 28047 | |
| 28059 | |
| 33015 | |
| 33017 | |
| 34001 | |
| 34003 | |
| 34005 | |
| 34007 | |
| 34009 | |
| 34011 | |
| 34013 | |
| 34015 | |
| 34017 | |
| 34023 | |
| 34025 | |
| 34029 | |
| 34033 | |
| 34039 | |
| 36005 | |
| 36047 | |
| 36059 | |
| 36061 | |
| 36079 | |
| 36081 | |
| 36085 | |
| 36087 | |
| 36103 | |
| 36119 | |
| 37013 | |
| 37015 | |
| 37019 | |
| 37029 | |
| 37031 | |
| 37041 | |
| 37049 | |
| 37053 | |
| 37055 | |
| 37073 | |
| 37091 | |
| 37095 | |
| 37103 | |
| 37129 | |
| 37133 | |
| 37137 | |
| 37139 | |
| 37141 | |
| 37143 | |
| 37177 | |
| 37187 | |
| 41007 | |
| 41011 | |
| 41015 | |
| 41019 | |
| 41039 | |
| 41041 | |
| 41057 | |
| 42045 | |
| 42101 | |
| 44001 | |
| 44003 | |
| 44005 | |
| 44007 | |
| 44009 | |
| 45013 | |
| 45015 | |
| 45019 | |
| 45029 | |
| 45043 | |
| 45051 | |
| 45053 | |
| 48007 | |
| 48039 | |
| 48057 | |
| 48061 | |
| 48071 | |
| 48167 | |
| 48201 | |
| 48239 | |
| 48245 | |
| 48261 | |
| 48273 | |
| 48321 | |
| 48355 | |
| 48391 | |
| 48409 | |
| 48469 | |
| 48489 | |
| 51001 | |
| 51013 | |
| 51036 | |
| 51057 | |
| 51059 | |
| 51073 | |
| 51093 | |
| 51095 | |
| 51097 | |
| 51099 | |
| 51101 | |
| 51103 | |
| 51115 | |
| 51119 | |
| 51127 | |
| 51131 | |
| 51133 | |
| 51149 | |
| 51153 | |
| 51159 | |
| 51175 | |
| 51179 | |
| 51181 | |
| 51193 | |
| 51199 | |
| 51550 | |
| 51650 | |
| 51700 | |
| 51710 | |
| 51800 | |
| 51810 | |
| 53009 | |
| 53027 | |
| 53029 | |
| 53031 | |
| 53033 | |
| 53035 | |
| 53045 | |
| 53049 | |
| 53053 | |
| 53055 | |
| 53057 | |
| 53061 | |
| 53067 | |
| 53069 | |
| 53073 | |
| 72003 | |
| 72005 | |
| 72011 | |
| 72013 | |
| 72017 | |
| 72021 | |
| 72023 | |
| 72027 | |
| 72031 | |
| 72037 | |
| 72051 | |
| 72053 | |
| 72055 | |
| 72057 | |
| 72059 | |
| 72061 | |
| 72065 | |
| 72069 | |
| 72071 | |
| 72075 | |
| 72079 | |
| 72087 | |
| 72089 | |
| 72091 | |
| 72095 | |
| 72097 | |
| 72103 | |
| 72109 | |
| 72111 | |
| 72113 | |
| 72115 | |
| 72119 | |
| 72123 | |
| 72125 | |
| 72127 | |
| 72133 | |
| 72137 | |
| 72143 | |
| 72145 | |
| 72147 | |
| 72151 | |
| 72153 | |
| 78010 | |
| 78030 |
| <!DOCTYPE html> | |
| <svg width="960" height="600"></svg> | |
| <script src="https://d3js.org/d3.v4.min.js"></script> | |
| <script src="https://d3js.org/topojson.v2.min.js"></script> | |
| <script> | |
| var svg = d3.select("svg"), | |
| width = +svg.attr("width"), | |
| height = +svg.attr("height"); | |
| var path = d3.geoPath(); | |
| var color = d3.scaleOrdinal() | |
| .domain(d3.range(9)) | |
| .range(["#081d58", "#253494", "#225ea8", "#1d91c0", "#41b6c4", "#7fcdbb", "#c7e9b4", "#edf8b1", "#ffffd9"]); | |
| d3.queue() | |
| .defer(d3.json, "https://d3js.org/us-10m.v1.json") | |
| .defer(d3.tsv, "coastal-counties.tsv") | |
| .await(ready); | |
| function ready(error, us, coastals) { | |
| if (error) throw error; | |
| var counties = topojson.feature(us, us.objects.counties), | |
| neighbors = topojson.neighbors(us.objects.counties.geometries), | |
| coastals = d3.set(coastals.map(function(d) { return d.id; })), | |
| nexts = [], | |
| nexts2 = [], | |
| distance = 0; | |
| counties.features.forEach(function(county, i) { | |
| if (coastals.has(county.id)) nexts.push(county); | |
| county.distance = Infinity; | |
| county.neighbors = neighbors[i].map(function(j) { return counties.features[j]; }); | |
| }); | |
| while (nexts.length) { | |
| nexts.forEach(function(county) { | |
| if (county.distance > distance) { | |
| county.distance = distance; | |
| county.neighbors.forEach(function(neighbor) { nexts2.push(neighbor); }); | |
| } | |
| }); | |
| nexts = nexts2, nexts2 = [], ++distance; | |
| } | |
| svg.append("g") | |
| .attr("fill", "#ccc") | |
| .selectAll("path") | |
| .data(counties.features) | |
| .enter().append("path") | |
| .style("fill", function(d) { return color(Math.min(8, d.distance)); }) | |
| .attr("d", path); | |
| svg.append("path") | |
| .attr("fill", "none") | |
| .attr("stroke", "#ccc") | |
| .attr("stroke-width", 0.5) | |
| .attr("stroke-linejoin", "round") | |
| .attr("d", path(topojson.mesh(us, us.objects.counties, function(a, b) { return a !== b; }))); | |
| } | |
| </script> |
