{ "$schema": "https://vega.github.io/schema/vega/v5.json", "background": "white", "padding": 5, "width": 963, "data": [ {"name": "brush_store"}, { "name": "source_0", "url": "data/flights-5k.json", "format": {"type": "json", "parse": {"date": "date"}}, "transform": [ { "type": "formula", "expr": "hours(datum.date) + minutes(datum.date) / 60", "as": "time" }, { "type": "extent", "field": "time", "signal": "concat_1_bin_maxbins_30_extent_selection_brush_time_extent" }, { "type": "bin", "field": "time", "as": [ "bin_maxbins_30_extent_selection_brush_time", "bin_maxbins_30_extent_selection_brush_time_end" ], "signal": "concat_1_bin_maxbins_30_extent_selection_brush_time_bins", "extent": { "signal": "concat_1_bin_maxbins_30_extent_selection_brush_time_extent" }, "span": {"signal": "span(brush[\"time\"])"}, "maxbins": 30 }, { "type": "extent", "field": "time", "signal": "concat_0_bin_maxbins_30_time_extent" }, { "type": "bin", "field": "time", "as": ["bin_maxbins_30_time", "bin_maxbins_30_time_end"], "signal": "concat_0_bin_maxbins_30_time_bins", "extent": {"signal": "concat_0_bin_maxbins_30_time_extent"}, "maxbins": 30 } ] }, { "name": "data_0", "source": "source_0", "transform": [ { "type": "aggregate", "groupby": [ "bin_maxbins_30_extent_selection_brush_time", "bin_maxbins_30_extent_selection_brush_time_end" ], "ops": ["count"], "fields": [null], "as": ["__count"] }, { "type": "filter", "expr": "isValid(datum[\"bin_maxbins_30_extent_selection_brush_time\"]) && isFinite(+datum[\"bin_maxbins_30_extent_selection_brush_time\"])" } ] }, { "name": "data_1", "source": "source_0", "transform": [ { "type": "aggregate", "groupby": ["bin_maxbins_30_time", "bin_maxbins_30_time_end"], "ops": ["count"], "fields": [null], "as": ["__count"] }, { "type": "filter", "expr": "isValid(datum[\"bin_maxbins_30_time\"]) && isFinite(+datum[\"bin_maxbins_30_time\"])" } ] } ], "signals": [ {"name": "childHeight", "value": 100}, { "name": "unit", "value": {}, "on": [ {"events": "mousemove", "update": "isTuple(group()) ? group() : unit"} ] }, { "name": "brush", "update": "vlSelectionResolve(\"brush_store\", \"union\")" } ], "layout": {"padding": 20, "columns": 1, "bounds": "full", "align": "each"}, "marks": [ { "type": "group", "name": "concat_0_group", "style": "cell", "encode": { "update": { "width": {"signal": "width"}, "height": {"signal": "childHeight"} } }, "signals": [ { "name": "brush_x", "value": [], "on": [ { "events": { "source": "scope", "type": "mousedown", "filter": [ "!event.item || event.item.mark.name !== \"brush_brush\"" ] }, "update": "[x(unit), x(unit)]" }, { "events": { "source": "window", "type": "mousemove", "consume": true, "between": [ { "source": "scope", "type": "mousedown", "filter": [ "!event.item || event.item.mark.name !== \"brush_brush\"" ] }, {"source": "window", "type": "mouseup"} ] }, "update": "[brush_x[0], clamp(x(unit), 0, width)]" }, { "events": {"signal": "brush_scale_trigger"}, "update": "[scale(\"concat_0_x\", brush_time[0]), scale(\"concat_0_x\", brush_time[1])]" }, { "events": {"signal": "brush_translate_delta"}, "update": "clampRange(panLinear(brush_translate_anchor.extent_x, brush_translate_delta.x / span(brush_translate_anchor.extent_x)), 0, width)" }, { "events": {"signal": "brush_zoom_delta"}, "update": "clampRange(zoomLinear(brush_x, brush_zoom_anchor.x, brush_zoom_delta), 0, width)" }, { "events": [{"source": "scope", "type": "dblclick"}], "update": "[0, 0]" } ] }, { "name": "brush_time", "on": [ { "events": {"signal": "brush_x"}, "update": "brush_x[0] === brush_x[1] ? null : invert(\"concat_0_x\", brush_x)" } ] }, { "name": "brush_scale_trigger", "value": {}, "on": [ { "events": [{"scale": "concat_0_x"}], "update": "(!isArray(brush_time) || (+invert(\"concat_0_x\", brush_x)[0] === +brush_time[0] && +invert(\"concat_0_x\", brush_x)[1] === +brush_time[1])) ? brush_scale_trigger : {}" } ] }, { "name": "brush_tuple", "on": [ { "events": [{"signal": "brush_time"}], "update": "brush_time ? {unit: \"concat_0\", fields: brush_tuple_fields, values: [brush_time]} : null" } ] }, { "name": "brush_tuple_fields", "value": [{"field": "time", "channel": "x", "type": "R"}] }, { "name": "brush_translate_anchor", "value": {}, "on": [ { "events": [ { "source": "scope", "type": "mousedown", "markname": "brush_brush" } ], "update": "{x: x(unit), y: y(unit), extent_x: slice(brush_x)}" } ] }, { "name": "brush_translate_delta", "value": {}, "on": [ { "events": [ { "source": "window", "type": "mousemove", "consume": true, "between": [ { "source": "scope", "type": "mousedown", "markname": "brush_brush" }, {"source": "window", "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, true)" } ] } ], "marks": [ { "name": "brush_brush_bg", "type": "rect", "clip": true, "encode": { "enter": { "fill": {"value": "#333"}, "fillOpacity": {"value": 0.125} }, "update": { "x": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "signal": "brush_x[0]" }, {"value": 0} ], "y": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "value": 0 }, {"value": 0} ], "x2": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "signal": "brush_x[1]" }, {"value": 0} ], "y2": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "field": {"group": "height"} }, {"value": 0} ] } } }, { "name": "concat_0_marks", "type": "rect", "style": ["bar"], "interactive": true, "from": {"data": "data_1"}, "encode": { "update": { "fill": {"value": "#4c78a8"}, "ariaRoleDescription": {"value": "bar"}, "description": { "signal": "\"time (binned): \" + (!isValid(datum[\"bin_maxbins_30_time\"]) || !isFinite(+datum[\"bin_maxbins_30_time\"]) ? \"null\" : format(datum[\"bin_maxbins_30_time\"], \"\") + \" – \" + format(datum[\"bin_maxbins_30_time_end\"], \"\")) + \"; Count of Records: \" + (format(datum[\"__count\"], \"\"))" }, "x2": [ { "test": "!isValid(datum[\"bin_maxbins_30_time\"]) || !isFinite(+datum[\"bin_maxbins_30_time\"])", "value": 0 }, { "scale": "concat_0_x", "field": "bin_maxbins_30_time", "offset": 1 } ], "x": [ { "test": "!isValid(datum[\"bin_maxbins_30_time\"]) || !isFinite(+datum[\"bin_maxbins_30_time\"])", "value": 0 }, {"scale": "concat_0_x", "field": "bin_maxbins_30_time_end"} ], "y": {"scale": "concat_0_y", "field": "__count"}, "y2": {"scale": "concat_0_y", "value": 0} } } }, { "name": "brush_brush", "type": "rect", "clip": true, "encode": { "enter": {"fill": {"value": "transparent"}}, "update": { "x": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "signal": "brush_x[0]" }, {"value": 0} ], "y": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "value": 0 }, {"value": 0} ], "x2": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "signal": "brush_x[1]" }, {"value": 0} ], "y2": [ { "test": "data(\"brush_store\").length && data(\"brush_store\")[0].unit === \"concat_0\"", "field": {"group": "height"} }, {"value": 0} ], "stroke": [ {"test": "brush_x[0] !== brush_x[1]", "value": "white"}, {"value": null} ] } } } ], "axes": [ { "scale": "concat_0_y", "orient": "left", "gridScale": "concat_0_x", "grid": true, "tickCount": {"signal": "ceil(childHeight/40)"}, "domain": false, "labels": false, "aria": false, "maxExtent": 0, "minExtent": 0, "ticks": false, "zindex": 0 }, { "scale": "concat_0_x", "orient": "bottom", "grid": false, "title": "time (binned)", "labelFlush": true, "labelOverlap": true, "tickCount": {"signal": "ceil(width/10)"}, "zindex": 0 }, { "scale": "concat_0_y", "orient": "left", "grid": false, "title": "Count of Records", "labelOverlap": true, "tickCount": {"signal": "ceil(childHeight/40)"}, "zindex": 0 } ] }, { "type": "group", "name": "concat_1_group", "style": "cell", "encode": { "update": { "width": {"signal": "width"}, "height": {"signal": "childHeight"} } }, "marks": [ { "name": "concat_1_marks", "type": "rect", "clip": true, "style": ["bar"], "interactive": false, "from": {"data": "data_0"}, "encode": { "update": { "fill": {"value": "#4c78a8"}, "ariaRoleDescription": {"value": "bar"}, "description": { "signal": "\"time (binned): \" + (!isValid(datum[\"bin_maxbins_30_extent_selection_brush_time\"]) || !isFinite(+datum[\"bin_maxbins_30_extent_selection_brush_time\"]) ? \"null\" : format(datum[\"bin_maxbins_30_extent_selection_brush_time\"], \"\") + \" – \" + format(datum[\"bin_maxbins_30_extent_selection_brush_time_end\"], \"\")) + \"; Count of Records: \" + (format(datum[\"__count\"], \"\"))" }, "x2": [ { "test": "!isValid(datum[\"bin_maxbins_30_extent_selection_brush_time\"]) || !isFinite(+datum[\"bin_maxbins_30_extent_selection_brush_time\"])", "value": 0 }, { "scale": "concat_1_x", "field": "bin_maxbins_30_extent_selection_brush_time", "offset": 1 } ], "x": [ { "test": "!isValid(datum[\"bin_maxbins_30_extent_selection_brush_time\"]) || !isFinite(+datum[\"bin_maxbins_30_extent_selection_brush_time\"])", "value": 0 }, { "scale": "concat_1_x", "field": "bin_maxbins_30_extent_selection_brush_time_end" } ], "y": {"scale": "concat_1_y", "field": "__count"}, "y2": {"scale": "concat_1_y", "value": 0} } } } ], "axes": [ { "scale": "concat_1_y", "orient": "left", "gridScale": "concat_1_x", "grid": true, "tickCount": {"signal": "ceil(childHeight/40)"}, "domain": false, "labels": false, "aria": false, "maxExtent": 0, "minExtent": 0, "ticks": false, "zindex": 0 }, { "scale": "concat_1_x", "orient": "bottom", "grid": false, "title": "time (binned)", "labelFlush": true, "labelOverlap": true, "tickCount": {"signal": "ceil(width/10)"}, "zindex": 0 }, { "scale": "concat_1_y", "orient": "left", "grid": false, "title": "Count of Records", "labelOverlap": true, "tickCount": {"signal": "ceil(childHeight/40)"}, "zindex": 0 } ] } ], "scales": [ { "name": "concat_0_x", "type": "linear", "domain": { "signal": "[concat_0_bin_maxbins_30_time_bins.start, concat_0_bin_maxbins_30_time_bins.stop]" }, "range": [0, {"signal": "width"}], "bins": {"signal": "concat_0_bin_maxbins_30_time_bins"}, "zero": false }, { "name": "concat_0_y", "type": "linear", "domain": {"data": "data_1", "field": "__count"}, "range": [{"signal": "childHeight"}, 0], "nice": true, "zero": true }, { "name": "concat_1_x", "type": "linear", "domain": { "signal": "[concat_1_bin_maxbins_30_extent_selection_brush_time_bins.start, concat_1_bin_maxbins_30_extent_selection_brush_time_bins.stop]" }, "domainRaw": {"signal": "brush[\"time\"]"}, "range": [0, {"signal": "width"}], "bins": { "signal": "concat_1_bin_maxbins_30_extent_selection_brush_time_bins" }, "zero": false }, { "name": "concat_1_y", "type": "linear", "domain": {"data": "data_0", "field": "__count"}, "range": [{"signal": "childHeight"}, 0], "nice": true, "zero": true } ]}