diff --git a/examples/compiled/bar_tooltip_aggregate.vg.json b/examples/compiled/bar_tooltip_aggregate.vg.json index f4b9af25c1..3abf49fbc0 100644 --- a/examples/compiled/bar_tooltip_aggregate.vg.json +++ b/examples/compiled/bar_tooltip_aggregate.vg.json @@ -41,7 +41,7 @@ }, "xc": {"signal": "width", "mult": 0.5}, "yc": {"scale": "y", "field": "mean_data"}, - "width": {"value": 15}, + "width": {"signal": "(1 - 0.25) * width"}, "height": {"value": 1} } } diff --git a/examples/compiled/bar_tooltip_groupby.vg.json b/examples/compiled/bar_tooltip_groupby.vg.json index d024f77b49..70a15cebcb 100644 --- a/examples/compiled/bar_tooltip_groupby.vg.json +++ b/examples/compiled/bar_tooltip_groupby.vg.json @@ -43,7 +43,7 @@ }, "xc": {"signal": "width", "mult": 0.5}, "yc": {"scale": "y", "field": "mean_data"}, - "width": {"value": 15}, + "width": {"signal": "(1 - 0.25) * width"}, "height": {"value": 1} } } diff --git a/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json b/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json index b46b4f4f66..6822bb72b3 100644 --- a/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json +++ b/examples/compiled/boxplot_1D_horizontal_custom_mark.vg.json @@ -213,7 +213,7 @@ }, "xc": {"scale": "x", "field": "lower_whisker_Body Mass (g)"}, "yc": {"signal": "height", "mult": 0.5}, - "height": {"value": 15}, + "height": {"signal": "(1 - 0.25) * height"}, "width": {"value": 1} } } @@ -233,7 +233,7 @@ }, "xc": {"scale": "x", "field": "upper_whisker_Body Mass (g)"}, "yc": {"signal": "height", "mult": 0.5}, - "height": {"value": 15}, + "height": {"signal": "(1 - 0.25) * height"}, "width": {"value": 1} } } diff --git a/examples/compiled/errorbar_2d_vertical_ticks.png b/examples/compiled/errorbar_2d_vertical_ticks.png index 6263d04751..78ad1fcbeb 100644 Binary files a/examples/compiled/errorbar_2d_vertical_ticks.png and b/examples/compiled/errorbar_2d_vertical_ticks.png differ diff --git a/examples/compiled/errorbar_2d_vertical_ticks.svg b/examples/compiled/errorbar_2d_vertical_ticks.svg index 6de06f9260..f1d06c2fb4 100644 --- a/examples/compiled/errorbar_2d_vertical_ticks.svg +++ b/examples/compiled/errorbar_2d_vertical_ticks.svg @@ -1 +1 @@ -197019721974197619781980Year (year)1520253035Miles per Gallon (95% CIs) \ No newline at end of file +197019721974197619781980Year (year)1520253035Miles per Gallon (95% CIs) \ No newline at end of file diff --git a/examples/compiled/errorbar_2d_vertical_ticks.vg.json b/examples/compiled/errorbar_2d_vertical_ticks.vg.json index 35c3dd8558..eb3bcf8ccd 100644 --- a/examples/compiled/errorbar_2d_vertical_ticks.vg.json +++ b/examples/compiled/errorbar_2d_vertical_ticks.vg.json @@ -71,7 +71,7 @@ }, "xc": {"scale": "x", "field": "year_Year"}, "yc": {"scale": "y", "field": "lower_Miles_per_Gallon"}, - "width": {"value": 15}, + "width": {"signal": "(1 - 0.25) * width"}, "height": {"value": 1} } } @@ -91,7 +91,7 @@ }, "xc": {"scale": "x", "field": "year_Year"}, "yc": {"scale": "y", "field": "upper_Miles_per_Gallon"}, - "width": {"value": 15}, + "width": {"signal": "(1 - 0.25) * width"}, "height": {"value": 1} } } diff --git a/examples/compiled/facet_bullet.vg.json b/examples/compiled/facet_bullet.vg.json index d594fea208..353bcc5a24 100644 --- a/examples/compiled/facet_bullet.vg.json +++ b/examples/compiled/facet_bullet.vg.json @@ -439,7 +439,7 @@ }, "xc": {"scale": "child_x", "field": "markers\\.0"}, "yc": {"signal": "child_height", "mult": 0.5}, - "height": {"value": 15}, + "height": {"signal": "(1 - 0.25) * child_height"}, "width": {"value": 2} } } diff --git a/examples/compiled/tick_dot.vg.json b/examples/compiled/tick_dot.vg.json index d8b575c0b5..1ee300c2df 100644 --- a/examples/compiled/tick_dot.vg.json +++ b/examples/compiled/tick_dot.vg.json @@ -34,7 +34,7 @@ }, "xc": {"scale": "x", "field": "precipitation"}, "yc": {"signal": "height", "mult": 0.5}, - "height": {"value": 15}, + "height": {"signal": "(1 - 0.25) * height"}, "width": {"value": 1} } } diff --git a/examples/compiled/tick_sort.vg.json b/examples/compiled/tick_sort.vg.json index e54fb4aed0..05a2fd5cfb 100644 --- a/examples/compiled/tick_sort.vg.json +++ b/examples/compiled/tick_sort.vg.json @@ -34,7 +34,7 @@ }, "xc": {"scale": "x", "field": "Horsepower"}, "yc": {"signal": "height", "mult": 0.5}, - "height": {"value": 15}, + "height": {"signal": "(1 - 0.25) * height"}, "width": {"value": 1} } } diff --git a/examples/compiled/tick_strip_1D_with_height.png b/examples/compiled/tick_strip_1D_with_height.png new file mode 100644 index 0000000000..9ba419d02d Binary files /dev/null and b/examples/compiled/tick_strip_1D_with_height.png differ diff --git a/examples/compiled/tick_strip_1D_with_height.svg b/examples/compiled/tick_strip_1D_with_height.svg new file mode 100644 index 0000000000..fe38c0caec --- /dev/null +++ b/examples/compiled/tick_strip_1D_with_height.svg @@ -0,0 +1 @@ +050100150200Horsepower \ No newline at end of file diff --git a/examples/compiled/tick_strip_1D_with_height.vg.json b/examples/compiled/tick_strip_1D_with_height.vg.json new file mode 100644 index 0000000000..921930cb87 --- /dev/null +++ b/examples/compiled/tick_strip_1D_with_height.vg.json @@ -0,0 +1,78 @@ +{ + "$schema": "https://vega.github.io/schema/vega/v5.json", + "background": "white", + "padding": 5, + "width": 200, + "height": 200, + "style": "cell", + "data": [ + { + "name": "source_0", + "url": "data/cars.json", + "format": {"type": "json"}, + "transform": [ + { + "type": "filter", + "expr": "isValid(datum[\"Horsepower\"]) && isFinite(+datum[\"Horsepower\"])" + } + ] + } + ], + "marks": [ + { + "name": "marks", + "type": "rect", + "style": ["tick"], + "from": {"data": "source_0"}, + "encode": { + "update": { + "opacity": {"value": 0.7}, + "fill": {"value": "#4c78a8"}, + "ariaRoleDescription": {"value": "tick"}, + "description": { + "signal": "\"Horsepower: \" + (format(datum[\"Horsepower\"], \"\"))" + }, + "xc": {"scale": "x", "field": "Horsepower"}, + "yc": {"signal": "height", "mult": 0.5}, + "height": {"signal": "(1 - 0.25) * height"}, + "width": {"value": 1} + } + } + } + ], + "scales": [ + { + "name": "x", + "type": "linear", + "domain": {"data": "source_0", "field": "Horsepower"}, + "range": [0, {"signal": "width"}], + "nice": true, + "zero": true + } + ], + "axes": [ + { + "scale": "x", + "orient": "bottom", + "grid": true, + "tickCount": {"signal": "ceil(width/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 + } + ] +} diff --git a/examples/specs/tick_strip_1D_with_height.vl.json b/examples/specs/tick_strip_1D_with_height.vl.json new file mode 100644 index 0000000000..1663787c40 --- /dev/null +++ b/examples/specs/tick_strip_1D_with_height.vl.json @@ -0,0 +1,9 @@ +{ + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "data": {"url": "data/cars.json"}, + "height": 200, + "mark": "tick", + "encoding": { + "x": {"field": "Horsepower", "type": "quantitative"} + } +} diff --git a/src/compile/mark/tick.ts b/src/compile/mark/tick.ts index 4b045b84ba..cf0654f657 100644 --- a/src/compile/mark/tick.ts +++ b/src/compile/mark/tick.ts @@ -1,5 +1,4 @@ import {isNumber} from 'vega-util'; -import {getViewConfigDiscreteStep} from '../../config'; import {isVgRangeStep, VgValueRef} from '../../vega.schema'; import {exprFromSignalRefOrValue, getMarkPropOrConfig, signalOrValueRef} from '../common'; import {UnitModel} from '../unit'; @@ -51,7 +50,6 @@ function defaultSize(model: UnitModel): VgValueRef { // Use offset scale if exists const scale = model.getScaleComponent(offsetScaleChannel) || model.getScaleComponent(positionChannel); - const scaleName = model.scaleName(offsetScaleChannel) || model.scaleName(positionChannel); const markPropOrConfig = getMarkPropOrConfig('size', markDef, config, {vgChannel: vgSizeChannel}) ?? config.tick.bandSize; @@ -59,18 +57,18 @@ function defaultSize(model: UnitModel): VgValueRef { if (markPropOrConfig !== undefined) { return signalOrValueRef(markPropOrConfig); } else if (scale?.get('type') === 'band') { + const scaleName = model.scaleName(offsetScaleChannel) || model.scaleName(positionChannel); return {scale: scaleName, band: 1}; } const scaleRange = scale?.get('range'); const {tickBandPaddingInner} = config.scale; - const step = - scaleRange && isVgRangeStep(scaleRange) ? scaleRange.step : getViewConfigDiscreteStep(config.view, vgSizeChannel); + const step = scaleRange && isVgRangeStep(scaleRange) ? scaleRange.step : model[vgSizeChannel]; if (isNumber(step) && isNumber(tickBandPaddingInner)) { return {value: step * (1 - tickBandPaddingInner)}; } else { - return {signal: `${exprFromSignalRefOrValue(tickBandPaddingInner)} * ${exprFromSignalRefOrValue(step)}`}; + return {signal: `(1 - ${exprFromSignalRefOrValue(tickBandPaddingInner)}) * ${exprFromSignalRefOrValue(step)}`}; } } diff --git a/test/compile/mark/tick.test.ts b/test/compile/mark/tick.test.ts index fd4aa2468c..bbc4e57761 100644 --- a/test/compile/mark/tick.test.ts +++ b/test/compile/mark/tick.test.ts @@ -206,4 +206,32 @@ describe('Mark: Tick', () => { expect(props.height).toEqual({field: 'Acceleration', scale: SIZE}); }); }); + + describe('vertical ticks without Y', () => { + const model = parseUnitModelWithScaleAndLayoutSize({ + mark: 'tick', + encoding: { + x: {field: 'Horsepower', type: 'quantitative'} + }, + data: {url: 'data/cars.json'} + }); + const props = tick.encodeEntry(model); + it('sets mark height to (1-tickBandPaddingInner) * plot_height', () => { + expect(props.height).toEqual({signal: '(1 - 0.25) * height'}); + }); + }); + + describe('horizontal ticks without X', () => { + const model = parseUnitModelWithScaleAndLayoutSize({ + mark: 'tick', + encoding: { + y: {field: 'Horsepower', type: 'quantitative'} + }, + data: {url: 'data/cars.json'} + }); + const props = tick.encodeEntry(model); + it('sets mark width to (1-tickBandPaddingInner) * plot_width', () => { + expect(props.width).toEqual({signal: '(1 - 0.25) * width'}); + }); + }); });