31:[] 2f:{"title":"A Web Map of Maceio from Scratch","cells":[{"id":0,"value":"md`# A Web Map of Maceio from Scratch\n\nThanks to [@mourner/simple-web-map](https://observablehq.com/@mourner/simple-web-map) to give me the tools\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1053,"value":"md`The city of Maceio (Brazil) has the longitude and latitude as following:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1044,"value":"longitude = -35.7351","pinned":false,"hidden":false,"mode":"ojs"},{"id":1049,"value":"latitude = -9.66625","pinned":false,"hidden":false,"mode":"ojs"},{"id":564,"value":"osmMap(longitude, latitude, 13)","pinned":false,"hidden":false,"mode":"ojs"},{"id":627,"value":"md`This static map was made from [OpenStreetMap](https://openstreetmap.org) tiles with *8 lines of code*:`","pinned":false,"hidden":false,"mode":"ojs"},{"id":526,"value":"osmMap = (longitude, latitude, zoom, w = width, h = 1000) => { \n let result = `

`,\n x = 256 * (1 << zoom) * (longitude / 360 + 0.5) - w / 2 | 0,\n y = 256 * (1 << zoom) * (1 - Math.log(Math.tan(Math.PI * (0.25 + latitude / 360))) / Math.PI) / 2 - h / 2 | 0;\n \n for (let ty = y / 256 | 0; ty * 256 < y + h; ty++)\n for (let tx = x / 256 | 0; tx * 256 < x + w; tx++) \n result += `

`;\n \n return html`${result}

`;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":679,"value":"md`You can use this in your own notebooks by importing the functions:\n\n~~~js\nimport {osmMap} from '@mourner/simple-web-map'\n\nimport {submit} from '@mbostock/more-deliberate-inputs'\n~~~\n\n`","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}