43:["$","title",null,{"children":"Centering geoOrthographic by rotation | Clément Procureur | Observable"}] 4b:T504,map = html``4c:[] 47:{"id":"9542be1d590d69af","slug":"centering-geoorthographic-by-rotation","title":"Centering geoOrthographic by rotation","thumbnail":"c627a30e86fc489bdf45ee1f66188579ef0cff580509d0ba988a16647a8284b8","access_level":"public","create_time":"$D2018-05-23T12:41:51.541Z","update_time":"$D2018-05-24T09:59:56.081Z","view_time":null,"first_public_time":"$D2018-05-23T14:47:29.091Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"12ef2f0acebddab0","login":"lacroute","name":"Clément Procureur","avatar_url":"https://avatars-next.observableusercontent.com/7ade6689bb6c2b05eeebe6088080a3fdb6a5161bb7c9fd6554019cfb727e46ca","tier":"starter_2024","bio":"","followed_by_you":false,"follows_you":false},"version":350,"publish_version":350,"role":null,"authored":false,"authors":[{"type":"individual","id":"5db6a0ad93002bd9","login":"lacroute","name":"Clément Procureur","avatar_url":"https://avatars-next.observableusercontent.com/7ade6689bb6c2b05eeebe6088080a3fdb6a5161bb7c9fd6554019cfb727e46ca","tier":null,"bio":"","followed_by_you":false,"follows_you":false}],"members":[{"type":"individual","id":"5db6a0ad93002bd9","login":"lacroute","name":"Clément Procureur","avatar_url":"https://avatars-next.observableusercontent.com/7ade6689bb6c2b05eeebe6088080a3fdb6a5161bb7c9fd6554019cfb727e46ca","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Centering geoOrthographic by rotation","cells":[{"id":0,"value":"md`# Centering geoOrthographic by rotation`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"viewof width = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":312,"value":"viewof percentagePadding = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":295,"value":"viewof manualMode = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":284,"value":"viewof manualRotationPhi = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":288,"value":"viewof manualRotationLambda = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":204,"value":"debug = md`\n\\`percentagePadding = ${percentagePadding}\\`\\t\n\\`middleReference = ${middleReference}\\`\\t\n\\`centroid[0] = ${projection(centroid)[0]}\\`\\t\n\\`manualRotationLambda = ${manualRotationLambda}\\`\\t\n\\`manualRotationPhi = ${manualRotationPhi}\\`\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":158,"value":"placeFactory = (city) => {\n let coords = projection(city.coords)\n return svg``\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":154,"value":"wishedBounds = {\n const boundsWidth = citiesBounds[1][0] - citiesBounds[0][0]\n\n return svg`\n `\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"atmosphereWidth = 12","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":170,"value":"isMobile = width <= 400","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":243,"value":"middleReference = isMobile ? width / 2 : width / 4","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"centerParams = {\n const bounds = d3.geoPath(d3.geoOrthographic().scale(1)).bounds(MultiPoint)\n \n let r = manualMode ? [manualRotationLambda, manualRotationPhi] : isMobile ? [centroid[0], 5] : [70, 11]\n let s = percentagePadding * (width / 2) / (bounds[1][0] - bounds[0][0]) \n let t = [width / 2, s + atmosphereWidth / 2] // Center the earth and add extra padding to see the fat border\n r = r.map(a => -a)\n\n return {\n scale: s,\n rotate: r,\n translate: t\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":35,"value":"path = d3.geoPath(projection)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"projection = d3.geoOrthographic()\n .scale(centerParams.scale)\n .rotate(centerParams.rotate)\n .translate(centerParams.translate)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":121,"value":"centroid = d3.geoCentroid(MultiPoint)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":142,"value":"citiesBounds = path.bounds(MultiPoint)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":59,"value":"MultiPoint = {\n return { \n type: 'MultiPoint',\n coordinates: Object.keys(cities).map(key => cities[key].coords)\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":63,"value":"cities = {\n return {\n north: {name: 'Saint Petersburg', coords: [30.335098600000038, 59.9342802]},\n east: {name: 'Ekateringburg', coords: [60.60570250000001, 56.83892609999999]},\n south: {name: 'Grozny', coords: [45.681485599999974, 43.31687959999999]},\n west: {name: 'Kaliningrad', coords: [20.452214400000003, 54.7104264]}\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"land = topojson.feature(world, world.objects.land)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"world = d3.json(\"https://unpkg.com/world-atlas@1/world/110m.json\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":42,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":6,"value":"d3 = require(\"d3-fetch@1\", \"d3-geo\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4c","stdlib":"1"}} 42:null