Skip to content

Instantly share code, notes, and snippets.

@declann

declann/spec.json

Created January 20, 2025 17:11
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save declann/ea53c90aa6ea61ce9b545b082ce85fec to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save declann/ea53c90aa6ea61ce9b545b082ce85fec to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. declann created this gist Jan 20, 2025.
    220 changes: 220 additions & 0 deletions spec.json
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,220 @@
    {
    "$schema": "https://vega.github.io/schema/vega/v5.json",
    "background": "white",
    "padding": 5,
    "width": 200,
    "height": 200,
    "style": "cell",
    "data": [
    {
    "name": "brush_store",
    "transform": [{"type": "collect", "sort": {"field": "_vgsid_"}}]
    },
    {
    "name": "source_0",
    "url": "data/cars.json",
    "format": {"type": "json"},
    "transform": [
    {"type": "identifier", "as": "_vgsid_"},
    {
    "type": "filter",
    "expr": "isValid(datum[\"Horsepower\"]) && isFinite(+datum[\"Horsepower\"]) && isValid(datum[\"Miles_per_Gallon\"]) && isFinite(+datum[\"Miles_per_Gallon\"])"
    }
    ]
    }
    ],
    "signals": [
    {
    "name": "unit",
    "value": {},
    "on": [
    {"events": "mousemove", "update": "isTuple(group()) ? group() : unit"}
    ]
    },
    {
    "name": "brush",
    "update": "vlSelectionResolve(\"brush_store\", \"union\")"
    },
    {
    "name": "brush_tuple",
    "on": [
    {
    "events": [{"signal": "brush_screen_path"}],
    "update": "vlSelectionTuples(intersectLasso(\"marks\", brush_screen_path, unit), {unit: \"\"})"
    },
    {"events": [{"source": "view", "type": "dblclick"}], "update": "null"}
    ]
    },
    {
    "name": "brush_screen_path",
    "init": "[]",
    "on": [
    {
    "events": {"source": "scope", "type": "mousedown"},
    "update": "[[x(unit), y(unit)]]"
    },
    {
    "events": {
    "source": "window",
    "type": "mousemove",
    "consume": true,
    "between": [
    {"source": "scope", "type": "mousedown"},
    {"source": "window", "type": "mouseup"}
    ]
    },
    "update": "lassoAppend(brush_screen_path, clamp(x(unit), 0, width), clamp(y(unit), 0, height))"
    }
    ]
    },
    {
    "name": "brush_modify",
    "on": [
    {
    "events": {"signal": "brush_tuple"},
    "update": "modify(\"brush_store\", brush_tuple, true)"
    }
    ]
    }
    ],
    "marks": [
    {
    "name": "brush_brush",
    "type": "path",
    "encode": {
    "enter": {
    "fill": {"value": "#333"},
    "fillOpacity": {"value": 0.125},
    "stroke": {"value": "gray"},
    "strokeWidth": {"value": 2},
    "strokeDash": {"value": [8, 5]}
    },
    "update": {
    "path": [
    {
    "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"\"",
    "signal": "lassoPath(brush_screen_path)"
    },
    {"value": "[]"}
    ]
    }
    }
    },
    {
    "name": "marks",
    "type": "symbol",
    "style": ["point"],
    "interactive": true,
    "from": {"data": "source_0"},
    "encode": {
    "update": {
    "opacity": {"value": 0.7},
    "fill": {"value": "transparent"},
    "stroke": [
    {
    "test": "!length(data(\"brush_store\")) || vlSelectionIdTest(\"brush_store\", datum)",
    "scale": "color",
    "field": "Cylinders"
    },
    {"value": "grey"}
    ],
    "ariaRoleDescription": {"value": "point"},
    "description": {
    "signal": "\"Horsepower: \" + (format(datum[\"Horsepower\"], \"\")) + \"; Miles_per_Gallon: \" + (format(datum[\"Miles_per_Gallon\"], \"\")) + \"; Cylinders: \" + (isValid(datum[\"Cylinders\"]) ? datum[\"Cylinders\"] : \"\"+datum[\"Cylinders\"])"
    },
    "x": {"scale": "x", "field": "Horsepower"},
    "y": {"scale": "y", "field": "Miles_per_Gallon"}
    }
    }
    }
    ],
    "scales": [
    {
    "name": "x",
    "type": "linear",
    "domain": {"data": "source_0", "field": "Horsepower"},
    "range": [0, {"signal": "width"}],
    "nice": true,
    "zero": true
    },
    {
    "name": "y",
    "type": "linear",
    "domain": {"data": "source_0", "field": "Miles_per_Gallon"},
    "range": [{"signal": "height"}, 0],
    "nice": true,
    "zero": true
    },
    {
    "name": "color",
    "type": "ordinal",
    "domain": {"data": "source_0", "field": "Cylinders", "sort": true},
    "range": "ordinal",
    "interpolate": "hcl"
    }
    ],
    "axes": [
    {
    "scale": "x",
    "orient": "bottom",
    "gridScale": "y",
    "grid": true,
    "tickCount": {"signal": "ceil(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(height/40)"},
    "domain": false,
    "labels": false,
    "aria": false,
    "maxExtent": 0,
    "minExtent": 0,
    "ticks": false,
    "zindex": 0
    },
    {
    "scale": "x",
    "orient": "bottom",
    "grid": false,
    "title": "Horsepower",
    "labelFlush": true,
    "labelOverlap": true,
    "tickCount": {"signal": "ceil(width/40)"},
    "zindex": 0
    },
    {
    "scale": "y",
    "orient": "left",
    "grid": false,
    "title": "Miles_per_Gallon",
    "labelOverlap": true,
    "tickCount": {"signal": "ceil(height/40)"},
    "zindex": 0
    }
    ],
    "legends": [
    {
    "stroke": "color",
    "symbolType": "circle",
    "title": "Cylinders",
    "encode": {
    "symbols": {
    "update": {
    "fill": {"value": "transparent"},
    "opacity": {"value": 0.7}
    }
    }
    }
    }
    ]
    }