2b:null 2c:["$","title",null,{"children":"Searching maximum by Hessian (Improve) | Chuncheng | Observable"}] 31:Td73,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, grad, alpha, d2xx, d2xy, d2yx, d2yy, hessian, hessianInv, dxdy, d, n = 10; 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] ]); if (false) { hessianInv = ML.inverse(hessian); dxdy = hessianInv.mmul(grad).data.map((d) => d[0]); d = mkGrad(dxdy[0], dxdy[1]); x -= d.dx; //dxdy[0]; y -= d.dy; //dxdy[1]; } { alpha = grad.transpose().mmul(grad).data[0][0] / grad.transpose().mmul(hessian).mmul(grad).data[0][0]; alpha = Math.abs(alpha); // alpha = -alpha; if (alpha > 0) { x -= dx * alpha; y -= dy * alpha; } } 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":"58b0ed5670e3645b","slug":"searching-maximum-by-hessian-improve","title":"Searching maximum by Hessian (Improve)","thumbnail":"1b803b6f9b0e877c247a1597224b9a25c88da72bbc169e0eb4cb3f6ac4e1e80d","access_level":"public","create_time":"$D2023-11-13T12:38:18.943Z","update_time":"$D2023-11-14T11:05:45.197Z","view_time":null,"first_public_time":"$D2023-11-13T12:38:18.943Z","fork":{"id":"c5c6f51a88388d12","slug":"searching-maximum-by-hessian","title":"Searching maximum by Hessian","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":547,"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":1,"collection":{"id":"1a3bf472363b1040","slug":"webgl-baby-step","title":"WebGL baby steps","owner":{"id":"bcd65cef1cb4d2ed","login":"listenzcc","name":"Chuncheng"}},"type":"notebook","body":{"title":"Searching maximum by Hessian (Improve)","cells":[{"id":0,"value":"# Searching maximum by Hessian (Improve)","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.05, 2], {\n label: \"Time scaler\",\n step: 0.05,\n value: 0.1\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":500,"value":"mkGrad = (dx, dy) => {\n const d = Math.sqrt(dx ** 2 + dy ** 2);\n\n return { dx: (dx / d) * unitX, dy: (dy / d) * unitX };\n}","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 return d2fdydx(x, y, t);\n\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":522,"value":"grad.transpose().mmul(mat).mmul(grad)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":387,"value":"grad = new ML.Matrix([[1], [3]])","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W33","stdlib":"1","titling":"auto"}} 30:"$2f:body"