diff --git a/build/vega-lite-schema.json b/build/vega-lite-schema.json index 6f6542c9ef7..59b93acfac7 100644 --- a/build/vega-lite-schema.json +++ b/build/vega-lite-schema.json @@ -116,7 +116,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -130,7 +130,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "color": { "$ref": "#/definitions/Color", @@ -1139,7 +1139,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -1153,7 +1153,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "cornerRadius": { "description": "The radius in pixels of rounded rectangle corners.\n\n__Default value:__ `0`", @@ -7310,7 +7310,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -7324,7 +7324,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "color": { "$ref": "#/definitions/Color", @@ -7866,7 +7866,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -7880,7 +7880,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "color": { "$ref": "#/definitions/Color", @@ -8133,7 +8133,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -8147,7 +8147,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "binSpacing": { "description": "Offset between bars for binned field. Ideal value for this is either 0 (Preferred by statisticians) or 1 (Vega-Lite Default, D3 example style).\n\n__Default value:__ `1`", @@ -8755,7 +8755,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -8769,7 +8769,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "clip": { "description": "Whether a mark be clipped to the enclosing group’s width and height.", @@ -9582,7 +9582,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -9596,7 +9596,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "binSpacing": { "description": "Offset between bars for binned field. Ideal value for this is either 0 (Preferred by statisticians) or 1 (Vega-Lite Default, D3 example style).\n\n__Default value:__ `1`", @@ -11183,7 +11183,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -11197,7 +11197,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "color": { "$ref": "#/definitions/Color", @@ -11524,7 +11524,7 @@ "properties": { "align": { "$ref": "#/definitions/Align", - "description": "The horizontal alignment of the text. One of `\"left\"`, `\"right\"`, `\"center\"`." + "description": "The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"left\"`, `\"right\"`, `\"center\"`." }, "angle": { "description": "The rotation angle of the text, in degrees.", @@ -11543,7 +11543,7 @@ }, "baseline": { "$ref": "#/definitions/TextBaseline", - "description": "The vertical alignment of the text. One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" + "description": "The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `\"top\"`, `\"middle\"`, `\"bottom\"`.\n\n__Default value:__ `\"middle\"`" }, "color": { "$ref": "#/definitions/Color", diff --git a/examples/compiled/airport_connections.vg.json b/examples/compiled/airport_connections.vg.json index 95de7b9f998..9400ab5e1da 100644 --- a/examples/compiled/airport_connections.vg.json +++ b/examples/compiled/airport_connections.vg.json @@ -170,8 +170,8 @@ "opacity": {"value": 0.35}, "stroke": {"value": "#000"}, "x": {"field": "layer_1_x"}, - "y": {"field": "layer_1_y"}, "x2": {"field": "layer_1_x2"}, + "y": {"field": "layer_1_y"}, "y2": {"field": "layer_1_y2"} } } diff --git a/examples/compiled/area_vertical.vg.json b/examples/compiled/area_vertical.vg.json index ce5f3cadce0..eb6bc087385 100644 --- a/examples/compiled/area_vertical.vg.json +++ b/examples/compiled/area_vertical.vg.json @@ -40,8 +40,8 @@ "orient": {"value": "horizontal"}, "fill": {"value": "#4c78a8"}, "x": {"scale": "x", "field": "sum_Weight_in_lbs"}, - "y": {"scale": "y", "field": "year_Year"}, "x2": {"scale": "x", "value": 0}, + "y": {"scale": "y", "field": "year_Year"}, "defined": { "signal": "datum[\"sum_Weight_in_lbs\"] !== null && !isNaN(datum[\"sum_Weight_in_lbs\"]) && datum[\"year_Year\"] !== null && !isNaN(datum[\"year_Year\"])" } diff --git a/examples/compiled/boxplot_1D_horizontal.vg.json b/examples/compiled/boxplot_1D_horizontal.vg.json index af4b9ac4f27..4ee798c8684 100644 --- a/examples/compiled/boxplot_1D_horizontal.vg.json +++ b/examples/compiled/boxplot_1D_horizontal.vg.json @@ -155,8 +155,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, @@ -172,8 +172,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, diff --git a/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json b/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json index 9d956d35ad7..f6214f5e53c 100644 --- a/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json +++ b/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json @@ -175,8 +175,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, @@ -192,8 +192,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, diff --git a/examples/compiled/boxplot_1D_horizontal_explicit.vg.json b/examples/compiled/boxplot_1D_horizontal_explicit.vg.json index af4b9ac4f27..4ee798c8684 100644 --- a/examples/compiled/boxplot_1D_horizontal_explicit.vg.json +++ b/examples/compiled/boxplot_1D_horizontal_explicit.vg.json @@ -155,8 +155,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, @@ -172,8 +172,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\")}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"signal": "height", "mult": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"signal": "height", "mult": 0.5} } } }, diff --git a/examples/compiled/boxplot_2D_horizontal.vg.json b/examples/compiled/boxplot_2D_horizontal.vg.json index 3d44ee3a917..c5b8e8f7ae3 100644 --- a/examples/compiled/boxplot_2D_horizontal.vg.json +++ b/examples/compiled/boxplot_2D_horizontal.vg.json @@ -157,8 +157,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, @@ -174,8 +174,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/boxplot_2D_horizontal_color_size.vg.json b/examples/compiled/boxplot_2D_horizontal_color_size.vg.json index 0babaada700..04109019565 100644 --- a/examples/compiled/boxplot_2D_horizontal_color_size.vg.json +++ b/examples/compiled/boxplot_2D_horizontal_color_size.vg.json @@ -157,8 +157,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, @@ -174,8 +174,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/boxplot_minmax_2D_horizontal.vg.json b/examples/compiled/boxplot_minmax_2D_horizontal.vg.json index ba8fa5f50e1..a764eb63cd7 100644 --- a/examples/compiled/boxplot_minmax_2D_horizontal.vg.json +++ b/examples/compiled/boxplot_minmax_2D_horizontal.vg.json @@ -84,8 +84,8 @@ "signal": "{\"Max of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Q3 of people\": format(datum[\"upper_box_people\"], \"\"), \"Median of people\": format(datum[\"mid_box_people\"], \"\"), \"Q1 of people\": format(datum[\"lower_box_people\"], \"\"), \"Min of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, @@ -101,8 +101,8 @@ "signal": "{\"Max of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Q3 of people\": format(datum[\"upper_box_people\"], \"\"), \"Median of people\": format(datum[\"mid_box_people\"], \"\"), \"Q1 of people\": format(datum[\"lower_box_people\"], \"\"), \"Min of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/boxplot_minmax_2D_horizontal_custom_midtick_color.vg.json b/examples/compiled/boxplot_minmax_2D_horizontal_custom_midtick_color.vg.json index 2cff81eb454..fafa067ac56 100644 --- a/examples/compiled/boxplot_minmax_2D_horizontal_custom_midtick_color.vg.json +++ b/examples/compiled/boxplot_minmax_2D_horizontal_custom_midtick_color.vg.json @@ -84,8 +84,8 @@ "signal": "{\"Max of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Q3 of people\": format(datum[\"upper_box_people\"], \"\"), \"Median of people\": format(datum[\"mid_box_people\"], \"\"), \"Q1 of people\": format(datum[\"lower_box_people\"], \"\"), \"Min of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, @@ -101,8 +101,8 @@ "signal": "{\"Max of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Q3 of people\": format(datum[\"upper_box_people\"], \"\"), \"Median of people\": format(datum[\"mid_box_people\"], \"\"), \"Q1 of people\": format(datum[\"lower_box_people\"], \"\"), \"Min of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/concat_layer_voyager_result_future.vg.json b/examples/compiled/concat_layer_voyager_result_future.vg.json index 0d25851d253..4fadb63e1a5 100644 --- a/examples/compiled/concat_layer_voyager_result_future.vg.json +++ b/examples/compiled/concat_layer_voyager_result_future.vg.json @@ -166,8 +166,8 @@ "update": { "stroke": {"value": "black"}, "x": {"scale": "concat_0_x", "field": "lo"}, - "y": {"scale": "concat_0_y", "field": "study", "band": 0.5}, - "x2": {"scale": "concat_0_x", "field": "hi"} + "x2": {"scale": "concat_0_x", "field": "hi"}, + "y": {"scale": "concat_0_y", "field": "study", "band": 0.5} } } }, @@ -270,14 +270,14 @@ }, {"scale": "concat_1_x", "field": "from"} ], - "y": {"signal": "concat_1_height", "mult": 0.5}, "x2": [ { "test": "datum[\"to\"] === null || isNaN(datum[\"to\"])", "value": 0 }, {"scale": "concat_1_x", "field": "to"} - ] + ], + "y": {"signal": "concat_1_height", "mult": 0.5} } } }, diff --git a/examples/compiled/errorbar_horizontal_aggregate.vg.json b/examples/compiled/errorbar_horizontal_aggregate.vg.json index ff1f0681b33..4b9aca83362 100644 --- a/examples/compiled/errorbar_horizontal_aggregate.vg.json +++ b/examples/compiled/errorbar_horizontal_aggregate.vg.json @@ -36,8 +36,8 @@ "update": { "stroke": {"value": "black"}, "x": {"scale": "x", "field": "min_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "max_people"} + "x2": {"scale": "x", "field": "max_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/geo_rule.vg.json b/examples/compiled/geo_rule.vg.json index 7b5f5655064..cdbf969c4bb 100644 --- a/examples/compiled/geo_rule.vg.json +++ b/examples/compiled/geo_rule.vg.json @@ -122,8 +122,8 @@ "update": { "stroke": {"value": "black"}, "x": {"field": "layer_2_x"}, - "y": {"field": "layer_2_y"}, "x2": {"field": "layer_2_x2"}, + "y": {"field": "layer_2_y"}, "y2": {"field": "layer_2_y2"} } } diff --git a/examples/compiled/layer_bar_annotations.vg.json b/examples/compiled/layer_bar_annotations.vg.json index 0233d24d25d..5bba28f0a0b 100644 --- a/examples/compiled/layer_bar_annotations.vg.json +++ b/examples/compiled/layer_bar_annotations.vg.json @@ -120,8 +120,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "ThresholdValue"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "ThresholdValue"} } } }, diff --git a/examples/compiled/layer_bar_month.vg.json b/examples/compiled/layer_bar_month.vg.json index 1dd1b764e9a..f4f83f6de8e 100644 --- a/examples/compiled/layer_bar_month.vg.json +++ b/examples/compiled/layer_bar_month.vg.json @@ -74,8 +74,8 @@ "update": { "stroke": {"value": "firebrick"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_precipitation"}, "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_precipitation"}, "strokeWidth": {"value": 3} } } diff --git a/examples/compiled/layer_boxplot_circle.vg.json b/examples/compiled/layer_boxplot_circle.vg.json index 957a6e7e7f3..4316abb28cb 100644 --- a/examples/compiled/layer_boxplot_circle.vg.json +++ b/examples/compiled/layer_boxplot_circle.vg.json @@ -132,8 +132,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "lower_whisker_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "lower_box_people"} + "x2": {"scale": "x", "field": "lower_box_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, @@ -149,8 +149,8 @@ "signal": "{\"Upper Whisker of people\": format(datum[\"upper_whisker_people\"], \"\"), \"Lower Whisker of people\": format(datum[\"lower_whisker_people\"], \"\"), \"age\": ''+datum[\"age\"]}" }, "x": {"scale": "x", "field": "upper_box_people"}, - "y": {"scale": "y", "field": "age", "band": 0.5}, - "x2": {"scale": "x", "field": "upper_whisker_people"} + "x2": {"scale": "x", "field": "upper_whisker_people"}, + "y": {"scale": "y", "field": "age", "band": 0.5} } } }, diff --git a/examples/compiled/layer_line_color_rule.vg.json b/examples/compiled/layer_line_color_rule.vg.json index d8e5a1cd4d3..ad52078054d 100644 --- a/examples/compiled/layer_line_color_rule.vg.json +++ b/examples/compiled/layer_line_color_rule.vg.json @@ -72,8 +72,8 @@ "update": { "stroke": {"scale": "color", "field": "symbol"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_price"}, "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_price"}, "strokeWidth": {"value": 2} } } diff --git a/examples/compiled/layer_point_errorbar_1d_horizontal.vg.json b/examples/compiled/layer_point_errorbar_1d_horizontal.vg.json index ec00ac6be97..f47c52e85e0 100644 --- a/examples/compiled/layer_point_errorbar_1d_horizontal.vg.json +++ b/examples/compiled/layer_point_errorbar_1d_horizontal.vg.json @@ -61,14 +61,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"signal": "height", "mult": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"signal": "height", "mult": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal.vg.json index 1a2776303e4..34db419aa15 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal.vg.json @@ -63,14 +63,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal_ci.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal_ci.vg.json index 643cb85bcb9..ae1ba78dfc1 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal_ci.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal_ci.vg.json @@ -53,14 +53,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal_color_encoding.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal_color_encoding.vg.json index acb6a17ed72..e5ecd1c5692 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal_color_encoding.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal_color_encoding.vg.json @@ -139,14 +139,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal_custom_ticks.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal_custom_ticks.vg.json index 96a484b1cfd..774eca4d7bc 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal_custom_ticks.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal_custom_ticks.vg.json @@ -139,14 +139,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal_iqr.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal_iqr.vg.json index e4a8ef0cd33..ae3bc6f36ed 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal_iqr.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal_iqr.vg.json @@ -53,14 +53,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_2d_horizontal_stdev.vg.json b/examples/compiled/layer_point_errorbar_2d_horizontal_stdev.vg.json index 87ef05dc9cc..87bfce0c26a 100644 --- a/examples/compiled/layer_point_errorbar_2d_horizontal_stdev.vg.json +++ b/examples/compiled/layer_point_errorbar_2d_horizontal_stdev.vg.json @@ -63,14 +63,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_ci.vg.json b/examples/compiled/layer_point_errorbar_ci.vg.json index 873df5795b6..f346349f2c0 100644 --- a/examples/compiled/layer_point_errorbar_ci.vg.json +++ b/examples/compiled/layer_point_errorbar_ci.vg.json @@ -72,14 +72,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } } diff --git a/examples/compiled/layer_point_errorbar_pre_aggregated_asymmetric_error.vg.json b/examples/compiled/layer_point_errorbar_pre_aggregated_asymmetric_error.vg.json index 46e6baa8991..12d2e3056ac 100644 --- a/examples/compiled/layer_point_errorbar_pre_aggregated_asymmetric_error.vg.json +++ b/examples/compiled/layer_point_errorbar_pre_aggregated_asymmetric_error.vg.json @@ -88,14 +88,14 @@ }, {"scale": "x", "field": "lower_yield_center"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield_center\"] === null || isNaN(datum[\"upper_yield_center\"])", "value": 0 }, {"scale": "x", "field": "upper_yield_center"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_pre_aggregated_symmetric_error.vg.json b/examples/compiled/layer_point_errorbar_pre_aggregated_symmetric_error.vg.json index 611f977f240..e3821e54b90 100644 --- a/examples/compiled/layer_point_errorbar_pre_aggregated_symmetric_error.vg.json +++ b/examples/compiled/layer_point_errorbar_pre_aggregated_symmetric_error.vg.json @@ -76,14 +76,14 @@ }, {"scale": "x", "field": "lower_yield_center"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield_center\"] === null || isNaN(datum[\"upper_yield_center\"])", "value": 0 }, {"scale": "x", "field": "upper_yield_center"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_pre_aggregated_upper_lower.vg.json b/examples/compiled/layer_point_errorbar_pre_aggregated_upper_lower.vg.json index a90c2533449..91df695bf6c 100644 --- a/examples/compiled/layer_point_errorbar_pre_aggregated_upper_lower.vg.json +++ b/examples/compiled/layer_point_errorbar_pre_aggregated_upper_lower.vg.json @@ -88,14 +88,14 @@ }, {"scale": "x", "field": "lower_upper_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_upper_yield\"] === null || isNaN(datum[\"upper_upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } }, diff --git a/examples/compiled/layer_point_errorbar_stdev.vg.json b/examples/compiled/layer_point_errorbar_stdev.vg.json index 07f20bd88d4..4d62c27f937 100644 --- a/examples/compiled/layer_point_errorbar_stdev.vg.json +++ b/examples/compiled/layer_point_errorbar_stdev.vg.json @@ -82,14 +82,14 @@ }, {"scale": "x", "field": "lower_yield"} ], - "y": {"scale": "y", "field": "variety", "band": 0.5}, "x2": [ { "test": "datum[\"upper_yield\"] === null || isNaN(datum[\"upper_yield\"])", "value": 0 }, {"scale": "x", "field": "upper_yield"} - ] + ], + "y": {"scale": "y", "field": "variety", "band": 0.5} } } } diff --git a/examples/compiled/layer_precipitation_mean.vg.json b/examples/compiled/layer_precipitation_mean.vg.json index 85a13827fe4..ff21333c10e 100644 --- a/examples/compiled/layer_precipitation_mean.vg.json +++ b/examples/compiled/layer_precipitation_mean.vg.json @@ -74,8 +74,8 @@ "update": { "stroke": {"value": "red"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_precipitation"}, "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_precipitation"}, "strokeWidth": {"value": 3} } } diff --git a/examples/compiled/layer_rect_extent.vg.json b/examples/compiled/layer_rect_extent.vg.json index 8f2c2fddfaf..008f61de4c6 100644 --- a/examples/compiled/layer_rect_extent.vg.json +++ b/examples/compiled/layer_rect_extent.vg.json @@ -61,8 +61,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "min_Miles_per_Gallon"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "min_Miles_per_Gallon"} } } }, @@ -75,8 +75,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "max_Miles_per_Gallon"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "max_Miles_per_Gallon"} } } }, diff --git a/examples/compiled/layer_scatter_errorband_1D_stdev_global_mean.vg.json b/examples/compiled/layer_scatter_errorband_1D_stdev_global_mean.vg.json index 9332a626801..0f5e54b62a7 100644 --- a/examples/compiled/layer_scatter_errorband_1D_stdev_global_mean.vg.json +++ b/examples/compiled/layer_scatter_errorband_1D_stdev_global_mean.vg.json @@ -104,8 +104,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_Miles_per_Gallon"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_Miles_per_Gallon"} } } } diff --git a/examples/compiled/rule_color_mean.vg.json b/examples/compiled/rule_color_mean.vg.json index 5dc80f91fe5..5bdd454597b 100644 --- a/examples/compiled/rule_color_mean.vg.json +++ b/examples/compiled/rule_color_mean.vg.json @@ -33,8 +33,8 @@ "update": { "stroke": {"scale": "color", "field": "symbol"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_price"}, "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_price"}, "strokeWidth": {"value": 2} } } diff --git a/examples/compiled/scatter_image.svg b/examples/compiled/scatter_image.svg index f90b3d65180..d492fa34c22 100644 --- a/examples/compiled/scatter_image.svg +++ b/examples/compiled/scatter_image.svg @@ -1 +1 @@ -0.00.51.01.52.02.5x0.00.51.01.52.02.5y \ No newline at end of file +0.00.51.01.52.02.5x0.00.51.01.52.02.5y \ No newline at end of file diff --git a/examples/compiled/scatter_image.vg.json b/examples/compiled/scatter_image.vg.json index 1ebaef73797..a91d98e4e6a 100644 --- a/examples/compiled/scatter_image.vg.json +++ b/examples/compiled/scatter_image.vg.json @@ -36,8 +36,8 @@ "update": { "width": {"value": 50}, "height": {"value": 50}, - "x": {"scale": "x", "field": "x"}, - "y": {"scale": "y", "field": "y"}, + "xc": {"scale": "x", "field": "x"}, + "yc": {"scale": "y", "field": "y"}, "url": {"signal": "''+datum[\"img\"]"} } } diff --git a/examples/compiled/selection_layer_bar_month.vg.json b/examples/compiled/selection_layer_bar_month.vg.json index d2dec6f95e0..d479d593984 100644 --- a/examples/compiled/selection_layer_bar_month.vg.json +++ b/examples/compiled/selection_layer_bar_month.vg.json @@ -286,8 +286,8 @@ "update": { "stroke": {"value": "firebrick"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "mean_precipitation"}, "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "mean_precipitation"}, "strokeWidth": {"value": 3} } } diff --git a/examples/compiled/trellis_cross_sort.vg.json b/examples/compiled/trellis_cross_sort.vg.json index dd61790ab40..6c52fcd80d7 100644 --- a/examples/compiled/trellis_cross_sort.vg.json +++ b/examples/compiled/trellis_cross_sort.vg.json @@ -281,8 +281,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "median_median_y_by_b"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "median_median_y_by_b"} } } } diff --git a/examples/compiled/trellis_cross_sort_array.vg.json b/examples/compiled/trellis_cross_sort_array.vg.json index 5ed008fccbb..4a41d079b59 100644 --- a/examples/compiled/trellis_cross_sort_array.vg.json +++ b/examples/compiled/trellis_cross_sort_array.vg.json @@ -290,8 +290,8 @@ "update": { "stroke": {"value": "black"}, "x": {"value": 0}, - "y": {"scale": "y", "field": "median_median_y_by_b"}, - "x2": {"field": {"group": "width"}} + "x2": {"field": {"group": "width"}}, + "y": {"scale": "y", "field": "median_median_y_by_b"} } } } diff --git a/examples/compiled/waterfall_chart.vg.json b/examples/compiled/waterfall_chart.vg.json index 5833da7b25b..268b0b43a6e 100644 --- a/examples/compiled/waterfall_chart.vg.json +++ b/examples/compiled/waterfall_chart.vg.json @@ -167,8 +167,8 @@ "strokeWidth": {"value": 2}, "stroke": {"value": "#404040"}, "x": {"scale": "x", "field": "label", "offset": -22.5, "band": 0.5}, - "y": {"scale": "y", "field": "sum"}, - "x2": {"scale": "x", "field": "lead", "offset": 22.5, "band": 0.5} + "x2": {"scale": "x", "field": "lead", "offset": 22.5, "band": 0.5}, + "y": {"scale": "y", "field": "sum"} } } }, diff --git a/site/docs/mark/area.md b/site/docs/mark/area.md index be52d75f07e..4f4aefff4a3 100644 --- a/site/docs/mark/area.md +++ b/site/docs/mark/area.md @@ -44,7 +44,7 @@ permalink: /docs/area.html An area mark definition can contain any [standard mark properties](mark.html#mark-def) and the following line interpolation as well as line and point overlay properties: -{% include table.html props="orient,interpolate,tension,line,point" source="MarkDef" %} +{% include table.html props="align,baseline,orient,interpolate,tension,line,point" source="MarkDef" %} ## Examples diff --git a/site/docs/mark/bar.md b/site/docs/mark/bar.md index e07d660b460..6cc802ad21a 100644 --- a/site/docs/mark/bar.md +++ b/site/docs/mark/bar.md @@ -44,7 +44,7 @@ Bar marks are useful in many visualizations, including bar charts, [stacked bar A bar mark definition can contain any [standard mark properties](mark.html#mark-def) and the following special properties: -{% include table.html props="orient,binSpacing,cornerRadius" source="MarkDef" %} +{% include table.html props="orient,align,baseline,binSpacing,cornerRadius" source="MarkDef" %} ## Examples diff --git a/site/docs/mark/rect.md b/site/docs/mark/rect.md index 8590c576bd6..dd6bc5988cb 100644 --- a/site/docs/mark/rect.md +++ b/site/docs/mark/rect.md @@ -41,7 +41,9 @@ The `rect` mark represents an arbitrary rectangle. } ``` -A rect mark definition can contain any [standard mark properties](mark.html#mark-def) and the following special properties: {% include table.html props="cornerRadius" source="MarkConfig" %} +A rect mark definition can contain any [standard mark properties](mark.html#mark-def) and the following special properties: + +{% include table.html props="align,baseline,cornerRadius" source="MarkConfig" %} ## Examples diff --git a/src/compile/mark/area.ts b/src/compile/mark/area.ts index 92718ee1758..ce6eb97b44a 100644 --- a/src/compile/mark/area.ts +++ b/src/compile/mark/area.ts @@ -6,10 +6,23 @@ export const area: MarkCompiler = { vgMark: 'area', encodeEntry: (model: UnitModel) => { return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'include'}), - ...mixins.pointPosition('x', model, 'zeroOrMin'), - ...mixins.pointPosition('y', model, 'zeroOrMin'), - ...mixins.pointPosition2(model, 'zeroOrMin', model.markDef.orient === 'horizontal' ? 'x2' : 'y2'), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + orient: 'include', + size: 'ignore' + }), + ...mixins.pointOrRangePosition('x', model, { + defaultRef: 'zeroOrMin', + defaultRef2: 'zeroOrMin', + range: model.markDef.orient === 'horizontal' + }), + ...mixins.pointOrRangePosition('y', model, { + defaultRef: 'zeroOrMin', + defaultRef2: 'zeroOrMin', + range: model.markDef.orient === 'vertical' + }), ...mixins.defined(model) }; } diff --git a/src/compile/mark/bar.ts b/src/compile/mark/bar.ts index 494d4a74179..5bd16e60021 100644 --- a/src/compile/mark/bar.ts +++ b/src/compile/mark/bar.ts @@ -7,7 +7,13 @@ export const bar: MarkCompiler = { vgMark: 'rect', encodeEntry: (model: UnitModel) => { return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + orient: 'ignore', + size: 'ignore' + }), ...rectPosition(model, 'x', 'bar'), ...rectPosition(model, 'y', 'bar') }; diff --git a/src/compile/mark/geoshape.ts b/src/compile/mark/geoshape.ts index 14d0e9f353f..540a3660218 100644 --- a/src/compile/mark/geoshape.ts +++ b/src/compile/mark/geoshape.ts @@ -9,7 +9,13 @@ export const geoshape: MarkCompiler = { vgMark: 'shape', encodeEntry: (model: UnitModel) => { return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}) + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + size: 'ignore', + orient: 'ignore' + }) }; }, postEncodingTransform: (model: UnitModel): VgPostEncodingTransform[] => { diff --git a/src/compile/mark/image.ts b/src/compile/mark/image.ts index a13a7548fc2..b6c51e623a3 100644 --- a/src/compile/mark/image.ts +++ b/src/compile/mark/image.ts @@ -7,7 +7,13 @@ export const image: MarkCompiler = { vgMark: 'image', encodeEntry: (model: UnitModel) => { return { - ...mixins.baseEncodeEntry(model, {color: 'ignore', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'ignore', + orient: 'ignore', + size: 'ignore' + }), ...rectPosition(model, 'x', 'image'), ...rectPosition(model, 'y', 'image'), ...mixins.text(model, 'url') diff --git a/src/compile/mark/line.ts b/src/compile/mark/line.ts index a499af43689..132908dd470 100644 --- a/src/compile/mark/line.ts +++ b/src/compile/mark/line.ts @@ -9,7 +9,13 @@ export const line: MarkCompiler = { const {width, height} = model; return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + size: 'ignore', + orient: 'ignore' + }), ...mixins.pointPosition('x', model, ref.mid(width)), ...mixins.pointPosition('y', model, ref.mid(height)), ...mixins.nonPosition('size', model, { @@ -26,7 +32,13 @@ export const trail: MarkCompiler = { const {width, height} = model; return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'include', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + size: 'include', + orient: 'ignore' + }), ...mixins.pointPosition('x', model, ref.mid(width)), ...mixins.pointPosition('y', model, ref.mid(height)), ...mixins.nonPosition('size', model), diff --git a/src/compile/mark/mixins.ts b/src/compile/mark/mixins.ts index 8327173b924..ae84436cad1 100644 --- a/src/compile/mark/mixins.ts +++ b/src/compile/mark/mixins.ts @@ -84,7 +84,7 @@ export function color(model: UnitModel): VgEncodeEntry { }; } -export type Ignore = Record<'color' | 'size' | 'orient', 'ignore' | 'include'>; +export type Ignore = Record<'color' | 'size' | 'orient' | 'align' | 'baseline', 'ignore' | 'include'>; export function baseEncodeEntry(model: UnitModel, ignore: Ignore) { const {fill = undefined, stroke = undefined} = ignore.color === 'include' ? color(model) : {}; @@ -472,11 +472,30 @@ const ALIGNED_X_CHANNEL: {[a in Align]: VgEncodeChannel} = { }; const BASELINED_Y_CHANNEL = { - top: 'y2', + top: 'y', middle: 'yc', - bottom: 'y' + bottom: 'y2' }; +export function pointOrRangePosition( + channel: 'x' | 'y', + model: UnitModel, + { + defaultRef, + defaultRef2, + range + }: { + defaultRef: 'zeroOrMin' | 'zeroOrMax' | VgValueRef; + defaultRef2: 'zeroOrMin' | 'zeroOrMax'; + range: boolean; + } +) { + if (range) { + return rangePosition(channel, model, {defaultRef, defaultRef2}); + } + return pointPosition(channel, model, defaultRef); +} + export function rangePosition( channel: 'x' | 'y', model: UnitModel, @@ -484,7 +503,7 @@ export function rangePosition( defaultRef, defaultRef2 }: { - defaultRef: 'zeroOrMin' | 'zeroOrMax'; + defaultRef: 'zeroOrMin' | 'zeroOrMax' | VgValueRef; defaultRef2: 'zeroOrMin' | 'zeroOrMax'; } ) { @@ -516,7 +535,7 @@ function alignedChannel(channel: 'x' | 'y', markDef: MarkDef, config: Config) { * Return mixins for x2, y2. * If channel is not specified, return one channel based on orientation. */ -export function pointPosition2(model: UnitModel, defaultRef: 'zeroOrMin' | 'zeroOrMax', channel: 'x2' | 'y2') { +function pointPosition2(model: UnitModel, defaultRef: 'zeroOrMin' | 'zeroOrMax', channel: 'x2' | 'y2') { const {encoding, mark, markDef, stack, config} = model; const baseChannel = channel === 'x2' ? 'x' : 'y'; diff --git a/src/compile/mark/point.ts b/src/compile/mark/point.ts index 29fbb9f456a..23a37545e28 100644 --- a/src/compile/mark/point.ts +++ b/src/compile/mark/point.ts @@ -9,7 +9,13 @@ function encodeEntry(model: UnitModel, fixedShape?: 'circle' | 'square') { const {config, width, height} = model; return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'include', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + size: 'include', + orient: 'ignore' + }), ...mixins.pointPosition('x', model, ref.mid(width)), ...mixins.pointPosition('y', model, ref.mid(height)), ...mixins.nonPosition('size', model), diff --git a/src/compile/mark/rect.ts b/src/compile/mark/rect.ts index 2eb43efb45e..ea04122568a 100644 --- a/src/compile/mark/rect.ts +++ b/src/compile/mark/rect.ts @@ -17,7 +17,13 @@ export const rect: MarkCompiler = { vgMark: 'rect', encodeEntry: (model: UnitModel) => { return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + orient: 'ignore', + size: 'ignore' + }), ...rectPosition(model, 'x', 'rect'), ...rectPosition(model, 'y', 'rect') }; @@ -81,10 +87,7 @@ export function rectPosition(model: UnitModel, channel: 'x' | 'y', mark: 'bar' | defaultSizeRef(mark, markDef, sizeChannel, scaleName, scale, config) ); } else { - return { - ...mixins.pointPosition(channel, model, 'zeroOrMax'), - ...mixins.pointPosition2(model, 'zeroOrMin', channel2) - }; + return mixins.rangePosition(channel, model, {defaultRef: 'zeroOrMax', defaultRef2: 'zeroOrMin'}); } } diff --git a/src/compile/mark/rule.ts b/src/compile/mark/rule.ts index ee515badfaa..9c5393424fe 100644 --- a/src/compile/mark/rule.ts +++ b/src/compile/mark/rule.ts @@ -15,16 +15,23 @@ export const rule: MarkCompiler = { } return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), - ...mixins.pointPosition('x', model, orient === 'horizontal' ? 'zeroOrMin' : ref.mid(width)), - ...mixins.pointPosition('y', model, orient === 'vertical' ? 'zeroOrMin' : ref.mid(height)), - - // include x2 for horizontal or line segment rule - ...(orient !== 'vertical' ? mixins.pointPosition2(model, 'zeroOrMax', 'x2') : {}), - - // include y2 for vertical or line segment rule - ...(orient !== 'horizontal' ? mixins.pointPosition2(model, 'zeroOrMax', 'y2') : {}), - + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + orient: 'ignore', + size: 'ignore' + }), + ...mixins.pointOrRangePosition('x', model, { + defaultRef: orient === 'horizontal' ? 'zeroOrMin' : ref.mid(width), + defaultRef2: 'zeroOrMax', + range: orient !== 'vertical' // include x2 for horizontal or line segment rule + }), + ...mixins.pointOrRangePosition('y', model, { + defaultRef: orient === 'vertical' ? 'zeroOrMin' : ref.mid(height), + defaultRef2: 'zeroOrMax', + range: orient !== 'horizontal' // include y2 for vertical or line segment rule + }), ...mixins.nonPosition('size', model, { vgChannel: 'strokeWidth' // VL's rule size is strokeWidth }) diff --git a/src/compile/mark/text.ts b/src/compile/mark/text.ts index 4b2fe82f19d..15420037169 100644 --- a/src/compile/mark/text.ts +++ b/src/compile/mark/text.ts @@ -14,7 +14,13 @@ export const text: MarkCompiler = { const {config, encoding, width, height} = model; return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'include', + baseline: 'include', + color: 'include', + size: 'ignore', + orient: 'ignore' + }), ...mixins.pointPosition('x', model, ref.mid(width)), ...mixins.pointPosition('y', model, ref.mid(height)), ...mixins.text(model), diff --git a/src/compile/mark/tick.ts b/src/compile/mark/tick.ts index 04798e9d669..5b861558897 100644 --- a/src/compile/mark/tick.ts +++ b/src/compile/mark/tick.ts @@ -19,7 +19,13 @@ export const tick: MarkCompiler = { const vgThicknessChannel = orient === 'horizontal' ? 'height' : 'width'; return { - ...mixins.baseEncodeEntry(model, {color: 'include', size: 'ignore', orient: 'ignore'}), + ...mixins.baseEncodeEntry(model, { + align: 'ignore', + baseline: 'ignore', + color: 'include', + orient: 'ignore', + size: 'ignore' + }), ...mixins.pointPosition('x', model, ref.mid(width), {vgChannel: 'xc'}), ...mixins.pointPosition('y', model, ref.mid(height), {vgChannel: 'yc'}), diff --git a/src/vega.schema.ts b/src/vega.schema.ts index 41c70e1c6e9..0da64673a46 100644 --- a/src/vega.schema.ts +++ b/src/vega.schema.ts @@ -879,7 +879,7 @@ export interface BaseMarkConfig { // Text / Label Mark Config /** - * The horizontal alignment of the text. One of `"left"`, `"right"`, `"center"`. + * The horizontal alignment of the text or ranged marks (area, bar, image, rect, rule). One of `"left"`, `"right"`, `"center"`. */ align?: Align; @@ -891,10 +891,9 @@ export interface BaseMarkConfig { angle?: number; /** - * The vertical alignment of the text. One of `"top"`, `"middle"`, `"bottom"`. + * The vertical alignment of the text or ranged marks (area, bar, image, rect, rule). One of `"top"`, `"middle"`, `"bottom"`. * * __Default value:__ `"middle"` - * */ baseline?: VgTextBaseline; diff --git a/test/compile/mark/rect.test.ts b/test/compile/mark/rect.test.ts index 8f7025b12f2..7d09bac0768 100644 --- a/test/compile/mark/rect.test.ts +++ b/test/compile/mark/rect.test.ts @@ -17,6 +17,25 @@ describe('Mark: Rect', () => { const props = rect.encodeEntry(model); it('should draw centered rect ', () => { + expect(props.xc).toEqual({scale: 'x', field: 'x'}); + expect(props.width).toEqual({value: 50}); + expect(props.yc).toEqual({scale: 'y', field: 'y'}); + expect(props.height).toEqual({value: 49}); + }); + }); + + describe('simple with width and height with left align and top baseline', () => { + const model = parseUnitModelWithScaleAndLayoutSize({ + data: {url: 'data/cars.json'}, + mark: {type: 'rect', width: 50, height: 49, align: 'left', baseline: 'top'}, + encoding: { + x: {field: 'x', type: 'quantitative'}, + y: {type: 'quantitative', field: 'y'} + } + }); + const props = rect.encodeEntry(model); + + it('should draw rect with proper alignment', () => { expect(props.x).toEqual({scale: 'x', field: 'x'}); expect(props.width).toEqual({value: 50}); expect(props.y).toEqual({scale: 'y', field: 'y'}); @@ -24,6 +43,25 @@ describe('Mark: Rect', () => { }); }); + describe('simple with width and height with right align and bottom baseline', () => { + const model = parseUnitModelWithScaleAndLayoutSize({ + data: {url: 'data/cars.json'}, + mark: {type: 'rect', width: 50, height: 49, align: 'right', baseline: 'bottom'}, + encoding: { + x: {field: 'x', type: 'quantitative'}, + y: {type: 'quantitative', field: 'y'} + } + }); + const props = rect.encodeEntry(model); + + it('should draw rect with proper alignment', () => { + expect(props.x2).toEqual({scale: 'x', field: 'x'}); + expect(props.width).toEqual({value: 50}); + expect(props.y2).toEqual({scale: 'y', field: 'y'}); + expect(props.height).toEqual({value: 49}); + }); + }); + describe('simple with fixed x2 and y2', () => { const model = parseUnitModelWithScaleAndLayoutSize({ data: {url: 'data/cars.json'},