2f:null 30:["$","title",null,{"children":"Hillshade maps with line fills, also water edition | Ingrid Burrington | Observable"}] 35:[] 33:{"id":"424e9dbd98855ad4","slug":"hillshade-maps-with-line-fills-also-water-edition","title":"Hillshade maps with line fills, also water edition","thumbnail":"e9a5c8955a2fa9ff3b58aafb3ee2fe38631129a0bee822076bba6dac077acdaf","access_level":"public","create_time":"$D2022-01-23T15:22:37.379Z","update_time":"$D2022-02-06T14:20:50.428Z","view_time":null,"first_public_time":"$D2022-01-24T16:00:40.293Z","has_unpublished_edits":null,"fork":{"id":"e966ae35a80d4c30","slug":"hillshade-maps-with-line-fills-but-with-diagonal-hatching-b","title":"Hillshade maps with line fills, but with diagonal hatching because it looks cool","owner":{"id":"6ae7f99f369fe7ae","login":"lifewinning","name":"Ingrid Burrington"}},"stars":4,"starred":false,"owner":{"type":"team","id":"6ae7f99f369fe7ae","login":"lifewinning","name":"Ingrid Burrington","avatar_url":"https://avatars-next.observableusercontent.com/361e8fec3b6688927a430032a2ebcc4a35bfb53a951f775e8a60fdac19e4f742","tier":"starter_2024"},"version":3199,"publish_version":3199,"role":null,"authored":false,"authors":[{"type":"individual","id":"87193242b5b8718c","login":"lifewinning","name":"Ingrid Burrington","avatar_url":"https://avatars-next.observableusercontent.com/361e8fec3b6688927a430032a2ebcc4a35bfb53a951f775e8a60fdac19e4f742","tier":null}],"members":[{"type":"individual","id":"87193242b5b8718c","login":"lifewinning","name":"Ingrid Burrington","avatar_url":"https://avatars-next.observableusercontent.com/361e8fec3b6688927a430032a2ebcc4a35bfb53a951f775e8a60fdac19e4f742","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":true,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Hillshade maps with line fills, also water edition","cells":[{"id":0,"value":"md`# Hillshade maps with line fills, also water edition`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":222,"value":"md`Having some ideas about lithium brine fields...`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2557,"value":"tile()[0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2988,"value":"w2 = width * 4","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":19,"value":"projection = d3\n .geoMercator()\n .center([-68.4, -23.6])\n .scale(800000 / (2 * Math.PI))\n .translate([width / 2, height / 2])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2376,"value":"splitZmap = svg``","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3170,"value":"viridish = [\"#414487\", \"#2a788e\", \"#22a884\", \"#7ad151\", \"#fde725\"]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3102,"value":"poly.flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2357,"value":"classedSplitZ = diss\n .map((h) =>\n h.features\n .map((m) =>\n path(m)\n .split(\"Z\")\n .map((s) => Polygon.fromPath(s))\n )\n .flat()\n )\n .flat()\n .map((m) => m.getHatches(PI / 3, 2, 0))\n .flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":232,"value":"hillshade = tiles\n .filter((t) => t.data.hillshade)\n .map((h) => h.data.hillshade)\n .map((m) => m.features)\n .flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1876,"value":"diss = poly.map((p) => turf.dissolve(turf.featureCollection(p))).flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1376,"value":"poly = hs_nest\n .map((e) =>\n e.values.map((v) =>\n v.values\n .map((h) => {\n if (h.geometry.type != \"Polygon\") {\n return turf.flatten(h).features.flat();\n } else {\n return h;\n }\n })\n .flat()\n )\n )\n .flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3057,"value":"waterSplitZ = poly_water\n .map((h) =>\n h.features\n .map(\n (m) => Polygon.fromPath(path(m))\n // .split(\"Z\")\n // .map((s) => Polygon.fromPath(s))\n )\n .flat()\n )\n .flat()\n .map((m) => m.getHatches(-PI / 3, 1, 0))\n .flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3180,"value":"segment_water = poly_water\n .map((h) =>\n h.features\n .map((m) => Polygon.fromPath(path(m)))\n .map((m) => m.getHatches(-PI / 3, 1.5, 0))\n )\n .flat()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3045,"value":"poly_water = water_nest\n .map((e) =>\n e.values\n .map((v) => {\n if (v.geometry.type != \"Polygon\") {\n return turf.flatten(v).features.flat();\n } else {\n return v;\n }\n })\n .flat()\n )\n .map((m) => turf.dissolve(turf.featureCollection(m)))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":1234,"value":"hs_nest = d3\n .nest()\n .key(function (d) {\n return d.properties.class;\n })\n .key(function (d) {\n return d.properties.level;\n })\n .entries(hillshade)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2976,"value":"water_nest = d3\n .nest()\n .key(function (d) {\n return d.properties.kind;\n })\n .entries(geom_water)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2763,"value":"geom_water = water\n .filter((m) => m.features.length > 0)\n .map((m) => m.features)\n .flat()\n .filter((f) => f.geometry.type != \"MultiLineString\")\n .filter((f) => f.geometry.type != \"LineString\")\n .filter((f) => f.geometry.type != \"Point\")\n// .filter((f) => f.properties.boundary == true)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"tiles = Promise.all(\n tile().map(async (t) => {\n let data = new vt.VectorTile(\n new Protobuf(\n await d3.buffer(\n `https://a.tiles.mapbox.com/v4/mapbox.mapbox-terrain-v2/${t.z}/${t.x}/${t.y}.mvt?access_token=pk.eyJ1Ijoid2FzaGluZ3RvbnBvc3QiLCJhIjoibWJkTGx1SSJ9.6cMdwgs-AYrRtQsEkXlHqg`\n )\n )\n ).layers;\n\n t.data = Object.keys(data).reduce((initialData, key) => {\n initialData[key] = {\n type: \"FeatureCollection\",\n features: [...Array(data[key].length).keys()].map((item, i) => {\n let feature = data[key].feature(i).toGeoJSON(t.x, t.y, t.z);\n return feature;\n })\n };\n\n return initialData;\n }, {});\n\n return t;\n })\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2947,"value":"tile().map(\n (t) =>\n `https://a.tiles.mapbox.com/v4/mapbox.mapbox-terrain-v2/${t.z}/${t.x}/${t.y}.mvt?access_token=pk.eyJ1Ijoid2FzaGluZ3RvbnBvc3QiLCJhIjoibWJkTGx1SSJ9.6cMdwgs-AYrRtQsEkXlHqg`\n)[0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2759,"value":"water = Promise.all(\n tile().map(async (d) => {\n d.data = await d3.json(\n `https://tile.nextzen.org/tilezen/vector/v1/256/all/${d.z}/${d.x}/${d.y}.json?api_key=ztkh_UPOQRyakWKMjH_Bzg`\n );\n return d.data.water;\n })\n)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2939,"value":"tile().map(\n (d) =>\n `https://tile.nextzen.org/tilezen/vector/v1/256/all/${d.z}/${d.x}/${d.y}.json?api_key=ztkh_UPOQRyakWKMjH_Bzg`\n)[0]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"Protobuf = require(\"pbf@3/dist/pbf.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":17,"value":"d3 = require(\"d3-geo@1\", \"d3-selection@1\", \"d3-fetch@1\", \"d3-tile@0.0\", \"d3-collection@latest\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":23,"value":"tile = d3.tile()\n .size([width, height])\n .scale(projection.scale() * 2 * Math.PI)\n .translate(projection([0,0]))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"height = 800","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":44,"value":"path = d3.geoPath(projection)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":614,"value":"clip = require(\"polygon-clipping@0.15.3\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":612,"value":"turf = require(\"@turf/turf@latest\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"vt = require('https://bundle.run/@mapbox/vector-tile@1.3.1')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":2095,"value":"import { Polygon, PI } from \"@makio135/utilities\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3067,"value":"xyz = require(\"https://bundle.run/xyz-affair@0.9.1\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3090,"value":"to do: instead of d3.tile use xyz-affair so you're not having to fiddle with projection.scale ","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":3086,"value":"bounds = [\n [-69.04083251953125, -23.96617587126503],\n [-67.379150390625, -22.92804166565175]\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":3088,"value":"xyz(bounds, 11)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W35","stdlib":"1","titling":"auto"}} 34:"$33:body"