2c:["$","title",null,{"children":"Typology | Nicolas Lambert | Observable"}] 31:[] 2f:{"id":"78b714e5ec228eb7","slug":"typo","title":"Typology","thumbnail":"9fac24ae5768d5a3308cae24f27d7f67d1ae30f92d65e681dc5317db4ce754b1","access_level":"public","create_time":"$D2023-12-19T12:07:29.486Z","update_time":"$D2026-09-04T10:57:03.563Z","view_time":null,"first_public_time":"$D2024-03-13T13:50:06.399Z","fork":false,"stars":12,"starred":false,"owner":{"type":"team","id":"6457aadd156df119","login":"neocarto","name":"Nicolas Lambert","avatar_url":"https://avatars-next.observableusercontent.com/c01b6664b447a3bb88f88dbfa170e3ef1d61f3a5b13c2fc613c8da5ef8bccb41","tier":"starter_2024"},"version":146,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"01f8081399df8778","login":"neocarto","name":"Nicolas Lambert","avatar_url":"https://avatars-next.observableusercontent.com/c01b6664b447a3bb88f88dbfa170e3ef1d61f3a5b13c2fc613c8da5ef8bccb41","tier":null}],"members":[{"type":"individual","id":"01f8081399df8778","login":"neocarto","name":"Nicolas Lambert","avatar_url":"https://avatars-next.observableusercontent.com/c01b6664b447a3bb88f88dbfa170e3ef1d61f3a5b13c2fc613c8da5ef8bccb41","tier":null,"role":"editor"},{"type":"team","id":"6457aadd156df119","login":"neocarto","name":"Nicolas Lambert","avatar_url":"https://avatars-next.observableusercontent.com/c01b6664b447a3bb88f88dbfa170e3ef1d61f3a5b13c2fc613c8da5ef8bccb41","tier":"starter_2024","role":"viewer"}],"comments":[],"custom_thumbnail":true,"trashed":false,"subscribed":null,"forks":4,"collection":{"id":"bfb3f0e24e42a069","slug":"geoviz","title":"geoviz","owner":{"id":"6457aadd156df119","login":"neocarto","name":"Nicolas Lambert"}},"type":"notebook","body":{"title":"Typology","cells":[{"id":0,"value":"# Typology","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":93,"value":"🆕 *Updated for Notebook 2.0*","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":7,"value":"disclaimer","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":46,"value":"To create a typology map, you can use the \"typo\" type. 2 arguments are required: data and var.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":48,"value":"viz.plot({ type: \"typo\", data: world, var: \"region\" })","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":51,"value":"Withe the attribute colors, you can defane a color palette available in the [dicopal](https://observablehq.com/@neocartocnrs/dicopal-library) library. You can also define an array of colors. With alphabetical, you can arrange the legend in an alphabetical order.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":55,"value":"viz.typo({\n data: world,\n var: \"region\",\n alphabetical: true\n})","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":60,"value":"You can also choose the order you want to match the colors you want. ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":62,"value":"viz.plot({\n type: \"typo\",\n data: world,\n var: \"region\",\n order: [\"Antarctica\", \"Oceania\", \"Africa\", \"America\", \"Asia\", \"Europe\"],\n colors: [\"grey\", \"green\", \"blue\", \"orange\", \"purple\", \"red\"]\n})","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":74,"value":"Everything is customizable. For example: ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":92,"value":"let svg = viz.create({\n projection: d3.geoOrthographic().rotate([-30, -60]),\n zoomable: \"versor\",\n width: 600\n });\n svg.plot({ type: \"outline\" });\n svg.plot({ type: \"graticule\", stroke: \"white\" });\n svg.plot({\n type: \"typo\",\n data: world,\n var: \"region\",\n strokeWidth: 0.3,\n leg_title: null,\n leg_pos: [20, 20],\n leg_frame: true,\n leg_frame_stroke: \"none\"\n });\n\n display(svg.render())\n","pinned":false,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":16,"value":"You can also build this kind of map with lower level function.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":36,"value":"const typo = viz.tool.typo(world.features.map((d) => d.properties.region));\n let svg = viz.create({\n width: 700,\n margin: [20, 0, 0, 0],\n zoomable: true,\n projection: d3.geoNaturalEarth1()\n });\n svg.outline();\n svg.path({\n strokeWidth: 0.2,\n data: world,\n fill: (d) => typo.colorize(d.properties.region),\n tip: (d) => `${d.properties.name} (${d.properties.region})`\n });\n svg.legend.typo_vertical({\n pos: [80, 180],\n title: \"Continents\",\n alphabetical: true,\n colors: typo.colors,\n types: typo.types,\n missing: false\n });\n display(svg.render())\n","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":9,"value":"## Appendix","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":11,"value":"import {\n style,\n world,\n disclaimer,\n aus,\n aus_roads,\n viz\n} from \"observable:@neocartocnrs/geoviz-appendix\"","pinned":true,"hidden":false,"mode":"js","author":"$undefined","summary":"$undefined"},{"id":13,"value":"style","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W31","stdlib":"2","titling":"auto"}} 30:"$2f:body" 2b:E{"digest":"NEXT_REDIRECT;replace;/@neocarto/typo;307;"}