From 432f3548323d72505f18e30e1e23d83718d3ad20 Mon Sep 17 00:00:00 2001 From: Kanit Wongsuphasawat Date: Wed, 8 Nov 2023 09:45:41 -0800 Subject: [PATCH] fix(#9167): make 1D bars respect orient for stack calculation (#9168) * docs(example): bar_1d_dimension only * chore: update examples [CI] * fix: make 1D bar respect orientation for stack calculation (#9167) * chore: update examples [CI] --------- Co-authored-by: GitHub Actions Bot --- examples/compiled/bar_1d_dimension_only.png | Bin 0 -> 2298 bytes examples/compiled/bar_1d_dimension_only.svg | 1 + .../compiled/bar_1d_dimension_only.vg.json | 86 ++++++++++++++++++ examples/specs/bar_1d_dimension_only.vl.json | 18 ++++ src/stack.ts | 10 +- test/stack.test.ts | 24 +++++ 6 files changed, 137 insertions(+), 2 deletions(-) create mode 100644 examples/compiled/bar_1d_dimension_only.png create mode 100644 examples/compiled/bar_1d_dimension_only.svg create mode 100644 examples/compiled/bar_1d_dimension_only.vg.json create mode 100644 examples/specs/bar_1d_dimension_only.vl.json diff --git a/examples/compiled/bar_1d_dimension_only.png b/examples/compiled/bar_1d_dimension_only.png new file mode 100644 index 0000000000000000000000000000000000000000..dfe534e0c05f28c5465366820fb8634e53208f9f GIT binary patch literal 2298 zcmbtWc{J4P8~=thMaYsY;gX_@X<;lGUCUtP%9=BlrUo-Yh$+iuw77++D@!yQYRW#8 z$reLp&(4f#Vuq}f8m^fvg>k?4{?4yI`tP25-t)fC^Urh6^E{vByvfc^cDr{e?*af| zH`3n56^xeP9fF91ufldpF&M-#r|fKit-ntJttbNkAeBfPOZVtJ9y`HaK0&Qx2^T~0 zE*>{T4wbL%Lf*VWI;e!P!lopj*Hz4cU>;{*)}|w!SNmP;Iq`zZ!~(-4xe~`OR!{%X zLpC^wb~|)C`BrbFzx1qWh)w9^)xx7TT~3h4XlRYkaaf#%x>`?9-&-7~!9OA*;@*}( z&zHMR?guezI+F%oC7JB!Ma+|e zh-g5rY5;%Nd`}8w-t-cUSyY_#XwAhb?jSieH8qC`kKreRr5FsRE@7)lmfe3MMT3hs zx`Aqw|Q?T2H_cX=3HYq6yD4yCm8ICEpT<*G%6!I8(aHaX<2mmy}YH4 zo}Pb5NKfNuE;o=6KTp@KqEe6MI+pv?M~uW%!jC-bn>y5xMj=~ki=oFqs#}k@vskF) z(B=~nqp3eY_8q%_k?5G<)S#>=jI(lD5*ApA&xB>&3s%{adaqO5Z6bj`F1dIhvkbArdoyE!( z3JI#Js%vXYT9%fUdxzJ`PtU#({!#=dAAU3Rv{@~BVPQc`TzqJ7@VqTVLPASVuLnaE z%=Mop#(mXt;q64-c>QW%KnC4RKvXi1o105I!ug}`-r1wk>Iw=9hK7bR^72nwWo8u+ zcM^+E=RYV~SKPZdV&<&^NW)uaE9XA5s9#oBr+B>HG!&{KuXO#aF9c%w{~_y6b*cU!XVfgPfs~HIloBs?);IZ z^^@$J?jv)VC)GE2FKSSGB*jJ3)6-v6SLcq-fBJM(ISu4;UofDruP?S^2l2kOl~rJ9 zC~41Y!+QBm#g@izxnWrN{&{i`ue36p0|Jxq7xn&c^nFL zk8veJL`6l%Xum051szCA-NMn!OBoJ_yL))JxVsxJ_HAr#>KCqnoI_DK3d z9pMoXAdUAZC>Tuv`?DPjHVdnYWS=KbeE9JCk@c;RQ0~-}UnG03KmQ|_dxRM*tbs)$ z5ZeO+0`{fZ1_cLS3J=e@boJ3mnz1KPYgg{HH{WO4G-@Hwca_QESWtcqC8jS*{b;!V zLbTs)x;WL@%gZ4={MpyV_tn8cSHg~$W@~<4Ts&lE_CW5C6X5oHkfOCa0vHIYo}H)N z)-FZMRiK-l@OVRTu~bCq@?7tAjVM(*2;!|BVPn8O^7le4po z_>F5#O%}KFQE2=OGOP2N=nfqn9Sw8yyva$7rj{1!Ii@XjR1f`4Au1{g(ed=~8xHNa zm@OeZIXO9GtZwjeAcZ1U|0SF+y#p6N?&C)>FPYCUjf{xs?CNr97**1$?fp)S9}|f` xw+A&X2?SJOi~N+pk(IhsYH|9ld*#7V<9(|T^?>Vuyd0Euw2sjxbC{V#W}4z>UQ literal 0 HcmV?d00001 diff --git a/examples/compiled/bar_1d_dimension_only.svg b/examples/compiled/bar_1d_dimension_only.svg new file mode 100644 index 0000000000..ca11f9d2e1 --- /dev/null +++ b/examples/compiled/bar_1d_dimension_only.svg @@ -0,0 +1 @@ +05101520b \ No newline at end of file diff --git a/examples/compiled/bar_1d_dimension_only.vg.json b/examples/compiled/bar_1d_dimension_only.vg.json new file mode 100644 index 0000000000..c438e6594a --- /dev/null +++ b/examples/compiled/bar_1d_dimension_only.vg.json @@ -0,0 +1,86 @@ +{ + "$schema": "https://vega.github.io/schema/vega/v5.json", + "description": "A simple bar chart with embedded data.", + "background": "white", + "padding": 5, + "width": 20, + "height": 200, + "style": "cell", + "data": [ + { + "name": "source_0", + "values": [ + {"b": 0}, + {"b": 10}, + {"b": 10}, + {"b": 10}, + {"b": 10}, + {"b": 20} + ] + }, + { + "name": "data_0", + "source": "source_0", + "transform": [ + { + "type": "filter", + "expr": "isValid(datum[\"b\"]) && isFinite(+datum[\"b\"])" + } + ] + } + ], + "marks": [ + { + "name": "marks", + "type": "rect", + "style": ["bar"], + "from": {"data": "data_0"}, + "encode": { + "update": { + "fill": {"value": "#4c78a8"}, + "ariaRoleDescription": {"value": "bar"}, + "description": {"signal": "\"b: \" + (format(datum[\"b\"], \"\"))"}, + "x": {"field": {"group": "width"}}, + "x2": {"value": 0}, + "yc": {"scale": "y", "field": "b"}, + "height": {"value": 5} + } + } + } + ], + "scales": [ + { + "name": "y", + "type": "linear", + "domain": {"data": "data_0", "field": "b"}, + "range": [{"signal": "height"}, 0], + "nice": true, + "zero": false, + "padding": 5 + } + ], + "axes": [ + { + "scale": "y", + "orient": "left", + "grid": true, + "tickCount": {"signal": "ceil(height/40)"}, + "domain": false, + "labels": false, + "aria": false, + "maxExtent": 0, + "minExtent": 0, + "ticks": false, + "zindex": 0 + }, + { + "scale": "y", + "orient": "left", + "grid": false, + "title": "b", + "labelOverlap": true, + "tickCount": {"signal": "ceil(height/40)"}, + "zindex": 0 + } + ] +} diff --git a/examples/specs/bar_1d_dimension_only.vl.json b/examples/specs/bar_1d_dimension_only.vl.json new file mode 100644 index 0000000000..b174acb053 --- /dev/null +++ b/examples/specs/bar_1d_dimension_only.vl.json @@ -0,0 +1,18 @@ +{ + "$schema": "https://vega.github.io/schema/vega-lite/v5.json", + "description": "A simple bar chart with embedded data.", + "data": { + "values": [ + {"b": 0}, + {"b": 10}, + {"b": 10}, + {"b": 10}, + {"b": 10}, + {"b": 20} + ] + }, + "mark": {"type": "bar", "orient": "horizontal"}, + "encoding": { + "y": {"field": "b", "type": "quantitative"} + } +} diff --git a/src/stack.ts b/src/stack.ts index 00e7bb3b38..98a115d97a 100644 --- a/src/stack.ts +++ b/src/stack.ts @@ -87,7 +87,7 @@ function potentialStackedChannel( ): 'x' | 'y' | 'theta' | 'radius' | undefined { const y = x === 'x' ? 'y' : 'radius'; - const isCartesian = x === 'x'; + const isCartesianBarOrArea = x === 'x' && ['bar', 'area'].includes(mark); const xDef = encoding[x]; const yDef = encoding[y]; @@ -106,7 +106,7 @@ function potentialStackedChannel( return xAggregate ? x : y; } - if (isCartesian && ['bar', 'area'].includes(mark)) { + if (isCartesianBarOrArea) { if (orient === 'vertical') { return y; } else if (orient === 'horizontal') { @@ -119,8 +119,14 @@ function potentialStackedChannel( return y; } } else if (isUnbinnedQuantitative(xDef)) { + if (isCartesianBarOrArea && orient === 'vertical') { + return undefined; + } return x; } else if (isUnbinnedQuantitative(yDef)) { + if (isCartesianBarOrArea && orient === 'horizontal') { + return undefined; + } return y; } return undefined; diff --git a/test/stack.test.ts b/test/stack.test.ts index d215d92250..9a28b5c9de 100644 --- a/test/stack.test.ts +++ b/test/stack.test.ts @@ -56,6 +56,30 @@ describe('stack', () => { } }); + it("doesn't stacked the dimension field on a 1D vertical bar with dimension only", () => { + const spec: TopLevel = { + data: {url: 'data/barley.json'}, + mark: {type: 'bar', orient: 'vertical'}, + encoding: { + x: {field: 'yield', type: 'quantitative'} + } + }; + const stackProps = stack(spec.mark, spec.encoding); + expect(stackProps).toBeNull(); + }); + + it("doesn't stacked the dimension field on a 1D horizontal bar with dimension only", () => { + const spec: TopLevel = { + data: {url: 'data/barley.json'}, + mark: {type: 'bar', orient: 'horizontal'}, + encoding: { + y: {field: 'yield', type: 'quantitative'} + } + }; + const stackProps = stack(spec.mark, spec.encoding); + expect(stackProps).toBeNull(); + }); + it('should be disabled when stack is false', () => { for (const mark of STACKABLE_NON_POLAR_MARKS) { const spec: TopLevel = {