fix: 图例通过 margin 配置来对齐 (#1132)

Author: lessmost

src/base/controller/padding.ts

@@ -125,7 +125,6 @@ export default class PaddingController {
         }
       });
     }
-    this.plot.config.theme.legend.margin = bleeding;
     this.bleeding = clone(bleeding);
     // 参与auto padding的components: axis legend label annotation
     const components_bbox = [new BBox(viewRange.minX, viewRange.minY, viewRange.width, viewRange.height)];

src/base/view-layer.ts

@@ -803,7 +803,12 @@ export default abstract class ViewLayer<T extends ViewLayerConfig = ViewLayerCon
 
   protected isLimitInPlot() {
     const yAxisOptions = this.options.yAxis as IValueAxis;
-    if (hasKey(yAxisOptions, 'max') || hasKey(yAxisOptions, 'min')) {
+    if (
+      hasKey(yAxisOptions, 'max') ||
+      hasKey(yAxisOptions, 'min') ||
+      hasKey(yAxisOptions, 'maxLimit') ||
+      hasKey(yAxisOptions, 'minLimit')
+    ) {
       return true;
     }
     return false;

src/interaction/scrollbar.ts

@@ -85,13 +85,14 @@ export default class ScrollbarInteraction extends BaseInteraction {
     view.on('afterrender', () => {
       const padding = this.view.padding;
       // if we're not in `auto padding` process
-      if (!isEqual([0, 0, 0, 0], padding)) {
-        if (!this.trackLen) {
-          this.measureScrollBar();
-          this.changeViewData(this.getScrollRange(), true);
-        } else {
-          this.renderScrollbar();
-        }
+      if (padding === 'auto' || isEqual(padding, [0, 0, 0, 1])) {
+        return;
+      }
+      if (!this.trackLen) {
+        this.measureScrollBar();
+        this.changeViewData(this.getScrollRange(), true);
+      } else {
+        this.renderScrollbar();
       }
     });
   }

src/interaction/slider.ts

@@ -1,7 +1,7 @@
 import { IGroup, Slider, VIEW_LIFE_CIRCLE } from '../dependents';
 import BBox from '../util/bbox';
 import { Scale } from '@antv/scale';
-import { clamp, head, last, map, size, throttle, isEmpty } from '@antv/util';
+import { clamp, head, last, map, size, throttle, isEmpty, isEqual } from '@antv/util';
 import { ISliderInteractionConfig } from '../interface/config';
 import BaseInteraction from './base';
 import { getDataByScaleRange } from './helper/data-range';
@@ -95,6 +95,10 @@ export default class SliderInteraction extends BaseInteraction {
     this.xScaleCfg = undefined;
     // 等待 view 每次 render 完成后更新 slider 组件
     const callback = () => {
+      const padding = this.view.padding;
+      if (padding === 'auto' || isEqual(padding, [0, 0, 0, 1])) {
+        return;
+      }
       if (isEmpty(layer.options.data)) {
         return;
       }

src/interface/config.ts

@@ -162,7 +162,7 @@ export type LegendPosition =
   | 'right-bottom'
   | 'top-left'
   | 'top-center'
-  | 'top-bottom'
+  | 'top-right'
   | 'bottom-left'
   | 'bottom-center'
   | 'bottom-right';

src/theme/default.ts

@@ -268,6 +268,9 @@ export const DEFAULT_GLOBAL_THEME = {
 
   // G2Plot 组件主题配置
   components: {
+    legend: {
+      margin: [0, 24, 24, 24],
+    },
     tooltipIndicator: {
       title: {
         style: {