2b:null 2c:["$","title",null,{"children":"Map with Graticule Labels | Christophe Yamahata | Observable"}] 31:T96b,map = { const clipIn = DOM.uid(); const clipOut = DOM.uid(); return html``; }32:[{"id":"5a35a251f8436ffaf8816bf04e79d4f535c20ede98cc65649fc7b1b4c5583288433695c2a0aa59473846edbcdd9331980eef177e90755557208adf086b3e19e4","href":"https://static.observableusercontent.com/files/5a35a251f8436ffaf8816bf04e79d4f535c20ede98cc65649fc7b1b4c5583288433695c2a0aa59473846edbcdd9331980eef177e90755557208adf086b3e19e4","name":"world-110m_withlakes.topo.json","type":"application/json","lastModified":1727344482673.148,"size":92469},{"id":"efcaaf9f0b260e09b6afeaee6dbc1b91ad45f3328561cd67eb16a1754096c1095f70d284acdc4b004910e89265b60eba2706334e0dc84ded38fd9209083d4cef","href":"https://static.observableusercontent.com/files/efcaaf9f0b260e09b6afeaee6dbc1b91ad45f3328561cd67eb16a1754096c1095f70d284acdc4b004910e89265b60eba2706334e0dc84ded38fd9209083d4cef","name":"land-50m.json","type":"application/octet-stream","lastModified":1727338978205.958,"size":545534}] 2f:{"id":"f6f3917004a1cd98","slug":"map-with-graticule-labels","title":"Map with Graticule Labels","thumbnail":"b66a9f7201e901fbde8632fb21eb86d496e8a3ef04dc0ed733f5931712a79f43","access_level":"public","create_time":"$D2024-09-26T08:22:58.205Z","update_time":"$D2024-09-26T13:50:38.015Z","view_time":null,"first_public_time":"$D2024-09-26T11:52:59.455Z","fork":{"id":"9067ae08f51d55f2","slug":"graticule-labels-stereographic","title":"Graticule labels (stereographic)","owner":{"id":"863951e3ebe4c0ae","login":"d3","name":"D3"}},"stars":0,"starred":false,"owner":{"type":"team","id":"dd67891d326bcfb1","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":"starter_2024"},"version":959,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"06f083eba60f5a76","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":null}],"members":[{"type":"individual","id":"06f083eba60f5a76","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":null,"role":"editor"},{"type":"team","id":"dd67891d326bcfb1","login":"christophe-yamahata","name":"Christophe Yamahata","avatar_url":"https://avatars-next.observableusercontent.com/8256ac716aa8395babba412b2835913d186874fa4190df57a4a28f2e60129876","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":0,"collection":{"id":"5ea5ed43fe2a637d","slug":"maps","title":"Maps","owner":{"id":"dd67891d326bcfb1","login":"christophe-yamahata","name":"Christophe Yamahata"}},"type":"notebook","body":{"title":"Map with Graticule Labels","cells":[{"id":1,"value":"# Map with Graticule Labels","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":345,"value":"viewof selected_projection = Inputs.select(projections, {\n label: \"Select a Projection\",\n format: d => d.name,\n value: projections.find(p => p.name === \"Eisenlohr conformal\")\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":265,"value":"viewof longitude = Inputs.range([-180, 180], {value: -105, step: 5, label: \"Center Longitude (°)\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":822,"value":"viewof display_longitudes = Inputs.toggle({label: \"Display Longitudes\", value: true})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":390,"value":"viewof labels_color = Inputs.color({label: \"Labels Color\", value: \"#7a7a7a\", datalist: schemeColors})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":339,"value":"viewof width = Inputs.range([500, 1000], {value: 600, step: 50, label: \"Map Width (in pixels)\"})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":11,"value":"$31","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":302,"value":"---\n## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":207,"value":"formatLatitude = y => `${Math.abs(y)}°${y < 0 ? \"S\" : y > 0 ? \"N\" : \"\"}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":210,"value":"formatLongitude = x => `${Math.abs(x)}°${x < 0 ? \"W\" : x > 0 ? \"E\": \"\"}`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":75,"value":"height = {\n const [[x0, y0], [x1, y1]] = d3.geoPath(projection.fitWidth(width, outline)).bounds(outline);\n const dx = x1 - x0;\n const k = (dx - margins.marginLeft - margins.marginRight) / dx;\n const dy = (y1 - y0) * k + margins.marginBottom + margins.marginTop;\n projection.scale(projection.scale() * k);\n projection.translate([(dx + margins.marginLeft - margins.marginRight) / 2, (dy + margins.marginTop - margins.marginBottom) / 2]);\n projection.precision(0.2);\n return Math.round(dy);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":392,"value":"schemeColors = [\n \"#4269d0\",\n \"#706143\",\n \"#ea2d10\",\n \"#0a8f70\",\n \"#a463f2\",\n \"#2f26ab\",\n \"#e51077\",\n \"#7a7a7a\",\n \"#000000\"\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":319,"value":"margins = Object({\n marginTop: 30,\n marginBottom: 30,\n marginLeft: 40,\n marginRight: 40\n}) ","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":111,"value":"path = d3.geoPath(projection)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":348,"value":"projections = [\n {name: \"Aitoff\", value: d3.geoAitoff()},\n {name: \"August\", value: d3.geoAugust()},\n {name: \"Azimuthal equal-area\", value: d3.geoAzimuthalEqualArea()},\n {name: \"Eisenlohr conformal\", value: d3.geoEisenlohr()},\n {name: \"Eckert V\", value: d3.geoEckert5()},\n {name: \"Flat-polar sinusoidal\", value: d3.geoMtFlatPolarSinusoidal()},\n {name: \"Ginzburg V\", value: d3.geoGinzburg5()}\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":16,"value":"projection = selected_projection.value.rotate([-longitude, 0])","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":255,"value":"offset = ([x, y], k) => {\n const [cx, cy] = projection.translate();\n const dx = x - cx, dy = y - cy;\n k /= (dx==0 && dy==0)? 1 : Math.hypot(dx, dy); // Avoid division by 0\n return [x + dx * k, y + dy * k];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":79,"value":"outline = d3.geoCircle().radius(90).center([longitude, 0])()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":36,"value":"graticule = d3.geoGraticule10()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":7,"value":"world = FileAttachment(\"land-50m.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":555,"value":"world_with_lakes = FileAttachment(\"world-110m_withlakes.topo.json\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":38,"value":"land = topojson.feature(world, world.objects.land)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":562,"value":"lakes = topojson.feature(world_with_lakes, world_with_lakes.objects.lakes)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":298,"value":"d3 = require(\"d3@7\", \"d3-geo-projection@4\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W32","stdlib":"1","titling":"auto"}} 30:"$2f:body"