2e:null 2f:["$","title",null,{"children":"Variants of the shape of the area attribute value of our ‹h3-worldmap› web component | Olivier Lange | Observable"}] 34:[] 32:{"id":"c5a96053d3dac353","slug":"h3-worldmap-data-variants","title":"Variants of the shape of the area attribute value of our ‹h3-worldmap› web component","thumbnail":"3f93c003a9a44a85dd6ec627e6ea19793140a98417c8f19dd812ab855d87487d","access_level":"public","create_time":"$D2022-08-22T19:52:28.128Z","update_time":"$D2022-08-22T22:06:47.740Z","view_time":null,"first_public_time":"$D2022-08-22T20:05:20.582Z","has_unpublished_edits":null,"fork":{"id":"2b3cd10a462acec1","slug":"h3-worldmap","title":"‹h3-worldmap› web component","owner":{"id":"3febe0974a7138cb","login":"olange","name":"Olivier Lange"}},"stars":0,"starred":false,"owner":{"type":"team","id":"3febe0974a7138cb","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/52639e5630d4e3e4e2772fe77680883002a0b9352d8dd7a649dbcb67b1e1fb3a","tier":"starter_2024"},"version":1318,"publish_version":1318,"role":null,"authored":false,"authors":[{"type":"individual","id":"deea7e78e25caede","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/05f7623b298d024c8fdb05b03c59e2d52fe0349b7c85bced7cdea69e7dcb847a","tier":null}],"members":[{"type":"individual","id":"deea7e78e25caede","login":"olange","name":"Olivier Lange","avatar_url":"https://avatars-next.observableusercontent.com/05f7623b298d024c8fdb05b03c59e2d52fe0349b7c85bced7cdea69e7dcb847a","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"370e9f1fd8411c5c","slug":"h3","title":"H3","owner":{"id":"3febe0974a7138cb","login":"olange","name":"Olivier Lange"}},"type":"notebook","body":{"title":"Variants of the shape of the area attribute value of our ‹h3-worldmap› web component","cells":[{"id":0,"value":"# Variants of the shape of the `area` attribute value of our `‹h3-worldmap›` web component\n\nExploration of the possible _variants_ of the _data structures_ which could express **sets** of [H3 indexes](https://h3geo.org/docs/) to draw on the terrestrial globe, with the given geodesic projection.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1218,"value":"## 1. Current accepted form\n\nAn array of H3-indexes. We should probably also accept a set, and any _iterable_ yielding H3-indexes as strings.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1011,"value":"areasCurrentForm = [ \"80abfffffffffff\", \"80e1fffffffffff\", \"80a5fffffffffff\",\n \"8035fffffffffff\", \"801ffffffffffff\" ]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1084,"value":"H3WorldMap, html`\n \n `","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"html`\n \n \n \n \n \n \n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1162,"value":"## 2. Future target forms","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1196,"value":"### Canonic form\n\nExplicit styling and optional captions. An array or set of _records_ (objects with same structure) containing an H3-index each. And any _iterable_ yielding such _records_.\n\nAll other (alternate) forms would be transformed to this one. Setting the captions might be non-trivial, so we might start with styling only.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1122,"value":"areaFutureFormTarget = [\n { area: \"80abfffffffffff\", title: \"New Board\", style: \"highlighted\" },\n { area: \"80e1fffffffffff\", title: \"Existing Board 01\", style: \"normal\" },\n { area: \"80a5fffffffffff\", title: \"Existing Board 02\", style: \"normal\" },\n { area: \"8035fffffffffff\", title: \"Existing Board 03\", style: \"normal\" },\n { area: \"801ffffffffffff\", title: \"Existing Board 04\", style: \"normal\" }\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1236,"value":"### Alternate future forms","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1170,"value":"Automatic styling and no captions. An array of arrays. Might be the simplest to implement, at first, and most easy to use. Might be internally transformed to `areaFutureFormTarget`, without a `title` property.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1188,"value":"areaFutureFormAlt01 = [\n [ \"80abfffffffffff\", \"80a5fffffffffff\", \"8035fffffffffff\", \"801ffffffffffff\" ],\n [ \"80e1fffffffffff\" ]\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1242,"value":"Other possible alternate forms; might all be transformed internally to `areaFutureFormTarget`:","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":1178,"value":"areasFutureFormAlt02 = ({\n g1: [ \"80abfffffffffff\", \"80a5fffffffffff\", \"8035fffffffffff\", \"801ffffffffffff\" ],\n g2: [ \"80e1fffffffffff\" ]\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":884,"value":"areasFutureFormAlt03 = ({\n g1: {\n title: \"Existing boards\", style: \"normal\",\n areas: [ \"80abfffffffffff\", \"80e1fffffffffff\", \"80a5fffffffffff\", \"8035fffffffffff\", \"801ffffffffffff\" ] },\n g2: {\n title: \"New board\", style: \"highlighted\",\n areas: [ \"80abfffffffffff\" ] },\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1138,"value":"areasFutureFormAlt04 = ({\n groups: {\n g1: { title: \"Existing boards\", style: \"…\" },\n g2: { title: \"New boards\", style: \"…\" }\n },\n areas: {\n g1: [ \"80abfffffffffff\", \"80a5fffffffffff\", \"8035fffffffffff\", \"801ffffffffffff\" ],\n g2: [ \"80e1fffffffffff\" ]\n }\n})\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"## Dependencies","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1080,"value":"html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":195,"value":"import {worldAtlasSrc, H3WorldMap} from \"@olange/h3-worldmap\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 33:"$32:body"