feat(legend): optimize (#5202)

antvis · Jun 17, 2023 · fbebfc5 · fbebfc5
1 parent 952f151
commit fbebfc5
Show file tree

Hide file tree

Showing 281 changed files with 1,147 additions and 182 deletions.
diff --git a/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-0.png b/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-0.png
diff --git a/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-1.png b/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-1.png
diff --git a/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-2.png b/__tests__/integration/snapshots/animation/deaths-rose-stack-enter/interval0-2.png
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-0.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-0.png
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-1.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-1.png
diff --git a/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-2.png b/...integration/snapshots/animation/doughnut-purchases-line-path-in/interval0-2.png
diff --git a/__tests__/integration/snapshots/animation/events-interval-encode/interval0-0.png b/__tests__/integration/snapshots/animation/events-interval-encode/interval0-0.png
diff --git a/__tests__/integration/snapshots/animation/events-interval-encode/interval0-1.png b/__tests__/integration/snapshots/animation/events-interval-encode/interval0-1.png
diff --git a/__tests__/integration/snapshots/animation/events-interval-encode/interval0-2.png b/__tests__/integration/snapshots/animation/events-interval-encode/interval0-2.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-0.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-0.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-1.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-1.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-2.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-2.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-3.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-3.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-4.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-4.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-5.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-5.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-6.png b/...gration/snapshots/animation/fruits-interval-stack-enter-color-x/interval0-6.png
diff --git a/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-0.png b/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-0.png
diff --git a/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-1.png b/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-1.png
diff --git a/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-2.png b/...tegration/snapshots/animation/fruits-interval-stack-enter-color/interval0-2.png
diff --git a/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-0.png b/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-0.png
diff --git a/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-1.png b/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-1.png
diff --git a/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-2.png b/...ration/snapshots/animation/fruits-interval-stack-enter-defaults/interval0-2.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-0.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-0.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-1.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-1.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-2.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-2.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-3.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-3.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-4.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-4.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-5.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-5.png
diff --git a/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-6.png b/...gration/snapshots/animation/fruits-interval-stack-enter-x-color/interval0-6.png
diff --git a/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-0.png b/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-0.png
diff --git a/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-1.png b/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-1.png
diff --git a/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-2.png b/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-2.png
diff --git a/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-3.png b/...ts__/integration/snapshots/animation/iris-point-shapes-keyframe/interval2-3.png
diff --git a/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-0.png b/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-0.png
diff --git a/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-1.png b/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-1.png
diff --git a/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-2.png b/__tests__/integration/snapshots/animation/os-area-stack-enter/interval0-2.png
diff --git a/...s__/integration/snapshots/animation/people-interval-split-merge/interval1-0.png b/...s__/integration/snapshots/animation/people-interval-split-merge/interval1-0.png
diff --git a/...s__/integration/snapshots/animation/people-interval-split-merge/interval1-1.png b/...s__/integration/snapshots/animation/people-interval-split-merge/interval1-1.png
diff --git a/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-0.png b/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-0.png
diff --git a/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-1.png b/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-1.png
diff --git a/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-2.png b/...s__/integration/snapshots/animation/people-interval-split-merge/interval2-2.png
diff --git a/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-0.png b/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-0.png
diff --git a/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-1.png b/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-1.png
diff --git a/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-2.png b/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-2.png
diff --git a/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-3.png b/__tests__/integration/snapshots/animation/polio-point-stack-enter/interval0-3.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval1-0.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval1-0.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval1-1.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval1-1.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-0.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval2-1.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-0.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-1.png
diff --git a/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png b/...ts__/integration/snapshots/animation/sold-interval-pie-keyframe/interval3-2.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval1-0.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval1-0.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval1-1.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval1-1.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval2-0.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval2-0.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval2-1.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval2-1.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval3-0.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval3-0.png
diff --git a/__tests__/integration/snapshots/animation/stocks-keyframe/interval3-1.png b/__tests__/integration/snapshots/animation/stocks-keyframe/interval3-1.png
diff --git a/__tests__/integration/snapshots/api/chart-auto-fit/step0.png b/__tests__/integration/snapshots/api/chart-auto-fit/step0.png
diff --git a/__tests__/integration/snapshots/api/chart-auto-fit/step1.png b/__tests__/integration/snapshots/api/chart-auto-fit/step1.png
diff --git a/...sts__/integration/snapshots/api/chart-emit-brush-highlight-axis-cross/step0.png b/...sts__/integration/snapshots/api/chart-emit-brush-highlight-axis-cross/step0.png
diff --git a/...sts__/integration/snapshots/api/chart-emit-brush-highlight-axis-cross/step1.png b/...sts__/integration/snapshots/api/chart-emit-brush-highlight-axis-cross/step1.png
diff --git a/.../integration/snapshots/api/chart-emit-brush-highlight-axis-horizontal/step0.png b/.../integration/snapshots/api/chart-emit-brush-highlight-axis-horizontal/step0.png
diff --git a/.../integration/snapshots/api/chart-emit-brush-highlight-axis-horizontal/step1.png b/.../integration/snapshots/api/chart-emit-brush-highlight-axis-horizontal/step1.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-element-highlight/step0.png b/__tests__/integration/snapshots/api/chart-emit-element-highlight/step0.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-element-highlight/step1.png b/__tests__/integration/snapshots/api/chart-emit-element-highlight/step1.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-element-select-single/step0.png b/__tests__/integration/snapshots/api/chart-emit-element-select-single/step0.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-element-select/step0.png b/__tests__/integration/snapshots/api/chart-emit-element-select/step0.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-element-select/step1.png b/__tests__/integration/snapshots/api/chart-emit-element-select/step1.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-legend-filter/step0.png b/__tests__/integration/snapshots/api/chart-emit-legend-filter/step0.png
diff --git a/__tests__/integration/snapshots/api/chart-emit-legend-filter/step1.png b/__tests__/integration/snapshots/api/chart-emit-legend-filter/step1.png
diff --git a/__tests__/integration/snapshots/api/chartChangeSize.png b/__tests__/integration/snapshots/api/chartChangeSize.png
diff --git a/__tests__/integration/snapshots/api/chartChangeSizePolar.png b/__tests__/integration/snapshots/api/chartChangeSizePolar.png
diff --git a/__tests__/integration/snapshots/api/chartHOMMark.png b/__tests__/integration/snapshots/api/chartHOMMark.png
diff --git a/__tests__/integration/snapshots/api/chartOptionsChangeData.png b/__tests__/integration/snapshots/api/chartOptionsChangeData.png
diff --git a/__tests__/integration/snapshots/api/chartOptionsCompositeMark.png b/__tests__/integration/snapshots/api/chartOptionsCompositeMark.png
diff --git a/__tests__/integration/snapshots/api/chartRender.png b/__tests__/integration/snapshots/api/chartRender.png
diff --git a/__tests__/integration/snapshots/api/markChangeData.png b/__tests__/integration/snapshots/api/markChangeData.png
diff --git a/__tests__/integration/snapshots/api/registerDataTransform.png b/__tests__/integration/snapshots/api/registerDataTransform.png
diff --git a/__tests__/integration/snapshots/api/registerShape.png b/__tests__/integration/snapshots/api/registerShape.png
diff --git a/__tests__/integration/snapshots/api/viewFacetCircle.png b/__tests__/integration/snapshots/api/viewFacetCircle.png
diff --git a/...egration/snapshots/interaction/alphabet-interval-funnel-legend-filter/step0.png b/...egration/snapshots/interaction/alphabet-interval-funnel-legend-filter/step0.png
diff --git a/...egration/snapshots/interaction/alphabet-interval-funnel-legend-filter/step1.png b/...egration/snapshots/interaction/alphabet-interval-funnel-legend-filter/step1.png
diff --git a/...tegration/snapshots/interaction/indices-line-chart-facet-brush-shared/step0.png b/...tegration/snapshots/interaction/indices-line-chart-facet-brush-shared/step0.png
diff --git a/__tests__/integration/snapshots/interaction/indices-line-chart-facet/step0.png b/__tests__/integration/snapshots/interaction/indices-line-chart-facet/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-axis/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-axis/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-axis/step1.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-axis/step1.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step1.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step1.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step2.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-filter/step2.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step0.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step0.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step1.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step1.png
diff --git a/...integration/snapshots/interaction/penguins-point-brush-handle-custom/step10.png b/...integration/snapshots/interaction/penguins-point-brush-handle-custom/step10.png
diff --git a/...integration/snapshots/interaction/penguins-point-brush-handle-custom/step11.png b/...integration/snapshots/interaction/penguins-point-brush-handle-custom/step11.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step2.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step2.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step3.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step3.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step4.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step4.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step5.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step5.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step6.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step6.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step7.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step7.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step8.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step8.png
diff --git a/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step9.png b/.../integration/snapshots/interaction/penguins-point-brush-handle-custom/step9.png
diff --git a/..._/integration/snapshots/interaction/penguins-point-brush-handle-style/step0.png b/..._/integration/snapshots/interaction/penguins-point-brush-handle-style/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-matrix/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-matrix/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-matrix/step1.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-matrix/step1.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-reverse/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-reverse/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-reverse/step1.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-reverse/step1.png
diff --git a/...sts__/integration/snapshots/interaction/penguins-point-brush-x-filter/step0.png b/...sts__/integration/snapshots/interaction/penguins-point-brush-x-filter/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-x/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-x/step0.png
diff --git a/...sts__/integration/snapshots/interaction/penguins-point-brush-y-filter/step0.png b/...sts__/integration/snapshots/interaction/penguins-point-brush-y-filter/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush-y/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush-y/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step0.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step1.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step1.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step10.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step10.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step11.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step11.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step2.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step2.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step3.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step3.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step4.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step4.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step5.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step5.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step6.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step6.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step7.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step7.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step8.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step8.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-brush/step9.png b/__tests__/integration/snapshots/interaction/penguins-point-brush/step9.png
diff --git a/__tests__/integration/snapshots/interaction/penguins-point-highlight/step0.png b/__tests__/integration/snapshots/interaction/penguins-point-highlight/step0.png
diff --git a/...sts__/integration/snapshots/interaction/population-interval-diverging/step0.png b/...sts__/integration/snapshots/interaction/population-interval-diverging/step0.png
diff --git a/__tests__/integration/snapshots/interaction/score-by-item-area-radar/step0.png b/__tests__/integration/snapshots/interaction/score-by-item-area-radar/step0.png
diff --git a/...__/integration/snapshots/interaction/settle-weather-cell-brush-filter/step0.png b/...__/integration/snapshots/interaction/settle-weather-cell-brush-filter/step0.png
diff --git a/...__/integration/snapshots/interaction/settle-weather-cell-brush-filter/step1.png b/...__/integration/snapshots/interaction/settle-weather-cell-brush-filter/step1.png
diff --git a/.../snapshots/interaction/state-ages-interval-highlight-color-background/step0.png b/.../snapshots/interaction/state-ages-interval-highlight-color-background/step0.png
diff --git a/.../snapshots/interaction/state-ages-interval-highlight-group-background/step0.png b/.../snapshots/interaction/state-ages-interval-highlight-group-background/step0.png
diff --git a/.../snapshots/interaction/state-ages-interval-highlight-group-background/step2.png b/.../snapshots/interaction/state-ages-interval-highlight-group-background/step2.png
diff --git a/...ts__/integration/snapshots/interaction/state-ages-interval-normalized/step0.png b/...ts__/integration/snapshots/interaction/state-ages-interval-normalized/step0.png
diff --git a/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step0.png b/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step0.png
diff --git a/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step1.png b/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step1.png
diff --git a/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step2.png b/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step2.png
diff --git a/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step3.png b/...gration/snapshots/interaction/temperatures-line-legend-filter-ordinal/step3.png
diff --git a/__tests__/integration/snapshots/interaction/unemployment-choropleth/step0.png b/__tests__/integration/snapshots/interaction/unemployment-choropleth/step0.png
diff --git a/__tests__/integration/snapshots/static/agesIntervalRadialStacked.png b/__tests__/integration/snapshots/static/agesIntervalRadialStacked.png
diff --git a/__tests__/integration/snapshots/static/agesIntervalRadialStackedSorted.png b/__tests__/integration/snapshots/static/agesIntervalRadialStackedSorted.png
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalAutoPaddingMaxRatio.png b/__tests__/integration/snapshots/static/alphabetIntervalAutoPaddingMaxRatio.png
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalFunnel.png b/__tests__/integration/snapshots/static/alphabetIntervalFunnel.png
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalLabelContrastReverse.png b/__tests__/integration/snapshots/static/alphabetIntervalLabelContrastReverse.png
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalPyramid.png b/__tests__/integration/snapshots/static/alphabetIntervalPyramid.png
diff --git a/__tests__/integration/snapshots/static/alphabetIntervalSpaceLayer.png b/__tests__/integration/snapshots/static/alphabetIntervalSpaceLayer.png
diff --git a/__tests__/integration/snapshots/static/athletesRectBin.png b/__tests__/integration/snapshots/static/athletesRectBin.png
diff --git a/__tests__/integration/snapshots/static/athletesRectBinLegendStyle.png b/__tests__/integration/snapshots/static/athletesRectBinLegendStyle.png
diff --git a/__tests__/integration/snapshots/static/athletesRectBinX.png b/__tests__/integration/snapshots/static/athletesRectBinX.png
diff --git a/__tests__/integration/snapshots/static/barleyLineTrail.png b/__tests__/integration/snapshots/static/barleyLineTrail.png
diff --git a/__tests__/integration/snapshots/static/barleyPointFacetRectCol.png b/__tests__/integration/snapshots/static/barleyPointFacetRectCol.png
diff --git a/__tests__/integration/snapshots/static/basicIntervalZeroDomainMin.png b/__tests__/integration/snapshots/static/basicIntervalZeroDomainMin.png
diff --git a/__tests__/integration/snapshots/static/bodyPointScatterPlot.png b/__tests__/integration/snapshots/static/bodyPointScatterPlot.png
diff --git a/__tests__/integration/snapshots/static/bodyPointScatterPlotOpacity.png b/__tests__/integration/snapshots/static/bodyPointScatterPlotOpacity.png
diff --git a/__tests__/integration/snapshots/static/bodyPointScatterPlotSizeOpacity.png b/__tests__/integration/snapshots/static/bodyPointScatterPlotSizeOpacity.png
diff --git a/__tests__/integration/snapshots/static/cars2PointJitterY.png b/__tests__/integration/snapshots/static/cars2PointJitterY.png
diff --git a/__tests__/integration/snapshots/static/cars3LineParallelHorizontal.png b/__tests__/integration/snapshots/static/cars3LineParallelHorizontal.png
diff --git a/__tests__/integration/snapshots/static/cars3LineParallelVertical.png b/__tests__/integration/snapshots/static/cars3LineParallelVertical.png
diff --git a/__tests__/integration/snapshots/static/cars3LineRadar.png b/__tests__/integration/snapshots/static/cars3LineRadar.png
diff --git a/__tests__/integration/snapshots/static/commitIntervalFixedCorner.png b/__tests__/integration/snapshots/static/commitIntervalFixedCorner.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGrouped.png b/__tests__/integration/snapshots/static/commitsPointGrouped.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedConstant.png b/__tests__/integration/snapshots/static/commitsPointGroupedConstant.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendFlexCenter.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendFlexCenter.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendFlexRight.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendFlexRight.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendIndependent.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendIndependent.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionBottom.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionBottom.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionLeft.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionLeft.png
diff --git a/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionRight.png b/__tests__/integration/snapshots/static/commitsPointGroupedLegendPositionRight.png
diff --git a/..._/integration/snapshots/static/commitsPointGroupedLegendPositionRightLength.png b/..._/integration/snapshots/static/commitsPointGroupedLegendPositionRightLength.png
diff --git a/__tests__/integration/snapshots/static/disastersPointBubble.png b/__tests__/integration/snapshots/static/disastersPointBubble.png
diff --git a/__tests__/integration/snapshots/static/disastersPointBubbleLegendRight.png b/__tests__/integration/snapshots/static/disastersPointBubbleLegendRight.png
diff --git a/__tests__/integration/snapshots/static/fuelLineEncodePropagate.png b/__tests__/integration/snapshots/static/fuelLineEncodePropagate.png
diff --git a/__tests__/integration/snapshots/static/fuelLineTransformPropagate.png b/__tests__/integration/snapshots/static/fuelLineTransformPropagate.png
diff --git a/__tests__/integration/snapshots/static/haleChoroplethWorld.png b/__tests__/integration/snapshots/static/haleChoroplethWorld.png
diff --git a/__tests__/integration/snapshots/static/housePricePointShapes.png b/__tests__/integration/snapshots/static/housePricePointShapes.png
diff --git a/__tests__/integration/snapshots/static/indicesLineChartScaleRelations.png b/__tests__/integration/snapshots/static/indicesLineChartScaleRelations.png
diff --git a/...integration/snapshots/static/indicesLineChartScaleRelationsAutoPaddingRound.png b/...integration/snapshots/static/indicesLineChartScaleRelationsAutoPaddingRound.png
diff --git a/__tests__/integration/snapshots/static/irisPointShapes.png b/__tests__/integration/snapshots/static/irisPointShapes.png
diff --git a/__tests__/integration/snapshots/static/irisPointShapesDefaults.png b/__tests__/integration/snapshots/static/irisPointShapesDefaults.png
diff --git a/__tests__/integration/snapshots/static/marketIntervalMarimekko.png b/__tests__/integration/snapshots/static/marketIntervalMarimekko.png
diff --git a/__tests__/integration/snapshots/static/marketIntervalMarimekkoAutoPaddingFlex.png b/__tests__/integration/snapshots/static/marketIntervalMarimekkoAutoPaddingFlex.png
diff --git a/__tests__/integration/snapshots/static/mockAxisY.png b/__tests__/integration/snapshots/static/mockAxisY.png
diff --git a/__tests__/integration/snapshots/static/monthIntervalFacetCircle.png b/__tests__/integration/snapshots/static/monthIntervalFacetCircle.png
diff --git a/__tests__/integration/snapshots/static/monthIntervalFacetRect.png b/__tests__/integration/snapshots/static/monthIntervalFacetRect.png
diff --git a/__tests__/integration/snapshots/static/monthIntervalRadialFacetRect.png b/__tests__/integration/snapshots/static/monthIntervalRadialFacetRect.png
diff --git a/__tests__/integration/snapshots/static/moviesPointBin.png b/__tests__/integration/snapshots/static/moviesPointBin.png
diff --git a/__tests__/integration/snapshots/static/moviesRectBin.png b/__tests__/integration/snapshots/static/moviesRectBin.png
diff --git a/__tests__/integration/snapshots/static/moviesRectBinOpacity.png b/__tests__/integration/snapshots/static/moviesRectBinOpacity.png
diff --git a/__tests__/integration/snapshots/static/ordersLineMissingField.png b/__tests__/integration/snapshots/static/ordersLineMissingField.png
diff --git a/...s__/integration/snapshots/static/ordersLineMissingFieldAutoPaddingUndefined.png b/...s__/integration/snapshots/static/ordersLineMissingFieldAutoPaddingUndefined.png
diff --git a/__tests__/integration/snapshots/static/penguinsBoxPlotGrouped.png b/__tests__/integration/snapshots/static/penguinsBoxPlotGrouped.png
diff --git a/__tests__/integration/snapshots/static/penguinsBoxPlotGroupedTranspose.png b/__tests__/integration/snapshots/static/penguinsBoxPlotGroupedTranspose.png
diff --git a/__tests__/integration/snapshots/static/penguinsIntervalGroupColor.png b/__tests__/integration/snapshots/static/penguinsIntervalGroupColor.png
diff --git a/__tests__/integration/snapshots/static/penguinsIntervalTransposeGroupColor.png b/__tests__/integration/snapshots/static/penguinsIntervalTransposeGroupColor.png
diff --git a/__tests__/integration/snapshots/static/penguinsPointFacetRect.png b/__tests__/integration/snapshots/static/penguinsPointFacetRect.png
diff --git a/__tests__/integration/snapshots/static/peopleIntervalAreaDualAxis.png b/__tests__/integration/snapshots/static/peopleIntervalAreaDualAxis.png
diff --git a/__tests__/integration/snapshots/static/peoplePointStacked.png b/__tests__/integration/snapshots/static/peoplePointStacked.png
diff --git a/...sts__/integration/snapshots/static/peoplePointStackedAutoPaddingNumberLabel.png b/...sts__/integration/snapshots/static/peoplePointStackedAutoPaddingNumberLabel.png
diff --git a/__tests__/integration/snapshots/static/philosophyWordCloudCustom.png b/__tests__/integration/snapshots/static/philosophyWordCloudCustom.png
diff --git a/__tests__/integration/snapshots/static/populationByStateAreaNormalizeStacked.png b/__tests__/integration/snapshots/static/populationByStateAreaNormalizeStacked.png
diff --git a/__tests__/integration/snapshots/static/populationIntervalDiverging.png b/__tests__/integration/snapshots/static/populationIntervalDiverging.png
diff --git a/...ation/snapshots/static/populationIntervalDivergingAutoPaddingUndefinedTitle.png b/...ation/snapshots/static/populationIntervalDivergingAutoPaddingUndefinedTitle.png
diff --git a/__tests__/integration/snapshots/static/populationIntervalLayered.png b/__tests__/integration/snapshots/static/populationIntervalLayered.png
diff --git a/__tests__/integration/snapshots/static/populationIntervalNormalizedStacked.png b/__tests__/integration/snapshots/static/populationIntervalNormalizedStacked.png
diff --git a/__tests__/integration/snapshots/static/productIntervalStackedGrouped.png b/__tests__/integration/snapshots/static/productIntervalStackedGrouped.png
diff --git a/__tests__/integration/snapshots/static/question8IntervalRadialGradientColor.png b/__tests__/integration/snapshots/static/question8IntervalRadialGradientColor.png
diff --git a/__tests__/integration/snapshots/static/questionsIntervalDivergingStacked.png b/__tests__/integration/snapshots/static/questionsIntervalDivergingStacked.png
diff --git a/__tests__/integration/snapshots/static/salaryHeatmapScaleLinear.png b/__tests__/integration/snapshots/static/salaryHeatmapScaleLinear.png
diff --git a/__tests__/integration/snapshots/static/salaryHeatmapScaleQuantile.png b/__tests__/integration/snapshots/static/salaryHeatmapScaleQuantile.png
diff --git a/__tests__/integration/snapshots/static/salaryHeatmapScaleQuantize.png b/__tests__/integration/snapshots/static/salaryHeatmapScaleQuantize.png
diff --git a/__tests__/integration/snapshots/static/salaryHeatmapScaleThreshold.png b/__tests__/integration/snapshots/static/salaryHeatmapScaleThreshold.png
diff --git a/__tests__/integration/snapshots/static/scoreByItemAreaRadar.png b/__tests__/integration/snapshots/static/scoreByItemAreaRadar.png
diff --git a/__tests__/integration/snapshots/static/scoreByItemAreaRadarCustom.png b/__tests__/integration/snapshots/static/scoreByItemAreaRadarCustom.png
diff --git a/__tests__/integration/snapshots/static/scoreByItemAreaRadarSize.png b/__tests__/integration/snapshots/static/scoreByItemAreaRadarSize.png
diff --git a/__tests__/integration/snapshots/static/scoreByItemAreaSmoothRadar.png b/__tests__/integration/snapshots/static/scoreByItemAreaSmoothRadar.png
diff --git a/__tests__/integration/snapshots/static/seattleWeatherIntervalAggregated.png b/__tests__/integration/snapshots/static/seattleWeatherIntervalAggregated.png
diff --git a/__tests__/integration/snapshots/static/sepalBoxSimpleBox.png b/__tests__/integration/snapshots/static/sepalBoxSimpleBox.png
diff --git a/__tests__/integration/snapshots/static/settleWeatherCellGrouped.png b/__tests__/integration/snapshots/static/settleWeatherCellGrouped.png
diff --git a/__tests__/integration/snapshots/static/soldHOMMultiple.png b/__tests__/integration/snapshots/static/soldHOMMultiple.png
diff --git a/__tests__/integration/snapshots/static/soldIntervalCustomShape.png b/__tests__/integration/snapshots/static/soldIntervalCustomShape.png
diff --git a/__tests__/integration/snapshots/static/speciesDensityBasic.png b/__tests__/integration/snapshots/static/speciesDensityBasic.png
diff --git a/__tests__/integration/snapshots/static/speciesViolinBasic.png b/__tests__/integration/snapshots/static/speciesViolinBasic.png
diff --git a/__tests__/integration/snapshots/static/speciesViolinBasicPolar.png b/__tests__/integration/snapshots/static/speciesViolinBasicPolar.png
diff --git a/__tests__/integration/snapshots/static/stateAgesIntervalGrouped.png b/__tests__/integration/snapshots/static/stateAgesIntervalGrouped.png
diff --git a/__tests__/integration/snapshots/static/stateAgesIntervalStacked.png b/__tests__/integration/snapshots/static/stateAgesIntervalStacked.png
diff --git a/__tests__/integration/snapshots/static/stateAgesIntervalStackedCornered.png b/__tests__/integration/snapshots/static/stateAgesIntervalStackedCornered.png
diff --git a/__tests__/integration/snapshots/static/stateAgesIntervalStackedCorneredAll.png b/__tests__/integration/snapshots/static/stateAgesIntervalStackedCorneredAll.png
diff --git a/__tests__/integration/snapshots/static/stateAgesPointDotPlot.png b/__tests__/integration/snapshots/static/stateAgesPointDotPlot.png
diff --git a/__tests__/integration/snapshots/static/stocksLineAggregateLabel.png b/__tests__/integration/snapshots/static/stocksLineAggregateLabel.png
diff --git a/__tests__/integration/snapshots/static/stocksLineVarSize.png b/__tests__/integration/snapshots/static/stocksLineVarSize.png
diff --git a/__tests__/integration/snapshots/static/temperature1LineVarColor.png b/__tests__/integration/snapshots/static/temperature1LineVarColor.png
diff --git a/__tests__/integration/snapshots/static/titanic2PointPack.png b/__tests__/integration/snapshots/static/titanic2PointPack.png
diff --git a/__tests__/integration/snapshots/static/titanicPointPack.png b/__tests__/integration/snapshots/static/titanicPointPack.png
diff --git a/__tests__/integration/snapshots/static/titanicPointPackNested.png b/__tests__/integration/snapshots/static/titanicPointPackNested.png
diff --git a/__tests__/integration/snapshots/static/titanicPointPackSharedData.png b/__tests__/integration/snapshots/static/titanicPointPackSharedData.png
diff --git a/__tests__/integration/snapshots/static/titanicPointPackSharedSize.png b/__tests__/integration/snapshots/static/titanicPointPackSharedSize.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaNormalizedStacked.png b/__tests__/integration/snapshots/static/unemploymentAreaNormalizedStacked.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaStacked.png b/__tests__/integration/snapshots/static/unemploymentAreaStacked.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaStackedCols.png b/__tests__/integration/snapshots/static/unemploymentAreaStackedCols.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaStackedDataDrivenStyled.png b/__tests__/integration/snapshots/static/unemploymentAreaStackedDataDrivenStyled.png
diff --git a/...s__/integration/snapshots/static/unemploymentAreaStackedLegendSmallVertical.png b/...s__/integration/snapshots/static/unemploymentAreaStackedLegendSmallVertical.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaStackedLegendVertical.png b/__tests__/integration/snapshots/static/unemploymentAreaStackedLegendVertical.png
diff --git a/__tests__/integration/snapshots/static/unemploymentAreaStreamgraph.png b/__tests__/integration/snapshots/static/unemploymentAreaStreamgraph.png
diff --git a/__tests__/integration/snapshots/static/unemploymentChoropleth.png b/__tests__/integration/snapshots/static/unemploymentChoropleth.png
diff --git a/__tests__/integration/snapshots/static/vaccinesCellScaleRelation.png b/__tests__/integration/snapshots/static/vaccinesCellScaleRelation.png
diff --git a/...integration/snapshots/static/vaccinesCellScaleRelationAutoPaddingTickFilter.png b/...integration/snapshots/static/vaccinesCellScaleRelationAutoPaddingTickFilter.png
diff --git a/__tests__/integration/snapshots/static/vennBasic.png b/__tests__/integration/snapshots/static/vennBasic.png
diff --git a/__tests__/integration/snapshots/static/vennHollow.png b/__tests__/integration/snapshots/static/vennHollow.png
diff --git a/__tests__/integration/snapshots/static/weatherLineMultiSlider.png b/__tests__/integration/snapshots/static/weatherLineMultiSlider.png
diff --git a/__tests__/integration/snapshots/static/weatherLineRepeatMatrixCol.png b/__tests__/integration/snapshots/static/weatherLineRepeatMatrixCol.png
diff --git a/__tests__/integration/snapshots/static/worldHistoryIntervalMultiTickCount.png b/__tests__/integration/snapshots/static/worldHistoryIntervalMultiTickCount.png
diff --git a/__tests__/plots/static/athletes-rect-bin-legend-style.ts b/__tests__/plots/static/athletes-rect-bin-legend-style.ts
@@ -3,6 +3,7 @@ import { G2Spec } from '../../../src';
 export function athletesRectBinLegendStyle(): G2Spec {
   return {
     type: 'rect',
+    padding: 'auto',
     data: {
       type: 'fetch',
       value: 'data/athletes.csv',

diff --git a/__tests__/plots/static/body-point-scatter-plot-size-opacity.ts b/__tests__/plots/static/body-point-scatter-plot-size-opacity.ts
@@ -3,6 +3,7 @@ import { G2Spec } from '../../../src';
 export function bodyPointScatterPlotSizeOpacity(): G2Spec {
   return {
     type: 'point',
+    padding: 'auto',
     data: {
       type: 'fetch',
       value: 'data/body.json',

diff --git a/__tests__/plots/static/body-point-scatter-plot.ts b/__tests__/plots/static/body-point-scatter-plot.ts
@@ -3,6 +3,7 @@ import { G2Spec } from '../../../src';
 export function bodyPointScatterPlot(): G2Spec {
   return {
     type: 'point',
+    padding: 'auto',
     data: {
       type: 'fetch',
       value: 'data/body.json',

diff --git a/__tests__/plots/static/commits-point-grouped-legend-flex-center.ts b/__tests__/plots/static/commits-point-grouped-legend-flex-center.ts
@@ -0,0 +1,41 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendFlexCenter(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { layout: { justifyContent: 'center' } },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-flex-right.ts b/__tests__/plots/static/commits-point-grouped-legend-flex-right.ts
@@ -0,0 +1,41 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendFlexRight(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { layout: { justifyContent: 'flex-end' } },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-independent.ts b/__tests__/plots/static/commits-point-grouped-legend-independent.ts
@@ -0,0 +1,39 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendIndependent(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: { color: { group: 'independent' } },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-position-bottom.ts b/__tests__/plots/static/commits-point-grouped-legend-position-bottom.ts
@@ -0,0 +1,42 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendPositionBottom(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { position: 'bottom', group: 'independent' },
+      size: { position: 'bottom' },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-position-left.ts b/__tests__/plots/static/commits-point-grouped-legend-position-left.ts
@@ -0,0 +1,42 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendPositionLeft(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { position: 'left' },
+      size: { position: 'left' },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-position-right-length.ts b/__tests__/plots/static/commits-point-grouped-legend-position-right-length.ts
@@ -0,0 +1,42 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendPositionRightLength(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { position: 'right', length: 100 },
+      size: { position: 'right', length: 100 },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped-legend-position-right.ts b/__tests__/plots/static/commits-point-grouped-legend-position-right.ts
@@ -0,0 +1,42 @@
+import { G2Spec } from '../../../src';
+
+export function commitsPointGroupedLegendPositionRight(): G2Spec {
+  return {
+    type: 'point',
+    height: 300,
+    inset: 10,
+    padding: 'auto',
+    frame: true,
+    data: {
+      type: 'fetch',
+      value: 'data/commits.csv',
+    },
+    encode: {
+      x: (d) => d.time.getUTCHours(),
+      y: (d) => d.time.getUTCDay(),
+      size: 'count',
+      shape: 'point',
+      color: 'count',
+    },
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    legend: {
+      color: { position: 'right' },
+      size: { position: 'right' },
+    },
+    viewStyle: {
+      viewFill: '#4e79a7',
+      plotFill: '#f28e2c',
+      mainFill: '#e15759',
+      contentFill: '#76b7b2',
+    },
+  };
+}
diff --git a/__tests__/plots/static/commits-point-grouped.ts b/__tests__/plots/static/commits-point-grouped.ts
@@ -5,30 +5,34 @@ export function commitsPointGrouped(): G2Spec {
     type: 'point',
     height: 300,
     inset: 10,
+    padding: 'auto',
+    frame: true,
     data: {
       type: 'fetch',
       value: 'data/commits.csv',
     },
-    axis: {
-      x: { title: 'time (hours)' },
-      y: { title: 'time (day)', grid: true },
-    },
-    legend: { size: false },
-    scale: {
-      y: { type: 'point' },
-      x: { tickCount: 24 },
-      color: {
-        palette: 'rdBu',
-      },
-    },
-    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
     encode: {
       x: (d) => d.time.getUTCHours(),
       y: (d) => d.time.getUTCDay(),
       size: 'count',
       shape: 'point',
       color: 'count',
     },
-    frame: true,
+    transform: [{ type: 'group', size: 'sum' }, { type: 'sortY' }],
+    scale: {
+      y: { type: 'point' },
+      x: { tickCount: 24 },
+      color: { palette: 'rdBu' },
+    },
+    axis: {
+      x: { title: 'time (hours)' },
+      y: { title: 'time (day)', grid: true },
+    },
+    // viewStyle: {
+    //   viewFill: '#4e79a7',
+    //   plotFill: '#f28e2c',
+    //   mainFill: '#e15759',
+    //   contentFill: '#76b7b2',
+    // },
   };
 }