30:[{"id":"14c365e67f11e89186673ac56deaa53a9e8fc8068eab0114fefdfec01ee16547d856b893ad765f2ac4f1932c76e31c19a3588a11182017224e74b053b053cdfa","href":"https://static.observableusercontent.com/files/14c365e67f11e89186673ac56deaa53a9e8fc8068eab0114fefdfec01ee16547d856b893ad765f2ac4f1932c76e31c19a3588a11182017224e74b053b053cdfa","name":"us.json","type":"application/octet-stream","lastModified":1572543346357.535,"size":656701}] 2e:{"title":"Clipped map tiles","cells":[{"id":0,"value":"

Clipped map tiles

D3 › Gallery

\n\n# Clipped map tiles\n\nThis map clips Mapbox Natural Earth II tiles to the contiguous United States. To avoid aliasing artifacts (thin white lines) between tiles, two layers of tiles are drawn, with the lower layer’s tiles enlarged by one pixel.","pinned":false,"hidden":false,"mode":"md"},{"id":3,"value":"map = svg``","pinned":true,"hidden":false,"mode":"ojs"},{"id":122,"value":"url = (x, y, z) => `https://${\"abc\"[Math.abs(x + y) % 3]}.tiles.mapbox.com/v4/mapbox.natural-earth-2/${z}/${x}/${y}${devicePixelRatio > 1 ? \"@2x\" : \"\"}.png?access_token=pk.eyJ1IjoibWJvc3RvY2siLCJhIjoiY2s5ZWRlbTM4MDE0eDNocWJ2aXR2amNmeiJ9.LEyjnNDr_BrxRmI4UDyJAQ`","pinned":true,"hidden":false,"mode":"ojs"},{"id":16,"value":"projection = d3.geoMercator()","pinned":true,"hidden":false,"mode":"ojs"},{"id":20,"value":"path = d3.geoPath(projection)","pinned":true,"hidden":false,"mode":"ojs"},{"id":10,"value":"tile = d3.tile()\n .size([width, height])\n .scale(projection.scale() * 2 * Math.PI)\n .translate(projection([0, 0]))","pinned":true,"hidden":false,"mode":"ojs"},{"id":237,"value":"width = 928","pinned":true,"hidden":false,"mode":"ojs"},{"id":14,"value":"height = {\n const [[x0, y0], [x1, y1]] = d3.geoPath(projection.fitWidth(width, land)).bounds(land);\n const dy = Math.ceil(y1 - y0), l = Math.min(Math.ceil(x1 - x0), dy);\n projection.scale(projection.scale() * (l - 1) / l).precision(0.2);\n return dy;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":153,"value":"land = FileAttachment(\"us.json\").json()\n .then(topology => topojson.feature(topology, topology.objects.land))\n .then(land => ({type: \"Polygon\", coordinates: land.geometry.coordinates[0]}))","pinned":true,"hidden":false,"mode":"ojs"},{"id":5,"value":"d3 = require(\"d3-geo@3\", \"d3-tile@1\")","pinned":true,"hidden":false,"mode":"ojs"}],"files":"$W30","stdlib":"1","titling":"auto"}