29:null 2a:["$","title",null,{"children":"Visualization of matrix application and scalar product | Yaroslav Sergienko | Observable"}] 2f:T7be,function drawScalarProduct(ctx, vec1Vals, rect1, vec2Vals, rect2, time, resWidth, resLabel) { const rectDistance = rect2[1] - rect1[1]; const delta = rectDistance / 2 - rect1[3] * 0.5; if (time <= 1) { time = smooth(time); let [x0a, y0a, wa, ha] = rect1; let [x0b, y0b, wb, hb] = rect2; y0a += time * 0; y0b -= time * delta * 2; ha *= (1 - time); hb *= (1 - time); drawVector(ctx, vec1Vals, [x0a, y0a, wa, ha], '', 1); drawVector(ctx, vec2Vals, [x0b, y0b, wb, hb], '', 1); const alpha = 1; ctx.lineWidth = 4; for (let i=0; i= 0 ? 1 : -1;\n } else {\n return x < -1/3 ? -1 : (x > 1/3 ? 1 : 0);\n }\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":404,"value":"$2f","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":521,"value":"function smooth(t) {\n return (1 - Math.cos(clamp(t) * Math.PI)) / 2;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":41,"value":"function drawRect(ctx, [x0, y0, w, h]) {\n ctx.strokeStyle = 'white'; \n ctx.lineWidth = 2;\n ctx.strokeRect(x0, y0, w, h);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":93,"value":"function clamp(x) {\n if (x < 0) return 0;\n if (x > 1) return 1;\n return x;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":300,"value":"function getRandomVector(len=700) {\n return new Array(len).fill(0).map(() => Math.random() * 2 - 1);\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":309,"value":"vec1Vals = getRandomVector()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":312,"value":"vec2Vals = getRandomVector()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":306,"value":"function mix(v0, v1, t) {\n return v0 * (1 - t) + v1 * t;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":374,"value":"function rgba(r, g, b, a=1) {\n return `rgba(${r}, ${g}, ${b}, ${a})`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":31,"value":"function drawLinearTransform(ctx, [x0a, y0a, wa, ha], [x0b, y0b, wb, hb], time) {\n const random = d3.randomUniform.source(d3.randomLcg(0))(0, 1);\n ctx.lineWidth = 1;\n ctx.globalCompositeOperation = 'screen';\n const delta = 0.1;\n const t = time % 1;\n const localTemp = 0.5 + Math.sin(t * Math.PI * 4) * 0.2;\n const jStart = t * (1 - delta);\n const jEnd = clamp(jStart + delta);\n for (let i=0; i<1; i+=0.0001) {\n // const j = jStart + random() * (jEnd - jStart);\n const j = random();\n const r = random();\n if (j < jStart || j > jEnd) continue;\n const relJ = (j - jStart) / (jEnd - jStart);\n const alpha = (1 - ((relJ - 0.5) * 2) ** 2) ** 1 * 0.5;\n if (r < localTemp) {\n ctx.strokeStyle = `rgba(255, 127, 0, ${alpha})`;\n } else {\n ctx.strokeStyle = `rgba(0, 127, 255, ${alpha})`;\n }\n ctx.beginPath();\n ctx.moveTo(x0a + wa * i, y0a + ha);\n ctx.lineTo(x0b + wb * j, y0b);\n ctx.stroke();\n }\n ctx.globalCompositeOperation = 'source-over';\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":384,"value":"function mixColors([r1, g1, b1], [r2, g2, b2], t) {\n t = clamp(t);\n return [mix(r1, r2, t), mix(g1, g2, t), mix(b1, b2, t)];\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":304,"value":"$30","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":371,"value":"function getValueColor(v) {\n const zeroRatio = (1 - Math.abs(v)) ** 1.5;\n const blueOrangeRatio = 1 - (v + 1) / 2;\n const r = mix(mix(255, 0, blueOrangeRatio), 255, zeroRatio);\n const g = mix(127, 255, zeroRatio);\n const b = mix(mix(0, 255, blueOrangeRatio), 255, zeroRatio);\n return [r, g, b];\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":9,"value":"import {Anim, utils, objs, rect, previewFrame, previewSlide, previewSlides} from 'abe5d24d2fb22e44'","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":57,"value":"d3 = require('d3@6')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"}],"files":"$W31","stdlib":"1","titling":"auto"}} 2e:"$2d:body"