{
  "$schema": "https://vega.github.io/schema/vega/v5.json",
  "description": "Anscombe's Quartet",
  "background": "white",
  "padding": 5,
  "data": [
    {"name": "brush_store"},
    {"name": "grid_store"},
    {"name": "xenc_store"},
    {
      "name": "source_0",
      "url": "data/anscombe.json",
      "format": {"type": "json"},
      "transform": [
        {
          "type": "filter",
          "expr": "isValid(datum[\"X\"]) && isFinite(+datum[\"X\"]) && isValid(datum[\"Y\"]) && isFinite(+datum[\"Y\"])"
        }
      ]
    },
    {
      "name": "column_domain",
      "source": "source_0",
      "transform": [{"type": "aggregate", "groupby": ["Series"]}]
    }
  ],
  "signals": [
    {"name": "child_width", "value": 200},
    {"name": "child_height", "value": 200},
    {
      "name": "unit",
      "value": {},
      "on": [
        {"events": "mousemove", "update": "isTuple(group()) ? group() : unit"}
      ]
    },
    {
      "name": "xenc_X",
      "value": null,
      "on": [
        {
          "events": [
            {
              "source": "scope",
              "type": "mouseover",
              "markname": "child_voronoi"
            }
          ],
          "update": "datum && item().mark.marktype !== 'group' ? (item().isVoronoi ? datum.datum : datum)[\"X\"] : null"
        }
      ],
      "bind": {"input": "number"}
    },
    {
      "name": "brush",
      "update": "vlSelectionResolve(\"brush_store\", \"intersect\")"
    },
    {"name": "grid", "update": "{\"X\": grid_X, \"Y\": grid_Y}"},
    {"name": "grid_X"},
    {"name": "grid_Y"},
    {
      "name": "xenc",
      "update": "vlSelectionResolve(\"xenc_store\", \"union\", true, true)"
    }
  ],
  "layout": {
    "padding": 20,
    "offset": {"columnTitle": 10},
    "columns": {"signal": "length(data('column_domain'))"},
    "bounds": "full",
    "align": "all"
  },
  "marks": [
    {
      "name": "column-title",
      "type": "group",
      "role": "column-title",
      "title": {"text": "Series", "style": "guide-title", "offset": 10}
    },
    {
      "name": "row_header",
      "type": "group",
      "role": "row-header",
      "encode": {"update": {"height": {"signal": "child_height"}}},
      "axes": [
        {
          "scale": "y",
          "orient": "left",
          "grid": false,
          "title": "Y",
          "labelOverlap": true,
          "tickCount": {"signal": "ceil(child_height/40)"},
          "zindex": 0
        }
      ]
    },
    {
      "name": "column_header",
      "type": "group",
      "role": "column-header",
      "from": {"data": "column_domain"},
      "sort": {"field": "datum[\"Series\"]", "order": "ascending"},
      "title": {
        "text": {
          "signal": "isValid(parent[\"Series\"]) ? parent[\"Series\"] : \"\"+parent[\"Series\"]"
        },
        "style": "guide-label",
        "frame": "group",
        "offset": 10
      },
      "encode": {"update": {"width": {"signal": "child_width"}}}
    },
    {
      "name": "column_footer",
      "type": "group",
      "role": "column-footer",
      "from": {"data": "column_domain"},
      "sort": {"field": "datum[\"Series\"]", "order": "ascending"},
      "encode": {"update": {"width": {"signal": "child_width"}}},
      "axes": [
        {
          "scale": "x",
          "orient": "bottom",
          "grid": false,
          "title": "X",
          "labelFlush": true,
          "labelOverlap": true,
          "tickCount": {"signal": "ceil(child_width/40)"},
          "zindex": 0
        }
      ]
    },
    {
      "name": "cell",
      "type": "group",
      "style": "cell",
      "from": {
        "facet": {"name": "facet", "data": "source_0", "groupby": ["Series"]}
      },
      "sort": {"field": ["datum[\"Series\"]"], "order": ["ascending"]},
      "encode": {
        "update": {
          "width": {"signal": "child_width"},
          "height": {"signal": "child_height"}
        }
      },
      "signals": [
        {
          "name": "facet",
          "value": {},
          "on": [
            {
              "events": [{"source": "scope", "type": "mousemove"}],
              "update": "isTuple(facet) ? facet : group(\"cell\").datum"
            }
          ]
        },
        {
          "name": "brush_x",
          "value": [],
          "on": [
            {
              "events": {
                "source": "scope",
                "type": "mousedown",
                "filter": [
                  "event.shiftKey",
                  "!event.item || event.item.mark.name !== \"brush_brush\""
                ]
              },
              "update": "[x(unit), x(unit)]"
            },
            {
              "events": {
                "source": "scope",
                "type": "mousemove",
                "between": [
                  {
                    "source": "scope",
                    "type": "mousedown",
                    "filter": [
                      "event.shiftKey",
                      "!event.item || event.item.mark.name !== \"brush_brush\""
                    ]
                  },
                  {"source": "scope", "type": "mouseup"}
                ]
              },
              "update": "[brush_x[0], clamp(x(unit), 0, child_width)]"
            },
            {
              "events": {"signal": "brush_scale_trigger"},
              "update": "[scale(\"x\", brush_X[0]), scale(\"x\", brush_X[1])]"
            },
            {
              "events": [{"source": "view", "type": "dblclick"}],
              "update": "[0, 0]"
            },
            {
              "events": {"signal": "brush_translate_delta"},
              "update": "clampRange(panLinear(brush_translate_anchor.extent_x, brush_translate_delta.x / span(brush_translate_anchor.extent_x)), 0, child_width)"
            },
            {
              "events": {"signal": "brush_zoom_delta"},
              "update": "clampRange(zoomLinear(brush_x, brush_zoom_anchor.x, brush_zoom_delta), 0, child_width)"
            }
          ]
        },
        {
          "name": "brush_X",
          "on": [
            {
              "events": {"signal": "brush_x"},
              "update": "brush_x[0] === brush_x[1] ? null : invert(\"x\", brush_x)"
            }
          ]
        },
        {
          "name": "brush_scale_trigger",
          "value": {},
          "on": [
            {
              "events": [{"scale": "x"}],
              "update": "(!isArray(brush_X) || (+invert(\"x\", brush_x)[0] === +brush_X[0] && +invert(\"x\", brush_x)[1] === +brush_X[1])) ? brush_scale_trigger : {}"
            }
          ]
        },
        {
          "name": "brush_tuple",
          "on": [
            {
              "events": [{"signal": "brush_X"}],
              "update": "brush_X ? {unit: \"child\" + '__facet_column_' + (facet[\"Series\"]), fields: brush_tuple_fields, values: [brush_X]} : null"
            }
          ]
        },
        {
          "name": "brush_tuple_fields",
          "value": [{"field": "X", "channel": "x", "type": "R"}]
        },
        {
          "name": "brush_translate_anchor",
          "value": {},
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "mousedown",
                  "filter": ["event.shiftKey"],
                  "markname": "brush_brush"
                }
              ],
              "update": "{x: x(unit), y: y(unit), extent_x: slice(brush_x)}"
            }
          ]
        },
        {
          "name": "brush_translate_delta",
          "value": {},
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "mousemove",
                  "between": [
                    {
                      "source": "scope",
                      "type": "mousedown",
                      "filter": ["event.shiftKey"],
                      "markname": "brush_brush"
                    },
                    {"source": "scope", "type": "mouseup"}
                  ]
                }
              ],
              "update": "{x: brush_translate_anchor.x - x(unit), y: brush_translate_anchor.y - y(unit)}"
            }
          ]
        },
        {
          "name": "brush_zoom_anchor",
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "wheel",
                  "consume": true,
                  "markname": "brush_brush"
                }
              ],
              "update": "{x: x(unit), y: y(unit)}"
            }
          ]
        },
        {
          "name": "brush_zoom_delta",
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "wheel",
                  "consume": true,
                  "markname": "brush_brush"
                }
              ],
              "force": true,
              "update": "pow(1.001, event.deltaY * pow(16, event.deltaMode))"
            }
          ]
        },
        {
          "name": "brush_modify",
          "on": [
            {
              "events": {"signal": "brush_tuple"},
              "update": "modify(\"brush_store\", brush_tuple, {unit: \"child\" + '__facet_column_' + (facet[\"Series\"])})"
            }
          ]
        },
        {
          "name": "grid_X",
          "on": [
            {
              "events": [{"source": "view", "type": "dblclick"}],
              "update": "null"
            },
            {
              "events": {"signal": "grid_translate_delta"},
              "update": "panLinear(grid_translate_anchor.extent_x, -grid_translate_delta.x / child_width)"
            },
            {
              "events": {"signal": "grid_zoom_delta"},
              "update": "zoomLinear(domain(\"x\"), grid_zoom_anchor.x, grid_zoom_delta)"
            }
          ],
          "push": "outer"
        },
        {
          "name": "grid_Y",
          "on": [
            {
              "events": [{"source": "view", "type": "dblclick"}],
              "update": "null"
            },
            {
              "events": {"signal": "grid_translate_delta"},
              "update": "panLinear(grid_translate_anchor.extent_y, grid_translate_delta.y / child_height)"
            },
            {
              "events": {"signal": "grid_zoom_delta"},
              "update": "zoomLinear(domain(\"y\"), grid_zoom_anchor.y, grid_zoom_delta)"
            }
          ],
          "push": "outer"
        },
        {
          "name": "grid_tuple",
          "on": [
            {
              "events": [{"signal": "grid_X || grid_Y"}],
              "update": "grid_X && grid_Y ? {unit: \"child\" + '__facet_column_' + (facet[\"Series\"]), fields: grid_tuple_fields, values: [grid_X,grid_Y]} : null"
            }
          ]
        },
        {
          "name": "grid_tuple_fields",
          "value": [
            {"field": "X", "channel": "x", "type": "R"},
            {"field": "Y", "channel": "y", "type": "R"}
          ]
        },
        {
          "name": "grid_translate_anchor",
          "value": {},
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "mousedown",
                  "filter": ["!event.shiftKey"]
                }
              ],
              "update": "{x: x(unit), y: y(unit), extent_x: domain(\"x\"), extent_y: domain(\"y\")}"
            }
          ]
        },
        {
          "name": "grid_translate_delta",
          "value": {},
          "on": [
            {
              "events": [
                {
                  "source": "scope",
                  "type": "mousemove",
                  "between": [
                    {
                      "source": "scope",
                      "type": "mousedown",
                      "filter": ["!event.shiftKey"]
                    },
                    {"source": "scope", "type": "mouseup"}
                  ]
                }
              ],
              "update": "{x: grid_translate_anchor.x - x(unit), y: grid_translate_anchor.y - y(unit)}"
            }
          ]
        },
        {
          "name": "grid_zoom_anchor",
          "on": [
            {
              "events": [{"source": "scope", "type": "wheel", "consume": true}],
              "update": "{x: invert(\"x\", x(unit)), y: invert(\"y\", y(unit))}"
            }
          ]
        },
        {
          "name": "grid_zoom_delta",
          "on": [
            {
              "events": [{"source": "scope", "type": "wheel", "consume": true}],
              "force": true,
              "update": "pow(1.001, event.deltaY * pow(16, event.deltaMode))"
            }
          ]
        },
        {
          "name": "grid_modify",
          "on": [
            {
              "events": {"signal": "grid_tuple"},
              "update": "modify(\"grid_store\", grid_tuple, true)"
            }
          ]
        },
        {
          "name": "xenc_tuple",
          "update": "xenc_X !== null ? {fields: xenc_tuple_fields, values: [xenc_X]} : null"
        },
        {"name": "xenc_tuple_fields", "value": [{"type": "E", "field": "X"}]},
        {
          "name": "xenc_modify",
          "on": [
            {
              "events": {"signal": "xenc_tuple"},
              "update": "modify(\"xenc_store\", xenc_tuple, true)"
            }
          ]
        }
      ],
      "marks": [
        {
          "name": "brush_brush_bg",
          "type": "rect",
          "clip": true,
          "encode": {
            "enter": {
              "fill": {"value": "#333"},
              "fillOpacity": {"value": 0.125}
            },
            "update": {
              "x": {"signal": "brush_x[0]"},
              "y": {"value": 0},
              "x2": {"signal": "brush_x[1]"},
              "y2": {"field": {"group": "height"}}
            }
          }
        },
        {
          "name": "child_marks",
          "type": "symbol",
          "clip": true,
          "style": ["circle"],
          "interactive": true,
          "from": {"data": "facet"},
          "encode": {
            "update": {
              "opacity": {"value": 1},
              "fill": [
                {
                  "test": "!length(data(\"xenc_store\")) || vlSelectionTest(\"xenc_store\", datum)",
                  "value": "red"
                },
                {"value": "steelblue"}
              ],
              "ariaRoleDescription": {"value": "circle"},
              "description": {
                "signal": "\"X: \" + (format(datum[\"X\"], \"\")) + \"; Y: \" + (format(datum[\"Y\"], \"\"))"
              },
              "x": {"scale": "x", "field": "X"},
              "y": {"scale": "y", "field": "Y"},
              "size": [
                {
                  "test": "!length(data(\"brush_store\")) || vlSelectionTest(\"brush_store\", datum, \"intersect\")",
                  "value": 250
                },
                {"value": 100}
              ],
              "shape": {"value": "circle"}
            }
          }
        },
        {
          "name": "child_voronoi",
          "type": "path",
          "interactive": true,
          "from": {"data": "child_marks"},
          "encode": {
            "update": {
              "fill": {"value": "transparent"},
              "strokeWidth": {"value": 0.35},
              "stroke": {"value": "transparent"},
              "isVoronoi": {"value": true}
            }
          },
          "transform": [
            {
              "type": "voronoi",
              "x": {"expr": "datum.datum.x || 0"},
              "y": {"expr": "datum.datum.y || 0"},
              "size": [{"signal": "child_width"}, {"signal": "child_height"}]
            }
          ]
        },
        {
          "name": "brush_brush",
          "type": "rect",
          "clip": true,
          "encode": {
            "enter": {"fill": {"value": "transparent"}},
            "update": {
              "x": {"signal": "brush_x[0]"},
              "y": {"value": 0},
              "x2": {"signal": "brush_x[1]"},
              "y2": {"field": {"group": "height"}},
              "stroke": [
                {"test": "brush_x[0] !== brush_x[1]", "value": "white"},
                {"value": null}
              ]
            }
          }
        }
      ],
      "axes": [
        {
          "scale": "x",
          "orient": "bottom",
          "gridScale": "y",
          "grid": true,
          "tickCount": {"signal": "ceil(child_width/40)"},
          "domain": false,
          "labels": false,
          "aria": false,
          "maxExtent": 0,
          "minExtent": 0,
          "ticks": false,
          "zindex": 0
        },
        {
          "scale": "y",
          "orient": "left",
          "gridScale": "x",
          "grid": true,
          "tickCount": {"signal": "ceil(child_height/40)"},
          "domain": false,
          "labels": false,
          "aria": false,
          "maxExtent": 0,
          "minExtent": 0,
          "ticks": false,
          "zindex": 0
        }
      ]
    }
  ],
  "scales": [
    {
      "name": "x",
      "type": "linear",
      "domain": {"data": "source_0", "field": "X"},
      "domainRaw": {"signal": "grid[\"X\"]"},
      "range": [0, {"signal": "child_width"}],
      "zero": false,
      "nice": true
    },
    {
      "name": "y",
      "type": "linear",
      "domain": {"data": "source_0", "field": "Y"},
      "domainRaw": {"signal": "grid[\"Y\"]"},
      "range": [{"signal": "child_height"}, 0],
      "zero": false,
      "nice": true
    }
  ]
}