{ "$schema": "https://vega.github.io/schema/vega/v5.json", "background": "white", "padding": 5, "width": 200, "data": [ { "name": "source_0", "url": "data/cars.json", "format": {"type": "json"}, "transform": [ { "type": "aggregate", "groupby": ["Origin", "Cylinders"], "ops": ["count"], "fields": [null], "as": ["count_*"] }, { "type": "stack", "groupby": [], "field": "count_*", "sort": {"field": ["Origin"], "order": ["ascending"]}, "as": ["stack_count_Origin1", "stack_count_Origin2"], "offset": "normalize" }, { "type": "window", "params": [null, null, null, null], "as": ["x", "x2", "rank_Cylinders", "distinct_Cylinders"], "ops": ["min", "max", "dense_rank", "distinct"], "fields": [ "stack_count_Origin1", "stack_count_Origin2", null, "Cylinders" ], "sort": {"field": ["Cylinders"], "order": ["ascending"]}, "groupby": ["Origin"], "frame": [null, null] }, { "type": "window", "params": [null], "as": ["rank_Origin"], "ops": ["dense_rank"], "fields": [null], "sort": {"field": ["Origin"], "order": ["ascending"]}, "frame": [null, null] }, { "type": "stack", "groupby": ["Origin"], "field": "count_*", "sort": {"field": ["Cylinders"], "order": ["ascending"]}, "as": ["y", "y2"], "offset": "normalize" }, { "type": "formula", "expr": "datum.y + (datum.rank_Cylinders - 1) * datum.distinct_Cylinders * 0.01 / 3", "as": "ny" }, { "type": "formula", "expr": "datum.y2 + (datum.rank_Cylinders - 1) * datum.distinct_Cylinders * 0.01 / 3", "as": "ny2" }, { "type": "formula", "expr": "datum.x + (datum.rank_Origin - 1) * 0.01", "as": "nx" }, { "type": "formula", "expr": "datum.x2 + (datum.rank_Origin - 1) * 0.01", "as": "nx2" }, {"type": "formula", "expr": "(datum.nx+datum.nx2)/2", "as": "xc"}, {"type": "formula", "expr": "(datum.ny+datum.ny2)/2", "as": "yc"} ] }, { "name": "data_0", "source": "source_0", "transform": [ { "type": "aggregate", "groupby": ["Origin"], "ops": ["min"], "fields": ["xc"], "as": ["min_xc"] }, { "type": "filter", "expr": "isValid(datum[\"min_xc\"]) && isFinite(+datum[\"min_xc\"])" } ] }, { "name": "data_1", "source": "source_0", "transform": [ { "type": "filter", "expr": "isValid(datum[\"nx\"]) && isFinite(+datum[\"nx\"]) && isValid(datum[\"ny\"]) && isFinite(+datum[\"ny\"]) && isValid(datum[\"Cylinders\"]) && isFinite(+datum[\"Cylinders\"])" } ] }, { "name": "data_2", "source": "source_0", "transform": [ { "type": "filter", "expr": "isValid(datum[\"xc\"]) && isFinite(+datum[\"xc\"]) && isValid(datum[\"yc\"]) && isFinite(+datum[\"yc\"])" } ] } ], "signals": [ {"name": "concat_0_height", "value": 20}, {"name": "concat_1_height", "value": 200} ], "layout": {"padding": 10, "columns": 1, "bounds": "full", "align": "each"}, "marks": [ { "type": "group", "name": "concat_0_group", "style": "cell", "encode": { "update": { "width": {"signal": "width"}, "height": {"signal": "concat_0_height"} } }, "signals": [{"name": "height", "update": "concat_0_height"}], "marks": [ { "name": "concat_0_marks", "type": "text", "style": ["text"], "from": {"data": "data_0"}, "encode": { "update": { "align": {"value": "center"}, "baseline": {"value": "middle"}, "fill": {"scale": "color", "field": "Origin"}, "description": { "signal": "\"Origin: \" + (format(datum[\"min_xc\"], \"\"))" }, "x": {"scale": "x", "field": "min_xc"}, "y": {"signal": "concat_0_height", "mult": 0.5}, "text": { "signal": "isValid(datum[\"Origin\"]) ? datum[\"Origin\"] : \"\"+datum[\"Origin\"]" } } } } ], "axes": [ { "scale": "x", "orient": "top", "grid": false, "title": "Origin", "labelFlush": true, "labelOverlap": true, "tickCount": {"signal": "ceil(width/40)"}, "zindex": 0 } ] }, { "type": "group", "name": "concat_1_group", "style": "cell", "encode": { "update": { "width": {"signal": "width"}, "height": {"signal": "concat_1_height"} } }, "marks": [ { "name": "concat_1_layer_0_marks", "type": "rect", "style": ["rect"], "from": {"data": "data_1"}, "encode": { "update": { "fill": {"scale": "color", "field": "Origin"}, "opacity": {"scale": "opacity", "field": "Cylinders"}, "tooltip": { "signal": "{\"Origin\": isValid(datum[\"Origin\"]) ? datum[\"Origin\"] : \"\"+datum[\"Origin\"], \"Cylinders\": format(datum[\"Cylinders\"], \"\")}" }, "description": { "signal": "\"nx: \" + (format(datum[\"nx\"], \"\")) + \"; ny: \" + (format(datum[\"ny\"], \"\")) + \"; nx2: \" + (format(datum[\"nx2\"], \"\")) + \"; ny2: \" + (format(datum[\"ny2\"], \"\")) + \"; Origin: \" + (isValid(datum[\"Origin\"]) ? datum[\"Origin\"] : \"\"+datum[\"Origin\"]) + \"; Cylinders: \" + (format(datum[\"Cylinders\"], \"\"))" }, "x": {"scale": "x", "field": "nx"}, "x2": {"scale": "x", "field": "nx2"}, "y": {"scale": "concat_1_y", "field": "ny"}, "y2": {"scale": "concat_1_y", "field": "ny2"} } } }, { "name": "concat_1_layer_1_marks", "type": "text", "style": ["text"], "from": {"data": "data_2"}, "encode": { "update": { "baseline": {"value": "middle"}, "fill": {"value": "black"}, "description": { "signal": "\"xc: \" + (format(datum[\"xc\"], \"\")) + \"; yc: \" + (format(datum[\"yc\"], \"\")) + \"; Cylinders: \" + (isValid(datum[\"Cylinders\"]) ? datum[\"Cylinders\"] : \"\"+datum[\"Cylinders\"])" }, "x": {"scale": "x", "field": "xc"}, "y": {"scale": "concat_1_y", "field": "yc"}, "text": { "signal": "isValid(datum[\"Cylinders\"]) ? datum[\"Cylinders\"] : \"\"+datum[\"Cylinders\"]" }, "align": {"value": "center"} } } } ], "axes": [ { "scale": "concat_1_y", "orient": "left", "grid": false, "title": "Cylinders", "labelOverlap": true, "tickCount": {"signal": "ceil(concat_1_height/40)"}, "zindex": 0 } ] } ], "scales": [ { "name": "x", "type": "linear", "domain": { "fields": [ {"data": "data_0", "field": "min_xc"}, {"data": "data_1", "field": "nx"}, {"data": "data_1", "field": "nx2"}, {"data": "data_2", "field": "xc"} ] }, "range": [0, {"signal": "width"}], "nice": true, "zero": true }, { "name": "color", "type": "ordinal", "domain": { "fields": [ {"data": "data_0", "field": "Origin"}, {"data": "data_1", "field": "Origin"} ], "sort": true }, "range": "category" }, { "name": "opacity", "type": "linear", "domain": {"data": "data_1", "field": "Cylinders"}, "range": [0.3, 0.8], "zero": false }, { "name": "concat_1_y", "type": "linear", "domain": { "fields": [ {"data": "data_1", "field": "ny"}, {"data": "data_1", "field": "ny2"}, {"data": "data_2", "field": "yc"} ] }, "range": [{"signal": "concat_1_height"}, 0], "nice": true, "zero": true } ], "config": { "axis": {"domain": false, "ticks": false, "labels": false, "grid": false}, "style": {"cell": {"stroke": ""}} } }