2a:null 2b:["$","title",null,{"children":"Space view made of multilayer simplex noise (work in progress) | x | Observable"}] 30:[] 2e:{"id":"a0270a3eeabe94c5","slug":"space-view-made-of-multilayer-simplex-noise","title":"Space view made of multilayer simplex noise (work in progress)","thumbnail":null,"access_level":"public","create_time":"$D2021-03-29T18:00:48.858Z","update_time":"$D2021-04-01T10:24:53.455Z","view_time":null,"first_public_time":"$D2021-03-29T18:08:04.516Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"0769ff99b3875329","login":"ndry","name":"x","avatar_url":"https://avatars-next.observableusercontent.com/c755f3e157b7a2713dd9b99ae6d708461888bf021a63291ec0082c0be57acf53","tier":"starter_2024"},"version":432,"publish_version":432,"role":null,"authored":false,"authors":[{"type":"individual","id":"45218b3eb975ae76","login":"gb1","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c755f3e157b7a2713dd9b99ae6d708461888bf021a63291ec0082c0be57acf53","tier":null}],"members":[{"type":"individual","id":"45218b3eb975ae76","login":"gb1","name":"","avatar_url":"https://avatars-next.observableusercontent.com/c755f3e157b7a2713dd9b99ae6d708461888bf021a63291ec0082c0be57acf53","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":null,"type":"notebook","body":{"titling":"auto","title":"Space view made of multilayer simplex noise (work in progress)","cells":[{"id":0,"value":"md`# Space view made of multilayer simplex noise (work in progress)\nref result: https://www.youtube.com/watch?v=P5_rZtSwIuc\n\nref source: https://gitlab.com/ndry/raketa2/-/blob/master/Assets/Simple%203D%20Noise/Resources/Shaders/NoiseS3DGPU.compute#L348-376`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":20,"value":"function frag1(x, y) {\n let n = 0;\n for (let i = -2; i < 2; i++) {\n const noiseScale = Math.exp(i * 2);\n n += simplexNoise.noise3D(x * noiseScale, y * noiseScale, i);\n }\n return greyShade(n / 2 + 0.5);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":265,"value":"function saturate(x) {\n return Math.max(0, Math.min(1, x));\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":264,"value":"function hue(h) {\n const r = Math.abs(h * 6 - 3) - 1;\n const g = 2 - Math.abs(h * 6 - 2);\n const b = 2 - Math.abs(h * 6 - 4);\n return [saturate(r), saturate(g), saturate(b)];\n}\n","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":386,"value":"base = 1.5","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":390,"value":"e0 = Math.log(distance / zoomTransform.k) / Math.log(base) - 1;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":393,"value":"e1s = {\n const a = {};\n for (let i = -14; i <= 17; i++) {\n a[i] = Math.floor(e0) + i;\n }\n return a;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":403,"value":"len1s = {\n const a = {};\n for (let i = -14; i <= 17; i++) {\n a[i] = Math.pow(base, e1s[i]);\n }\n return a;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":413,"value":"ampl1s = {\n const a = {};\n for (let i = -14; i <= 17; i++) {\n const e1 = e1s[i];\n const de = e1 - e0;\n a[i] = Math.exp(-de*de / (110));\n }\n return a;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":238,"value":"function frag(x, y, k) {\n let ampl = 0;\n let n = [0, 0, 0, 0];\n \n for (let i = -14; i <= 17; i++) {\n const e1 = e1s[i];\n const len1 = len1s[i];\n const x1 = x / len1;\n const y1 = y / len1;\n const de = e1 - e0;\n const ampl1 = ampl1s[i];\n ampl += ampl1;\n const n1 = simplexNoise.noise3D(x1, y1, e1 * 100000);\n const n3 = (\n 1.2 * Math.abs(Math.pow(\n Math.abs(n1), \n 7 + de * 0.25\n )) * Math.sign(n1)\n + 0.01\n + 0.08 * Math.sin((n1 * 7 - 3))\n ) * ampl1;\n const h = hue((e1 % 17) / 17);\n n[0] += h[0] * n3;\n n[1] += h[1] * n3;\n n[2] += h[2] * n3;\n n[3] += n3;\n }\n \n return [255 * saturate(n[0]), 255 * saturate(n[1]), 255 * saturate(n[2]), 255 * saturate(n[3])];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":254,"value":"distance = 550;","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2,"value":"canvas = context.canvas","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"context = {\n const context = DOM.context2d(canvasWidth, canvasHeight, 1);\n context.canvas.style.imageRendering = \"pixelated\";\n context.canvas.style.background = \"black\";\n return context;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":376,"value":"imageData = new ImageDataUint32(context.getImageData(0, 0, canvasWidth, canvasHeight));","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":182,"value":"renderer1 = {\n for (let i = 0; i < canvasHeight; i++) {\n for (let j = 0; j < canvasWidth; j++) {\n imageData.setPixelArr(\n j, i, \n frag((j - zoomTransform.x) / zoomTransform.k, \n (i - zoomTransform.y) / zoomTransform.k,\n zoomTransform.k));\n }\n }\n context.putImageData(imageData, 0, 0);\n return md`Renderer`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":33,"value":"seed = 4242;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":8,"value":"canvasWidth = 500;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":14,"value":"canvasHeight = 400","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":189,"value":"zoomTransform = {\n let zoomTransform = {x: 0, y: 0, k: 0};\n d3.select(canvas).call(\n d3.zoom()\n .on(\"zoom\", ({transform}) => zoomTransform = transform));\n while (true) {\n yield zoomTransform;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":47,"value":"function greyShade(v) {\n return 0xFF000000 + (Math.floor(v * 255) << 16) + (Math.floor(v * 255) << 8) + (Math.floor(v * 255) << 0)\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"simplexNoise = new SimplexNoise(seed);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":5,"value":"class ImageDataUint32 extends ImageData {\n constructor(imageData) {\n super(imageData.data, imageData.width, imageData.height);\n this.dataUint32 = new Uint32Array(this.data.buffer);\n }\n\n setPixel(x, y, abgr) {\n this.dataUint32[y * this.width + x] = abgr;\n }\n\n setPixelArr(x, y, [r, g, b, a]) {\n const i = 4 * (y * this.width + x);\n this.data[i + 0] = r;\n this.data[i + 1] = g;\n this.data[i + 2] = b;\n this.data[i + 3] = a;\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"SimplexNoise = (await import(\"https://jspm.dev/npm:simplex-noise@2.4.0\")).default;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"import {Button, Checkbox, Toggle, Radio, Range, Select, Text, Textarea, Search, Table} from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":146,"value":"d3 = require(\"d3@6\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":350,"value":"function shallowCompare(newObj, prevObj) {\n for (const key in newObj) {\n if (newObj[key] !== prevObj[key]) return true;\n }\n return false;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W30","stdlib":"1"}} 2f:"$2e:body"