2a:null 2b:["$","title",null,{"children":"Dirichlet Distribution | Mattias Villani | Observable"}] 31:T563,md` The [Dirichlet Distribution](https://en.wikipedia.org/wiki/Dirichlet_distribution) is a multivariate probability distribution defined over the space of positive vectors that sum to one; that is, ${tex`\boldsymbol{x} = \{x_1, \dots, x_k \}`} where ${tex.block` \sum_{i=1}^k x_k = 1 \text{ and } x_i \geq 0 \text{ for all } i = 1, \dots, k. `} This space is also called the ${tex`k - 1`} [simplex](https://en.wikipedia.org/wiki/Simplex). The density of the Dirichlet distribution is given by ${tex.block` \mathrm{Dirichlet}(\boldsymbol{x} \mid \boldsymbol{\alpha}) = \frac{1}{\mathrm{B}(\boldsymbol{\alpha})} \prod_{i=1}^k x_i^{\alpha_i - 1} `} where ${tex`\mathrm{B}`} is the [multivariate Beta function](https://en.wikipedia.org/wiki/Beta_function#Multivariate_beta_function) and ${tex`\boldsymbol{\alpha} = \{ \alpha_1, \dots, \alpha_k \}`} with ${tex`\alpha_i > 0`}. The Dirichlet distribution is typically visualized for the case where ${tex`k=3`} because it's still possible to render it in 2 dimensions using a [ternary plot](https://en.wikipedia.org/wiki/Ternary_plot). Each slider below controls one element of the parameter vector ${tex`\boldsymbol{\alpha}`}. The ternary plot visualizes the Dirichlet probability density over the simplex. _Special case: set ${tex`\alpha_1 = 1, \alpha_2 = 1, \alpha_3 = 1`} to get a uniform distribution over the simplex._ `32:Td64,ternaryDensity = (density, resolution, options) => { options = Object.assign({ size: 400, margin: { left: 30, top: 30, right: 30, bottom: 30 }, colorScheme: d3.interpolateBlues }, options); const fillScale = d3.scaleSequential(options.colorScheme).domain(d3.extent(density.map(d => d.density))) const svg = d3.create("svg") .attr("width", options.size) .attr("height", options.size); const x = d3.scaleLinear() .domain([0, 1]) .range([options.margin.left, options.size - options.margin.right]) const y = d3.scaleLinear() .domain([0, 1]) .range([options.size - options.margin.bottom, options.margin.top]); const axisBottom = g => g.call(d3.axisBottom(x).ticks(4)) const axisTop = g => g.call(d3.axisTop(x).ticks(4)); const hexagonSize = ((x(1 / (2 * resolution)) - x(0))) / Math.cos(Math.PI / 6) + 1; const corners = [{ x: 0.5, y: Math.sqrt(3)/2 }, { x: 0, y: 0 }, {x: 1, y: 0 }]; const corners_expanded = [{ x: 0.5, y: Math.sqrt(3)/2 + 0.1 }, { x: -0.1, y: -0.05 }, {x: 1.1, y: -0.05 }]; const line = d3.line().x(d => x(d.x)).y(d => y(d.y)); svg.append('defs') .append('clipPath') .attr('id', 'triangle') .append('path') .attr('x', options.size / 2) .attr('y', options.size / 2) .attr('d', line(corners)) svg.selectAll('.border') .data([[corners[0], corners[1]], [corners[1], corners[2]], [corners[2], corners[0]]]) .enter() .append('line') .attr('x1', (d) => x(d[0].x)) .attr('x2', (d) => x(d[1].x)) .attr('y1', (d) => y(d[0].y)) .attr('y2', (d) => y(d[1].y)) .attr('class', 'border') .attr('stroke', 'black'); const hexbin = d3.hexbin(); svg.append('g') .attr('clip-path', 'url(#triangle)') .selectAll(".point") .data(density) .join('path') .attr('transform', d => `translate(${x(corners[0].x * d.x[0] + corners[1].x * d.x[1] + corners[2].x * d.x[2])}, ${y(corners[0].y * d.x[0] + corners[1].y * d.x[1] + corners[2].y * d.x[2])})`) .attr('fill', d => fillScale(d.density)) .attr('d', hexbin.hexagon(hexagonSize)); svg.selectAll('text') .data([[corners_expanded[0], corners_expanded[1]], [corners_expanded[1], corners_expanded[2]], [corners_expanded[2], corners_expanded[0]]]) .join("text") .attr("text-anchor", "middle") .attr("alignment-baseline", "middle") .attr("font-style", "italic") .attr("x", d => (x(d[0].x) + x(d[1].x)) / 2) .attr("y", d => (y(d[0].y) + y(d[1].y)) / 2) .text((d, i) => { if(i == 0) return "x₂"; if(i == 1) return "x₃"; if(i == 2) return "x₁"; }) const removeLine = g => g.select(".domain").remove(); svg.append("g") .attr("transform", `translate(0, ${options.size - options.margin.bottom})`) .call(axisBottom) .call(removeLine) svg.append("g") .attr("transform", `translate(${x(1) + options.margin.right / 2 }, ${y(0) + 26}) rotate(-120)`) .call(axisBottom) .call(removeLine) .call(g => g.selectAll("text").attr("transform", "translate(11, 22) rotate(120)")); svg.append("g") .attr("transform", `translate(${x(0.5) + options.margin.left / 2}, ${y(Math.sqrt(3) / 2) - 26}) rotate(120)`) .call(axisBottom) .call(removeLine) .call(g => g.selectAll("text").attr("transform", "translate(-11, 22) rotate(-120)")); return svg.node(); }33:T624,marginalDensities = (marginalDensity, index, options) => { options = Object.assign({ height: 300, width: 500, margin: { left: 25, top: 10, right: 50, bottom: 40 } }, options); const svg = d3.create("svg") .attr("width", options.width) .attr("height", options.height); const x = d3.scaleLinear() .domain([0, 1]) .range([options.margin.left, options.width - options.margin.right]) const y = d3.scaleLinear() .domain([0, d3.max(marginalDensity.flat().map(d => d.density))]) .range([options.height - options.margin.bottom, options.margin.top]); const line = d3.line() .x(d => x(d.x)) .y(d => y(d.density)); const paths = svg.selectAll(".path") .data([marginalDensity[index]]) .join("path") .attr("class", "path") .attr("d", d => line(d)) .attr("stroke", "steelblue") .attr("stroke-width", 2) .attr("fill", "transparent"); const axisBottom = g => g.call(d3.axisBottom(x).ticks(5)) const axisLeft = g => g.call(d3.axisLeft(y).ticks(5)); svg.append("g") .attr("transform", `translate(0, ${options.height - options.margin.bottom})`) .call(axisBottom); svg.append("g") .attr("transform", `translate(${options.margin.left}, 0)`) .call(axisLeft); svg.append("text") .attr("transform", `translate(${options.margin.left + (options.width - options.margin.left - options.margin.right) / 2}, ${options.height - 5})`) .style("font-style", "italic") .text(index == 0 ? "x₁" : index == 1 ? "x₂" : "x₃") return svg.node(); }34:[] 2e:{"id":"3b61b39228e56c0c","slug":"dirichlet-distribution","title":"Dirichlet Distribution","thumbnail":"2958e4206afaf4d81ccb3ce1dbef4269e0b46c75e1bed44e546cf371e8a5e9ca","access_level":"public","create_time":"$D2023-10-06T07:40:30.615Z","update_time":"$D2023-10-06T07:48:39.939Z","view_time":null,"first_public_time":"$D2023-10-06T07:40:30.615Z","fork":{"id":"4652f3c2fc00d4a5","slug":"dirichlet-distribution","title":"Dirichlet Distribution","owner":{"id":"a848bf10c248efb2","login":"herbps10","name":"Herb Susmann"}},"stars":0,"starred":false,"owner":{"type":"team","id":"7592a7ab121f74a0","login":"mattiasvillani","name":"Mattias Villani","avatar_url":"https://avatars-next.observableusercontent.com/a440aaf39a3abefb86cbcc758fd7a5ab42555ae68d6825b52ec006f385a94d1d","tier":"pro_2024"},"version":717,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"56499be8cf43f0ef","login":"mattiasvillani","name":"Mattias Villani","avatar_url":"https://avatars-next.observableusercontent.com/a440aaf39a3abefb86cbcc758fd7a5ab42555ae68d6825b52ec006f385a94d1d","tier":null}],"members":[{"type":"individual","id":"56499be8cf43f0ef","login":"mattiasvillani","name":"Mattias Villani","avatar_url":"https://avatars-next.observableusercontent.com/a440aaf39a3abefb86cbcc758fd7a5ab42555ae68d6825b52ec006f385a94d1d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":2,"collection":{"id":"40c8ef5af1a51aff","slug":"distributions","title":"Statistical distributions","owner":{"id":"7592a7ab121f74a0","login":"mattiasvillani","name":"Mattias Villani"}},"type":"notebook","body":{"title":"Dirichlet Distribution","cells":[{"id":706,"value":"# Dirichlet Distribution","pinned":false,"hidden":false,"mode":"md"},{"id":701,"value":"disttext = md`

Forked from **Herb Susmann** at https://observablehq.com/@herbps10`","pinned":false,"hidden":false,"mode":"ojs"},{"id":0,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":11,"value":"viewof alpha1 = Range([0.01, 15], { label: tex`\\alpha_1`, value: 1.5, step: 0.01 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":13,"value":"viewof alpha2 = Range([0.01, 15], { label: tex`\\alpha_2`, value: 1.5, step: 0.01 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":15,"value":"viewof alpha3 = Range([0.01, 15], { label: tex`\\alpha_3`, value: 1.5, step: 0.01 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"tex`\\boldsymbol{\\alpha} = [${alpha1}, ${alpha2}, ${alpha3}]`","pinned":false,"hidden":false,"mode":"ojs"},{"id":491,"value":"ternaryDensity(density, densityResolution, { size: 400 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":530,"value":"legend({color: d3.scaleSequential(d3.extent(density.map(d => d.density)), d3.interpolateBlues), title: \"Density\"})","pinned":false,"hidden":false,"mode":"ojs"},{"id":584,"value":"{\n return html`\n Marginal densities
\n ${marginalDensities(marginalDensity, 0, { height: 200, width: width / 3 - 10 })}\n ${marginalDensities(marginalDensity, 1, { height: 200, width: width / 3 - 10 })}\n ${marginalDensities(marginalDensity, 2, { height: 200, width: width / 3 - 10 })}\n `\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":716,"value":"

","pinned":false,"hidden":false,"mode":"md"},{"id":485,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":553,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":19,"value":"dirichlet = (x, alpha) => {\n let result = 1;\n for(let i = 0; i < x.length; i++) result *= Math.pow(x[i], alpha[i] - 1);\n return result / beta(alpha);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":533,"value":"density = {\n const density = [];\n for(let i = 1; i < densityResolution; i++) {\n for(let j = 1; j < densityResolution - i; j++) {\n const x1 = i / densityResolution ;\n const x2 = j / densityResolution;\n const x3 = Math.max(0, 1 - x1 - x2);\n const x = [ x1, x2, x3 ];\n\n density.push({ x, density: dirichlet(x, alpha) });\n }\n }\n return density;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":562,"value":"marginalDensity = {\n const result = [[], [], []];\n const resolution = 200;\n const alpha0 = alpha1 + alpha2 + alpha3;\n for(let i = 1; i < resolution; i++) {\n result[0].push({ x: i / resolution, density: betaDensity(i / resolution, alpha1, alpha0 - alpha1) });\n result[1].push({ x: i / resolution, density: betaDensity(i / resolution, alpha2, alpha0 - alpha2) });\n result[2].push({ x: i / resolution, density: betaDensity(i / resolution, alpha3, alpha0 - alpha3) });\n }\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":535,"value":"densityResolution = 40","pinned":false,"hidden":false,"mode":"ojs"},{"id":563,"value":"betaDensity = (x, alpha, beta) => (Math.pow(x, alpha - 1) * Math.pow(1 - x, beta - 1)) / mathfn.beta(alpha, beta)","pinned":false,"hidden":false,"mode":"ojs"},{"id":63,"value":"alpha = [alpha1, alpha2, alpha3]","pinned":false,"hidden":false,"mode":"ojs"},{"id":31,"value":"beta = (alpha) => {\n let result = 1;\n for(let i = 0; i < alpha.length; i++) {\n result *= mathfn.gamma(alpha[i]);\n }\n result = result / mathfn.gamma(d3.sum(alpha));\n return result;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":51,"value":"margin = ({ left: 30, top: 30, right: 30, bottom: 30 })","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"height = 400","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"mathfn = require('https://bundle.run/mathfn@1.1.0')","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"d3 = require(\"d3@v6\", \"d3-hexbin@0.2\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":179,"value":"import {Range} from \"@observablehq/inputs\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":275,"value":"import {legend} from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}} 2f:"$2e:body"