{"version":3,"sources":["notes/20200515000814-d3/20200618132104.mjs"],"names":["width","height","margin","left","top","right","bottom","mvn","x","μ","Σ","k","length","norm","math","sqrt","pi","abs","diff","subtract","exp","multiply","transpose","inv","async","graph","m","MultivariateNormal","default","extent","d3","scaleLinear","domain","range","nice","y","svg","select","this","parentNode","insert","attr","style","remove","gx","append","text","call","axisBottom","gy","axisLeft","setInterval","s","sample","p","t","transition","duration","ease","easeLinear","interpolateRdYlBu","delay"],"mappings":"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","file":"20200618132104.mjs","sourcesContent":["#!/usr/bin/node\n\nimport \"./d3.js\"\n\nconst width = 680,\n\theight = 480,\n\tmargin = {\n\t\tleft: 50,\n\t\ttop: 10,\n\t\tright: 50,\n\t\tbottom: 40\n\t}\n\nfunction mvn(x, μ, Σ) {\n\tlet k = x.length\n\tlet norm = math.sqrt((2 * math.pi) ^ k * math.abs(Σ))\n\tlet diff = math.subtract(x, μ)\n\tlet exp = math.exp(-0.5 * math.multiply(math.transpose(diff), math.inv(Σ), diff))\n\n\treturn exp / norm\n}\n\nasync function graph() {\n\n\t// Define the data\n\n\tlet m = new MultivariateNormal.default([0, 0], [\n\t\t[1, 0],\n\t\t[0, 1]\n\t])\n\n\tfunction sample() {\n\t\tlet s = m.sample()\n\t\treturn {\n\t\t\tx: s[0],\n\t\t\ty: s[1],\n\t\t\tp: mvn(s, [0, 0], [\n\t\t\t\t[1, 0],\n\t\t\t\t[0, 1]\n\t\t\t])\n\t\t}\n\t}\n\n\t// Create empty graph\n\n\tlet extent = [-3, 3]\n\tlet x = d3.scaleLinear()\n\t\t.domain(extent)\n\t\t.range([margin.left, width - margin.right])\n\t\t.nice()\n\n\tlet y = d3.scaleLinear()\n\t\t.domain(extent)\n\t\t.range([height - margin.bottom, margin.top])\n\t\t.nice()\n\n\tlet svg = d3.select(\"#fig\\\\:scatter\")\n\t\t.select(function() {\n\t\t\treturn this.parentNode\n\t\t})\n\t\t.insert(\"svg\", \"figcaption\")\n\t\t.attr('xmlns', 'http://www.w3.org/2000/svg')\n\t\t.style(\"user-select\", \"none\")\n\t\t.style(\"font-family\", \"sans-serif\")\n\t\t.attr(\"viewBox\", [0, 0, width, height])\n\n\td3.select(\"#fig\\\\:scatter\").remove()\n\n\t// x axis\n\n\tlet gx = svg.append(\"g\")\n\t\t.attr(\"transform\", `translate(0,${height - margin.bottom})`)\n\n\tgx.append(\"g\")\n\t\t.append(\"text\")\n\t\t.attr(\"x\", (width + margin.left - margin.right) / 2)\n\t\t.attr(\"y\", margin.bottom - 4)\n\t\t.attr(\"text-anchor\", \"middle\")\n\t\t.style(\"font-size\", \"16px\")\n\t\t.style(\"fill\", \"currentColor\")\n\t\t.text(\"x\")\n\n\tlet xaxis = gx.append(\"g\")\n\t\t.call(d3.axisBottom(x))\n\n\t// y axis\n\n\tlet gy = svg.append(\"g\")\n\t\t.attr(\"transform\", `translate(${margin.left},0)`)\n\n\tgy.append(\"g\")\n\t\t.append(\"text\")\n\t\t.attr(\"y\", -margin.left + 16)\n\t\t.attr(\"x\", (-height + margin.bottom - margin.top) / 2)\n\t\t.attr(\"text-anchor\", \"middle\")\n\t\t.attr(\"transform\", \"rotate(-90)\")\n\t\t.style(\"font-size\", \"16px\")\n\t\t.style(\"fill\", \"currentColor\")\n\t\t.text(\"y\");\n\n\tlet yaxis = gy.append(\"g\")\n\t\t.call(d3.axisLeft(y))\n\n\t// Add a clip path\n\n\tsvg.append(\"clipPath\")\n\t\t.attr(\"id\", \"clip\")\n\t\t.append(\"rect\")\n\t\t.attr(\"x\", margin.left + 2)\n\t\t.attr(\"y\", margin.top + 2)\n\t\t.attr(\"width\", width - margin.left - margin.right - 4)\n\t\t.attr(\"height\", height - margin.top - margin.bottom - 4);\n\n\t// Draw graph\n\n\tlet graph = svg.append(\"g\")\n\t\t.attr(\"clip-path\", \"url(#clip)\")\n\n\tfunction draw() {\n\t\tlet s = sample()\n\n\t\tvar t = d3.transition()\n    .duration(800)\n    .ease(d3.easeLinear);\n\n\t\tgraph.append(\"circle\")\n\t\t\t.attr(\"transform\", `translate(${x(s.x)}, ${y(s.y)})`)\n\t\t\t.attr(\"fill\", d3.interpolateRdYlBu(s.p))\n\t\t\t.transition(t)\n\t\t\t.attr(\"r\", 3)\n\t\t\t.transition(t)\n\t\t \t.delay(400)\n\t\t\t.attr(\"r\", 0)\n\t\t\t.remove()\n\t}\n\n\tsetInterval(draw, 20)\n}\n\ngraph()\n"]}