2c:null 2d:["$","title",null,{"children":"NatGeo The World Tube Map Layout | Saiful Azfar Ramlee | Observable"}] 32:T407,# NatGeo The World Tube Map Layout - Its just an attempt to recreate (with d3 and svg) one of my favorite' tube/wall map by nat geo - I'm not any part with natgeo or have any connection with nat geo at all...hope there are no copyright infringement just by doing this...if there are...any credit goes to natgeo itself (please support natgeo map buy the map at the linked image below) - The original plan was to 'play around' with various of d3.geo.projection and use d3.geo.polygon for clipping...eventhou im not clipping much on this map - The map are not super great for web literate presentation as some part of map are too small for eye read...unless there are implementation of zooming capabilities...but there's no doubt...its beatiful map...its true art - The maps placement are not as per original calculation and not intent to be...im not reproduce digital natgeo map here...eventhou its possible...since i have the original copies...and have all the calculation need...its just for education & for 'fun to code' purpose33:T97a,34:[{"id":"818786b80ea26ee587f4e287e5172125deed5e3ecae6109da7067eaffb6651d0c0ee265eab3070701c1c41400bd2fec5002b474a677b5b937c3321502d539895","href":"https://static.observableusercontent.com/files/818786b80ea26ee587f4e287e5172125deed5e3ecae6109da7067eaffb6651d0c0ee265eab3070701c1c41400bd2fec5002b474a677b5b937c3321502d539895","name":"todo-01.jpg","type":"image/jpeg","lastModified":1680905078189.331,"size":96933},{"id":"292a984ed57b1221e72870803ffc541821f7e5034bbd27cf3d113acb074b164f8b711f2ed5d2d180b9eff007bcfb52ef38daf92ba6af53e5f028a9f64da39558","href":"https://static.observableusercontent.com/files/292a984ed57b1221e72870803ffc541821f7e5034bbd27cf3d113acb074b164f8b711f2ed5d2d180b9eff007bcfb52ef38daf92ba6af53e5f028a9f64da39558","name":"todo-02.jpg","type":"image/jpeg","lastModified":1680905079441.046,"size":334171}] 30:{"id":"63fa416fb7f91e82","slug":"natgeo-the-world-tube-map-layout","title":"NatGeo The World Tube Map Layout","thumbnail":"a44b61538a0f70b3f165e858ec2c7b4936e990084ef2a07e1fa67dcb21647fdd","access_level":"public","create_time":"$D2023-04-05T11:59:05.914Z","update_time":"$D2023-04-25T15:21:01.526Z","view_time":null,"first_public_time":"$D2023-04-05T11:59:05.914Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"e421b786e4306453","login":"saifulazfar","name":"Saiful Azfar Ramlee","avatar_url":"https://avatars-next.observableusercontent.com/970ec42c2f05d7cc9925296dcbdfa80962843529800264e2e8c6ea0a6c295a86","tier":"starter_2024","bio":""},"version":546,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"82af4af5477d15d6","login":"saifulazfar","name":"Saiful Azfar Ramlee","avatar_url":"https://avatars-next.observableusercontent.com/970ec42c2f05d7cc9925296dcbdfa80962843529800264e2e8c6ea0a6c295a86","tier":null,"bio":""}],"members":[{"type":"individual","id":"82af4af5477d15d6","login":"saifulazfar","name":"Saiful Azfar Ramlee","avatar_url":"https://avatars-next.observableusercontent.com/970ec42c2f05d7cc9925296dcbdfa80962843529800264e2e8c6ea0a6c295a86","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"NatGeo The World Tube Map Layout","cells":[{"id":0,"value":"$32","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":38,"value":"$33","pinned":false,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":317,"value":"html`

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":531,"value":"## TODO\n- design svg pattern for the border","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":534,"value":"todo01 = FileAttachment(\"todo-01.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":543,"value":"- need to clip","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":540,"value":"todo02 = FileAttachment(\"todo-02.jpg\").image()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"center_map = d3.geoPath(\n d3.geoWinkel3().scale(185).rotate([0, 0]).center([0, 0]).translate([480, 300])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":98,"value":"north_polar = d3.geoPath(\n d3\n .geoAzimuthalEquidistant()\n .rotate([0, -90])\n .translate([75, 75])\n .scale(140)\n .clipAngle(45)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":185,"value":"south_polar = d3.geoPath(\n d3\n .geoAzimuthalEquidistant()\n .rotate([0, 90])\n .translate([885, 75])\n .scale(140)\n .clipAngle(45)\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":340,"value":"pops_density = d3.geoPath(\n d3.geoInterruptedHomolosine().scale(40).translate([810, 570])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":403,"value":"land_use = d3.geoPath(\n d3\n .geoInterruptedHomolosine()\n .scale(40)\n .translate([150, 570])\n)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":444,"value":"outline = ({ type: \"Sphere\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":30,"value":"width = 960","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":34,"value":"height = Math.min(width, 650)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":348,"value":"land = topojson.feature(world, world.objects.land)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"world = d3.json(\"https://unpkg.com/world-atlas@2/land-10m.json\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"d3 = require(\"d3@latest\", \"d3-geo@latest\", \"d3-geo-polygon@latest\", \"d3-geo-projection@latest\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1"}} 31:"$30:body"