3.4.1 Extracting Values from Probability Distributions

{
  "$schema": "https://vega.github.io/schema/vega-lite/v5.json",
  "description": "PDF, CDF, and Inverse-CDF visualization of a normal distribution with random draws.",
  "data": {
    "sequence": {
      "start": 1,
      "stop": 201,
      "step": 1,
      "as": "index"
    }
  },
  "transform": [
    {
      "calculate": "sampleUniform()",
      "as": "uniform"
    },
    {
      "calculate": "quantileNormal(datum.uniform)",
      "as": "inverse_cdf"
    }
  ],
  "hconcat": [
    {
      "title": "Histogram of 200 Uniform Draws",
      "width": 250,
      "height": 250,
      "mark": "bar",
      "encoding": {
        "x": {
          "field": "uniform",
          "type": "quantitative",
          "bin": {
            "maxbins": 20
          },
          "axis": {
            "title": "Value"
          },
          "scale": {
            "domain": [
              0,
              1
            ]
          }
        },
        "y": {
          "aggregate": "count",
          "type": "quantitative",
          "axis": {
            "title": "Count"
          }
        }
      }
    },
    {
      "width": 50,
      "height": 250,
      "mark": {
        "type": "text",
        "align": "center",
        "baseline": "middle",
        "fontSize": 30,
        "text": ">>"
      }
    },
    {
      "title": "CDF and Inverse-CDF with 200 Random Draws",
      "width": 250,
      "height": 250,
      "layer": [
        {
          "data": {
            "sequence": {
              "start": -3,
              "stop": 3,
              "step": 0.05,
              "as": "x"
            }
          },
          "transform": [
            {
              "calculate": "0.5 * (1 + erf(datum.x / sqrt(2)))",
              "as": "cdf"
            }
          ],
          "mark": "line",
          "encoding": {
            "x": {
              "field": "x",
              "type": "quantitative",
              "axis": {
                "title": "Value"
              },
              "scale": {
                "domain": [
                  -3,
                  3
                ]
              }
            },
            "y": {
              "field": "cdf",
              "type": "quantitative",
              "axis": {
                "title": "Cumulative Probability"
              },
              "scale": {
                "domain": [
                  0,
                  1
                ]
              }
            }
          }
        },
        {
          "layer": [
            {
              "mark": "rule",
              "encoding": {
                "x": {
                  "field": "inverse_cdf",
                  "type": "quantitative"
                },
                "y": {
                  "field": "uniform",
                  "type": "quantitative"
                },
                "color": {
                  "value": "#004976"
                },
                "size": {
                  "value": 1
                }
              }
            },
            {
              "mark": "rule",
              "encoding": {
                "x": {
                  "field": "inverse_cdf",
                  "type": "quantitative",
                  "scale": {
                    "domain": [
                      -3,
                      3
                    ]
                  }
                },
                "x2": {
                  "value": -3
                },
                "y": {
                  "field": "uniform",
                  "type": "quantitative"
                },
                "color": {
                  "value": "#004976"
                },
                "size": {
                  "value": 1
                }
              }
            },
            {
              "mark": {
                "type": "point",
                "color": "red"
              },
              "encoding": {
                "x": {
                  "field": "inverse_cdf",
                  "type": "quantitative",
                  "scale": {
                    "domain": [
                      -3,
                      3
                    ]
                  }
                },
                "y": {
                  "field": "uniform",
                  "type": "quantitative"
                }
              }
            }
          ]
        }
      ]
    },
    {
      "width": 50,
      "height": 250,
      "mark": {
        "type": "text",
        "align": "center",
        "baseline": "middle",
        "fontSize": 30,
        "text": "="
      }
    },
    {
      "title": "Histogram of 200 Inverse CDF Values",
      "width": 250,
      "height": 250,
      "mark": "bar",
      "encoding": {
        "x": {
          "field": "inverse_cdf",
          "type": "quantitative",
          "bin": {
            "maxbins": 20
          },
          "axis": {
            "title": "Value"
          },
          "scale": {
            "domain": [
              -3,
              3
            ]
          }
        },
        "y": {
          "aggregate": "count",
          "type": "quantitative",
          "axis": {
            "title": "Count"
          }
        }
      }
    }
  ]
}