31:[] 2f:{"title":"Hillshading the Grand Canyon","cells":[{"id":0,"value":"md`# Hillshading the Grand Canyon\n\n\n*Refs: [@sahilchinoy’s](https://observablehq.com/@sahilchinoy) [Hillshader](https://observablehq.com/@sahilchinoy/hillshader), [A faster hillshader](https://observablehq.com/@sahilchinoy/a-faster-hillshader), and [Multidirectional hillshader](https://observablehq.com/@sahilchinoy/multidirectional-hillshader)\n*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"html`\n\n

${drawMap(colorData)}

${drawMap(\n hillshadeMultidirectional(demData)\n )}

\n`","pinned":false,"hidden":false,"mode":"ojs"},{"id":9,"value":"grandCanyonDEM =\n \"https://gist.githubusercontent.com/jashkenas/3832929d51c806c0bd142fac5175b2ae/raw/3192d6c475577e62f687dc5df96272c2ee2fbae4/gc_dem_cropped.png\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":91,"value":"colorScale = d3\n .scaleLinear()\n .domain([0, 20, 100, 150, 200, 275])\n .range([\"#3a81c1\", \"#96c0e6\", \"#42ab74\", \"#84ecd0\", \"#cef7b9\", \"#fff\"])","pinned":false,"hidden":false,"mode":"ojs"},{"id":17,"value":"height = 719","pinned":false,"hidden":false,"mode":"ojs"},{"id":46,"value":"hillshadeMultidirectional = demData => {\n var imageData = new Uint8ClampedArray(demData.length);\n\n const aspectData = getAspectData(demData);\n\n const azimuths = [225, 270, 315, 360];\n\n const weights = azimuths.map(d => generateWeightMatrix(aspectData, d));\n\n const maps = azimuths.map(d => hillshader(demData, d, 45));\n\n for (var n = 0; n < demData.length; n += 4) {\n const val = parseInt(\n azimuths\n .map((d, i) => weights[i][n] * maps[i][n])\n .reduce((a, b) => a + b) / 2\n );\n\n imageData[n] = val;\n imageData[n + 1] = val;\n imageData[n + 2] = val;\n imageData[n + 3] = 255;\n }\n\n return imageData;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"import {getAspectData, generateWeightMatrix} with {demData, height} from \"@sahilchinoy/multidirectional-hillshader\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":48,"value":"import {hillshader, drawHillshade} with {height, demData} from '@sahilchinoy/a-faster-hillshader'","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"import {d3, drawMap, demData, drawHillshade, colorData} with {grandCanyonDEM as molokai, height, colorScale} from \"@sahilchinoy/hillshader\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W31","stdlib":"1","titling":"auto"}