31:Td97,function geoAlbersUsaPr() { var cache, cacheStream, lower48 = d3.geoAlbers(), lower48Point, alaska = d3.geoConicEqualArea().rotate([154, 0]).center([-2, 58.5]).parallels([55, 65]), alaskaPoint, hawaii = d3.geoConicEqualArea().rotate([157, 0]).center([-3, 19.9]).parallels([8, 18]), hawaiiPoint, puertoRico = d3.geoConicEqualArea().rotate([66, 0]).center([0, 18]).parallels([8, 18]), puertoRicoPoint, point, pointStream = {point: function(x, y) { point = [x, y]; }}; function albersUsa(coordinates) { var x = coordinates[0], y = coordinates[1]; return point = null, (lower48Point.point(x, y), point) || (alaskaPoint.point(x, y), point) || (hawaiiPoint.point(x, y), point) || (puertoRicoPoint.point(x, y), point); } albersUsa.invert = function(coordinates) { var k = lower48.scale(), t = lower48.translate(), x = (coordinates[0] - t[0]) / k, y = (coordinates[1] - t[1]) / k; return (y >= 0.120 && y < 0.234 && x >= -0.425 && x < -0.214 ? alaska : y >= 0.166 && y < 0.234 && x >= -0.214 && x < -0.115 ? hawaii : y >= 0.204 && y < 0.234 && x >= 0.320 && x < 0.380 ? puertoRico : lower48).invert(coordinates); }; albersUsa.stream = function(stream) { return cache && cacheStream === stream ? cache : cache = multiplex([lower48.stream(cacheStream = stream), alaska.stream(stream), hawaii.stream(stream), puertoRico.stream(stream)]); }; albersUsa.precision = function(_) { if (!arguments.length) return lower48.precision(); lower48.precision(_), alaska.precision(_), hawaii.precision(_), puertoRico.precision(_); return reset(); }; albersUsa.scale = function(_) { if (!arguments.length) return lower48.scale(); lower48.scale(_), alaska.scale(_ * 0.35), hawaii.scale(_), puertoRico.scale(_); return albersUsa.translate(lower48.translate()); }; albersUsa.translate = function(_) { if (!arguments.length) return lower48.translate(); var k = lower48.scale(), x = +_[0], y = +_[1]; lower48Point = lower48 .translate(_) .clipExtent([[x - 0.455 * k, y - 0.238 * k], [x + 0.455 * k, y + 0.238 * k]]) .stream(pointStream); alaskaPoint = alaska .translate([x - 0.307 * k, y + 0.201 * k]) .clipExtent([[x - 0.425 * k + epsilon, y + 0.120 * k + epsilon], [x - 0.214 * k - epsilon, y + 0.234 * k - epsilon]]) .stream(pointStream); hawaiiPoint = hawaii .translate([x - 0.205 * k, y + 0.212 * k]) .clipExtent([[x - 0.214 * k + epsilon, y + 0.166 * k + epsilon], [x - 0.115 * k - epsilon, y + 0.234 * k - epsilon]]) .stream(pointStream); puertoRicoPoint = puertoRico .translate([x + 0.350 * k, y + 0.224 * k]) .clipExtent([[x + 0.320 * k, y + 0.204 * k], [x + 0.380 * k, y + 0.234 * k]]) .stream(pointStream); return reset(); }; albersUsa.fitExtent = function(extent, object) { return fitExtent(albersUsa, extent, object); }; albersUsa.fitSize = function(size, object) { return fitSize(albersUsa, size, object); }; albersUsa.fitWidth = function(width, object) { return fitWidth(albersUsa, width, object); }; albersUsa.fitHeight = function(height, object) { return fitHeight(albersUsa, height, object); }; function reset() { cache = cacheStream = null; return albersUsa; } return albersUsa.scale(1070); }32:T986,geoStream = { function streamGeometry(geometry, stream) { if (geometry && streamGeometryType.hasOwnProperty(geometry.type)) { streamGeometryType[geometry.type](geometry, stream); } } var streamObjectType = { Feature: function(object, stream) { streamGeometry(object.geometry, stream); }, FeatureCollection: function(object, stream) { var features = object.features, i = -1, n = features.length; while (++i < n) streamGeometry(features[i].geometry, stream); } }; var streamGeometryType = { Sphere: function(object, stream) { stream.sphere(); }, Point: function(object, stream) { object = object.coordinates; stream.point(object[0], object[1], object[2]); }, MultiPoint: function(object, stream) { var coordinates = object.coordinates, i = -1, n = coordinates.length; while (++i < n) object = coordinates[i], stream.point(object[0], object[1], object[2]); }, LineString: function(object, stream) { streamLine(object.coordinates, stream, 0); }, MultiLineString: function(object, stream) { var coordinates = object.coordinates, i = -1, n = coordinates.length; while (++i < n) streamLine(coordinates[i], stream, 0); }, Polygon: function(object, stream) { streamPolygon(object.coordinates, stream); }, MultiPolygon: function(object, stream) { var coordinates = object.coordinates, i = -1, n = coordinates.length; while (++i < n) streamPolygon(coordinates[i], stream); }, GeometryCollection: function(object, stream) { var geometries = object.geometries, i = -1, n = geometries.length; while (++i < n) streamGeometry(geometries[i], stream); } }; function streamLine(coordinates, stream, closed) { var i = -1, n = coordinates.length - closed, coordinate; stream.lineStart(); while (++i < n) coordinate = coordinates[i], stream.point(coordinate[0], coordinate[1], coordinate[2]); stream.lineEnd(); } function streamPolygon(coordinates, stream) { var i = -1, n = coordinates.length; stream.polygonStart(); while (++i < n) streamLine(coordinates[i], stream, 1); stream.polygonEnd(); } return function(object, stream) { if (object && streamObjectType.hasOwnProperty(object.type)) { streamObjectType[object.type](object, stream); } else { streamGeometry(object, stream); } } }33:[{"id":"8326f37ebb0e430088bde96410bb0426ff6a71b3a592bb20987200ca00f8be73a0083b26ab17cb714ce111f936f695b96e77faffc560a0071d839e0742bb54f5","href":"https://static.observableusercontent.com/files/8326f37ebb0e430088bde96410bb0426ff6a71b3a592bb20987200ca00f8be73a0083b26ab17cb714ce111f936f695b96e77faffc560a0071d839e0742bb54f5","name":"counties-10m.json","type":"application/octet-stream","lastModified":1622125039991.687,"size":842177}] 2f:{"title":"U.S. Map with Puerto Rico","cells":[{"id":0,"value":"md`# U.S. Map with Puerto Rico\n\nThis is a fork of this [notebook](https://observablehq.com/@d3/u-s-map-with-puerto-rico) but adds [fitExtent](https://github.com/d3/d3-geo#projection_fitExtent), [fitSize](https://github.com/d3/d3-geo#projection_fitSize), [fitWidth](https://github.com/d3/d3-geo#projection_fitSize) and [fitHeight](https://github.com/d3/d3-geo#projection_fitHeight) to the projection function.\n\n~~~js\nimport { geoAlbersUsaPr } from \"@washpostgraphics/geo-albers-usa-pr\"\n~~~`","pinned":false,"hidden":false,"mode":"ojs"},{"id":163,"value":"{\n const svg = d3.create(\"svg\") \n .attr(\"width\", width)\n .attr(\"height\", height)\n \n const g = svg.append(\"g\")\n .attr(\"fill\", \"none\")\n .attr(\"stroke\", \"#000\")\n .attr(\"stroke-linejoin\", \"round\")\n .attr(\"stroke-linecap\", \"round\");\n\n g.append(\"path\")\n .datum(countiesInner)\n .attr(\"stroke\", \"#aaa\")\n .attr(\"stroke-width\", 0.5)\n .attr(\"d\", path);\n \n g.append(\"path\")\n .datum(statesInner)\n .attr(\"stroke-width\", 0.5)\n .attr(\"d\", path);\n \n g.append(\"path\")\n .datum(usOuter)\n .attr(\"d\", path);\n \n return svg.node()\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":228,"value":"toc({selector: \"h2\", heading: \"Jump to:\"});","pinned":false,"hidden":false,"mode":"ojs"},{"id":209,"value":"md`## Data`","pinned":false,"hidden":false,"mode":"ojs"},{"id":171,"value":"usOuter = topojson.feature(us, us.objects.nation)","pinned":true,"hidden":false,"mode":"ojs"},{"id":174,"value":"statesInner = topojson.mesh(us, us.objects.states, (a, b) => a !== b)","pinned":true,"hidden":false,"mode":"ojs"},{"id":200,"value":"countiesInner = topojson.mesh(us, us.objects.counties, (a, b) => a !== b && (a.id / 1000 | 0) === (b.id / 1000 | 0))","pinned":true,"hidden":false,"mode":"ojs"},{"id":13,"value":"us = FileAttachment(\"counties-10m.json\").json()","pinned":true,"hidden":false,"mode":"ojs"},{"id":216,"value":"md`## Generators`","pinned":false,"hidden":false,"mode":"ojs"},{"id":167,"value":"projection = geoAlbersUsaPr().fitSize([width, height], usOuter)","pinned":true,"hidden":false,"mode":"ojs"},{"id":47,"value":"path = d3.geoPath(projection)","pinned":true,"hidden":false,"mode":"ojs"},{"id":212,"value":"md`## Dimensions`","pinned":false,"hidden":false,"mode":"ojs"},{"id":164,"value":"height = width * .58","pinned":true,"hidden":false,"mode":"ojs"},{"id":219,"value":"md`## Source`","pinned":false,"hidden":false,"mode":"ojs"},{"id":100,"value":"$31","pinned":true,"hidden":false,"mode":"ojs"},{"id":95,"value":"function multiplex(streams) {\n const n = streams.length;\n return {\n point(x, y) { for (const s of streams) s.point(x, y); },\n sphere() { for (const s of streams) s.sphere(); },\n lineStart() { for (const s of streams) s.lineStart(); },\n lineEnd() { for (const s of streams) s.lineEnd(); },\n polygonStart() { for (const s of streams) s.polygonStart(); },\n polygonEnd() { for (const s of streams) s.polygonEnd(); }\n };\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":125,"value":"function fitExtent(projection, extent, object) {\n return fit(projection, function(b) {\n var w = extent[1][0] - extent[0][0],\n h = extent[1][1] - extent[0][1],\n k = Math.min(w / (b[1][0] - b[0][0]), h / (b[1][1] - b[0][1])),\n x = +extent[0][0] + (w - k * (b[1][0] + b[0][0])) / 2,\n y = +extent[0][1] + (h - k * (b[1][1] + b[0][1])) / 2;\n projection.scale(150 * k).translate([x, y]);\n }, object);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":128,"value":"function fitSize(projection, size, object) {\n return fitExtent(projection, [[0, 0], size], object);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":123,"value":"function fit(projection, fitBounds, object) {\n var clip = projection.clipExtent && projection.clipExtent();\n projection.scale(150).translate([0, 0]);\n if (clip != null) projection.clipExtent(null);\n geoStream(object, projection.stream(boundsStream));\n fitBounds(boundsStream.result());\n if (clip != null) projection.clipExtent(clip);\n return projection;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":131,"value":"function fitWidth(projection, width, object) {\n return fit(projection, function(b) {\n var w = +width,\n k = w / (b[1][0] - b[0][0]),\n x = (w - k * (b[1][0] + b[0][0])) / 2,\n y = -k * b[0][1];\n projection.scale(150 * k).translate([x, y]);\n }, object);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":134,"value":"function fitHeight(projection, height, object) {\n return fit(projection, function(b) {\n var h = +height,\n k = h / (b[1][1] - b[0][1]),\n x = -k * b[0][0],\n y = (h - k * (b[1][1] + b[0][1])) / 2;\n projection.scale(150 * k).translate([x, y]);\n }, object);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":161,"value":"boundsStream = {\n var x0 = Infinity,\n y0 = x0,\n x1 = -x0,\n y1 = x1;\n \n var boundsStream = {\n point: boundsPoint,\n lineStart: noop,\n lineEnd: noop,\n polygonStart: noop,\n polygonEnd: noop,\n result: function() {\n var bounds = [[x0, y0], [x1, y1]];\n x1 = y1 = -(y0 = x0 = Infinity);\n return bounds;\n }\n };\n\n function boundsPoint(x, y) {\n if (x < x0) x0 = x;\n if (x > x1) x1 = x;\n if (y < y0) y0 = y;\n if (y > y1) y1 = y;\n } \n \n function noop() {}\n \n return boundsStream\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":139,"value":"$32","pinned":true,"hidden":false,"mode":"ojs"},{"id":109,"value":"epsilon = 1e-6","pinned":true,"hidden":false,"mode":"ojs"},{"id":222,"value":"md`## Imports`","pinned":false,"hidden":false,"mode":"ojs"},{"id":224,"value":"import { toc } from \"@harrystevens/toc\"","pinned":true,"hidden":false,"mode":"ojs"},{"id":10,"value":"topojson = require(\"topojson-client@3\")","pinned":true,"hidden":false,"mode":"ojs"},{"id":7,"value":"d3 = require(\"d3-geo@2\", \"d3-selection@2\")","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}