2a:null 2b:["$","title",null,{"children":"Astronomy recolor | Toph & Visnu Stream | Observable"}] 30:[] 2e:{"id":"74779d75f65c2a8d","slug":"astronomy-recolor","title":"Astronomy recolor","thumbnail":"c119e73ae1992d153b332f0e1c457fa669bd392918df2db78884646bdfccb3c2","access_level":"public","create_time":"$D2022-09-02T18:04:30.541Z","update_time":"$D2022-09-02T22:20:09.056Z","view_time":null,"first_public_time":"$D2022-09-02T18:04:30.541Z","fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"f0b571ae609f9fba","login":"tv-stream-dream-team","name":"Toph & Visnu Stream","avatar_url":"https://avatars-next.observableusercontent.com/158d3860b6b72c0582146cf4279ffd799932eed88ad93d5ecdbc55bdd28236b4","tier":"starter_2024"},"version":360,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"dbf69c13a14d2f62","login":"visnup","name":"Visnu Pitiyanuvath","avatar_url":"https://avatars-next.observableusercontent.com/b847c4c49993b1df7599d355f47dc0ad9c2dcf43439ce9e8f3410e6368b3aac9","tier":null}],"members":[{"type":"team","id":"f0b571ae609f9fba","login":"tv-stream-dream-team","name":"Toph & Visnu Stream","avatar_url":"https://avatars-next.observableusercontent.com/158d3860b6b72c0582146cf4279ffd799932eed88ad93d5ecdbc55bdd28236b4","tier":"starter_2024","role":"editor"},{"type":"individual","id":"dbf69c13a14d2f62","login":"visnup","name":"Visnu Pitiyanuvath","avatar_url":"https://avatars-next.observableusercontent.com/b847c4c49993b1df7599d355f47dc0ad9c2dcf43439ce9e8f3410e6368b3aac9","tier":null,"role":"editor"}],"comments":[{"id":"fa3eaa094280e8dc","reply_to_id":null,"content":"You can also do the recoloring via SVG filters: https://observablehq.com/@mootari/svg-filter-scales","create_time":"$D2022-09-02T20:51:41.189Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null}},{"id":"31d716fb7ed19403","reply_to_id":"fa3eaa094280e8dc","content":"For canvas the way I do it is to create a uint32 lookup table for all 256 grey values. Since you can have a Uint32Array view of a Uint8ClampedArray, you can simply assign entire colors (instead of RGB values).","create_time":"$D2022-09-02T21:01:43.129Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null}},{"id":"f5a23c7b96b16408","reply_to_id":"fa3eaa094280e8dc","content":"(Here's a small helper to create a palette array from CSS colors: https://observablehq.com/@mootari/sibson-interpolation#createPalette)","create_time":"$D2022-09-02T21:04:36.262Z","update_time":null,"resolved":false,"user":{"type":"individual","id":"07362516b5994994","login":"mootari","name":"Fabian Iwand","avatar_url":"https://avatars-next.observableusercontent.com/0d7defa821f38094c03bad23b9b360a5364e6e97e21fc238c39ddc48db7994ad","tier":null}}],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"title":"Astronomy recolor","cells":[{"id":0,"value":"# Astronomy recolor\n\nRecolor astronomy (JWST?) images\n\n- https://www.bintel.com.au/narrowband-preview-tool/\n- https://twitter.com/trevorpaglen/status/1547284544398790658?s=21&t=spdw6T2ApcnqLb6J0Qbyqg\n- https://www.youtube.com/watch?v=DVuonz26P0w&t=118s\n- Wavelength to RGB Converter https://observablehq.com/d/9623d79f29618695 ripping off https://www.johndcook.com/wavelength_to_RGB.html","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"},{"id":10,"value":"// wavelengths in nm\nspectra = [\n { name: \"Hydrogen-alpha\", value: 656.3 },\n { name: \"Sulphur ii\", value: 673.1 },\n { name: \"Oxygen iii\", value: 500.7 }\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":127,"value":"visibleSpectrum = [380, 780]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":12,"value":"Plot.plot({\n x: {label: \"Wavelength (nm)\", domain: visibleSpectrum, axis: \"top\"},\n color: {type: \"identity\"},\n width,\n // height: 90,\n // marginTop: 45,\n marks: [\n Plot.tickX(d3.range(...visibleSpectrum, 0.5), {x: d => d, stroke: d => wavelengthToRGB(d), strokeWidth: 2}),\n Plot.tickX(spectra, {x: \"value\", strokeWidth: 3}),\n Plot.text(spectra, {x: \"value\", text: \"name\", dx: 5, textAnchor: \"start\", rotate: -30})\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":208,"value":"Plot.plot({\n x: {label: \"Remapped wavelength (nm)\", domain: visibleSpectrum},\n color: {type: \"identity\"},\n width,\n // height: 90,\n // marginTop: 45,\n marks: [\n Plot.tickX(d3.range(...visibleSpectrum, 0.5), {x: d => d, stroke: d => wavelengthToRGB(d), strokeWidth: 2}),\n Plot.tickX(remappedSpectra, {x: \"value\", strokeWidth: 3}),\n Plot.text(remappedSpectra, {x: \"value\", text: \"name\", dx: 5, textAnchor: \"start\", rotate: -30})\n ]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":181,"value":"viewof ha = Inputs.color({ label: \"Hydrogen-alpha\", value: \"#ff0000\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":187,"value":"viewof sii = Inputs.color({ label: \"Sulphur ii\", value: \"#00ff00\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":192,"value":"viewof oiii = Inputs.color({ label: \"Oxygen iii\", value: \"#0000ff\" })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":254,"value":"remappedSpectra = [\n { name: \"Hydrogen-alpha\", value: hueToWavelength(d3.hsl(ha).h) },\n { name: \"Sulphur ii\", value: hueToWavelength(d3.hsl(sii).h) },\n { name: \"Oxygen iii\", value: hueToWavelength(d3.hsl(oiii).h) }\n]","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":87,"value":"import {wavelengthToRGB, hueToWavelength} from \"9623d79f29618695\"","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":60,"value":"

\n \n

","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined"},{"id":109,"value":"https://css-tricks.com/color-filters-can-turn-your-gray-skies-blue/","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined"}],"files":"$W30","stdlib":"1","titling":"auto"}} 2f:"$2e:body"