2b:null 2c:["$","title",null,{"children":"Searching maximum by Hessian | Chuncheng | Observable"}] 31:Tc3d,gradientSteps = (initX = 0.6, initY = 0.4, t = 0.5) => { const { ctx } = canvasStuff, trace = [], traceNewton = [], scaleX = d3.scaleLinear().domain([0, 1]).range([0, width]), scaleY = d3.scaleLinear().domain([0, 1]).range([0, height]); { var x = initX, //d3.randomUniform()(), y = initY, //d3.randomUniform()(); dx, dy, n = 100; trace.push(Object.assign({}, { r: 0, i: 0, x, y })); for (let i = 1; i < n + 1; ++i) { dx = dfdx(x, y, t) * unitX; dy = dfdy(x, y, t) * unitX; x -= dx; y -= dy; trace.push(Object.assign({}, { r: i / n, i, x, y })); } } { var x = initX, //d3.randomUniform()(), y = initY, //d3.randomUniform()(); dx, dy, d2xx, d2xy, d2yx, d2yy, grad, hessian, svd, hessianInv, dxdy, n = 20; traceNewton.push(Object.assign({}, { r: 0, i: 0, x, y })); for (let i = 1; i < n; ++i) { d2xx = d2fdxdx(x, y, t); d2xy = d2fdxdy(x, y, t); d2yx = d2fdydx(x, y, t); d2yy = d2fdydy(x, y, t); dx = dfdx(x, y, t); dy = dfdy(x, y, t); grad = new ML.Matrix([[dx], [dy]]); hessian = new ML.Matrix([ [d2xx, d2xy], [d2yx, d2yy] ]); svd = new ML.SVD(hessian); if (svd.s[0] > 0 && svd.s[1] > 0) { hessianInv = ML.inverse(hessian); dxdy = hessianInv.mmul(grad).data.map((d) => d[0]); x -= dxdy[0]; y -= dxdy[1]; } traceNewton.push(Object.assign({}, { r: i / n, i, x, y })); } } // const drawPnt = ({ r, i, x, y }) => { // ctx.beginPath(); // ctx.rect(scaleX(x), scaleY(y), 3, 3); // ctx.fillStyle = d3.interpolateWarm(r); //"white"; // ctx.fill(); // }; // trace.map((d) => drawPnt(d)); if (checkboxes.includes("Grad")) { for (let i = 1; i < trace.length; ++i) { const { x: x1, y: y1, r } = trace[i - 1], { x: x2, y: y2 } = trace[i]; ctx.beginPath(); ctx.moveTo(scaleX(x1), scaleY(y1)); ctx.lineTo(scaleX(x2), scaleY(y2)); ctx.strokeStyle = d3.interpolateWarm(r); ctx.lineWidth = 2; ctx.stroke(); if (i === 1 || i === trace.length - 1) { ctx.beginPath(); ctx.rect(scaleX(x1) - 10, scaleY(y1) - 10, 20, 20); ctx.strokeStyle = "gray"; ctx.lineWidth = 1; ctx.stroke(); } } } if (checkboxes.includes("Hessian")) { for (let i = 1; i < traceNewton.length; ++i) { const { x: x1, y: y1, r } = traceNewton[i - 1], { x: x2, y: y2 } = traceNewton[i]; ctx.beginPath(); ctx.moveTo(scaleX(x1), scaleY(y1)); ctx.lineTo(scaleX(x2), scaleY(y2)); ctx.strokeStyle = d3.interpolateGreys(r); ctx.lineWidth = 2; ctx.stroke(); if (i === 1 || i === traceNewton.length - 1) { ctx.beginPath(); if (i === 1) ctx.rect(scaleX(x1) - 5, scaleY(y1) - 5, 10, 10); else ctx.rect(scaleX(x2) - 5, scaleY(y2) - 5, 10, 10); ctx.strokeStyle = "white"; ctx.lineWidth = 2; ctx.stroke(); } } } }32:T472,{ refreshBtn; const { canvas, ctx, imageData, tStep } = canvasStuff, { width, height } = canvas, { data } = imageData; var x, y, v, r, g = 10, b; function drawPlasma(secs = 0.5) { const t = (secs / 5) * timeScaler; for (let i = 0; i < width; i++) { for (let j = 0; j < height; j++) { x = i / width; y = j / height; v = getPixel(x, y, t); // * 0.5 + 0.5; if (v > 0) { r = v * 200; b = 0; } else { r = 0; b = -v * 200; } data[(i + j * width) * 4 + 0] = r; data[(i + j * width) * 4 + 1] = g; data[(i + j * width) * 4 + 2] = b; data[(i + j * width) * 4 + 3] = 255; } } ctx.putImageData(imageData, 0, 0); gradientSteps(0.4, 0.6, t); gradientSteps(0.5, 0.6, t); gradientSteps(0.4, 0.5, t); gradientSteps(0.5, 0.5, t); statsMonitor.update(); return t; } var secs = performance.now() / 1000; drawPlasma(secs); while (toggle) { secs = performance.now() / 1000; yield drawPlasma(secs); // yield secs; } }33:[] 2f:{"id":"c5c6f51a88388d12","slug":"searching-maximum-by-hessian","title":"Searching maximum by Hessian","thumbnail":"d67ce3587b6967d56b89f98b677929ad6024eca184a8dbbfb119bec3a3c32bc2","access_level":"public","create_time":"$D2023-11-12T07:01:15.999Z","update_time":"$D2023-11-13T12:59:38.432Z","view_time":null,"first_public_time":"$D2023-11-12T07:01:15.999Z","fork":{"id":"23c3a2d8b2993f50","slug":"searching-maximum-by-gradient-ascending","title":"Searching maximum by gradient ascending","owner":{"id":"bcd65cef1cb4d2ed","login":"listenzcc","name":"Chuncheng"}},"stars":1,"starred":false,"owner":{"type":"team","id":"bcd65cef1cb4d2ed","login":"listenzcc","name":"Chuncheng","avatar_url":"https://avatars-next.observableusercontent.com/bb3c68e77a708a587ffc2d663bb83421f20d67991dbe6c1623c6e5d2fb73d15e","tier":"starter_2024"},"version":498,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"16328058352682a8","login":"listenzcc","name":"Chuncheng","avatar_url":"https://avatars-next.observableusercontent.com/bb3c68e77a708a587ffc2d663bb83421f20d67991dbe6c1623c6e5d2fb73d15e","tier":null}],"members":[{"type":"individual","id":"16328058352682a8","login":"listenzcc","name":"Chuncheng","avatar_url":"https://avatars-next.observableusercontent.com/bb3c68e77a708a587ffc2d663bb83421f20d67991dbe6c1623c6e5d2fb73d15e","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":null,"type":"notebook","body":{"title":"Searching maximum by Hessian","cells":[{"id":0,"value":"# Searching maximum by Hessian","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":164,"value":"viewof toggle = Inputs.toggle({ label: \"Active\", value: true })","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":339,"value":"viewof timeScaler = Inputs.range([0.1, 2], {\n label: \"Time scaler\",\n step: 0.1,\n value: 0.2\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":230,"value":"viewof refreshBtn = Inputs.button(\"Refresh button\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":462,"value":"viewof spatialZoom = Inputs.range([0.5, 5], {\n label: \"Spatial zoom\",\n step: 0.1,\n value: 1.5\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":434,"value":"viewof checkboxes = Inputs.checkbox([\"Grad\", \"Hessian\"], {\n label: \"Select some\",\n value: [\"Grad\", \"Hessian\"]\n})","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"

${statsMonitor.dom}

\n ${canvasStuff.canvas}\n

","pinned":true,"hidden":false,"mode":"html","author":"$undefined","summary":"$undefined","output":"","database":"$undefined"},{"id":49,"value":"canvasStuff = {\n refreshBtn;\n\n const canvas = DOM.canvas(width, height),\n ctx = canvas.getContext(\"2d\"),\n imageData = ctx.getImageData(0, 0, canvas.width, canvas.height);\n\n return { canvas, ctx, imageData };\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":252,"value":"$31","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":269,"value":"d3.interpolateWarm(0)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":31,"value":"$32","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":446,"value":"dif = 1/10000","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":211,"value":"dfdx = (x, y, t) => {\n const dx = dif,\n df = getPixel(x + dx, y, t) - getPixel(x, y, t);\n\n return df / dx;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":237,"value":"dfdy = (x, y, t) => {\n const dy = dif,\n df = getPixel(x, y + dy, t) - getPixel(x, y, t);\n\n return df / dy;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":368,"value":"d2fdxdx = (x, y, t) => {\n const dx =dif,\n d = dfdx(x + dx, y, t) - dfdx(x, y, t);\n\n return d / dx;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":370,"value":"d2fdydx = (x, y, t) => {\n const dx = dif,\n d = dfdy(x + dx, y, t) - dfdy(x, y, t);\n\n return d / dx;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":375,"value":"d2fdxdy = (x, y, t) => {\n const dy = dif,\n d = dfdx(x, y + dy, t) - dfdx(x, y, t);\n\n return d / dy;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":372,"value":"d2fdydy = (x, y, t) => {\n const dy = dif,\n d = dfdy(x, y + dy, t) - dfdy(x, y, t);\n\n return d / dy;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":246,"value":"unitX = 1 / width","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":248,"value":"unitY = 1 / height","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":29,"value":"getPixel = (x, y, t) => {\n return noiseGen.noise3D(x * spatialZoom, y * spatialZoom, t);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":25,"value":"noiseGen = {\n const noiseGen = new simplexNoise(d3.randomUniform()());\n return noiseGen;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":18,"value":"width = 600","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":21,"value":"height = 400","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"statsMonitor = {\n const stats = new Stats(),\n { dom } = stats;\n dom.style.position = \"relative\";\n\n return stats;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":9,"value":"Stats = await require(\"https://cdn.jsdelivr.net/npm/stats-js@1.0.1/build/stats.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":7,"value":"simplexNoise = require(\"simplex-noise@2.4.0\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":360,"value":"ML = require(\"https://cdn.jsdelivr.net/npm/ml-matrix@6.10.5/matrix.umd.min.js\")","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":472,"value":"new ML.SVD(mat)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":362,"value":"mat = new ML.Matrix([\n [1, 0],\n [0, 2]\n])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":387,"value":"grad = new ML.Matrix([[1], [2]])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"