Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 39 additions & 0 deletions docs/assets/option/en/common/layout-item.md
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,45 @@ padding: {
}
```

#${prefix} noOuterPadding(boolean) = true

Determines whether to automatically modify padding by hiding the outer padding according to the orient property. When set to true, the component will automatically set the padding on the outer side (the direction specified by orient) to 0. This feature is currently only effective for components.

Property Specifications:

- Type: `boolean`
- Default value: `true`
- Depends on the `orient` property - only takes effect when `orient` is set and the component supports this property
- Only effective for components, not applicable to other layout elements

Usage Scenarios:

- When components (such as legends, titles, axes, etc.) are positioned adjacent to chart edges, it is often desirable to automatically set the outer padding (in the orient-specified direction) to 0 for space efficiency and better visual alignment
- When maximizing chart space utilization

Example Usage:

```ts
const legendSpec = {
type: 'legend',
orient: 'right', // The legend is positioned on the right
padding: [10, 10, 10, 10], // 10px padding on all four sides: top, right, bottom, left
noOuterPadding: true // Automatically sets the right padding to 0
};
// Result: The effective padding is { top: 10, right: 0, bottom: 10, left: 10 }
```

Comparison:

- When `noOuterPadding: false`, the padding for all sides is retained.
- When `noOuterPadding: true`, the padding on the side specified by `orient` is automatically set to 0.

Notes:

- This property defaults to `true`, so you usually do not need to set it explicitly unless you want to retain the outer padding.
- It depends on `orient`; if `orient` is not set, this property has no effect.
- Currently, this property only applies to components.

#${prefix} width(ILayoutNumber)

Layout width configuration for the module.
Expand Down
39 changes: 39 additions & 0 deletions docs/assets/option/zh/common/layout-item.md
Original file line number Diff line number Diff line change
Expand Up @@ -91,6 +91,45 @@ padding: {
}
```

#${prefix} noOuterPadding(boolean) = true

是否按照 orient 自动修改 padding,隐藏位于外侧的 padding。当设置为 true 时,组件会自动将外侧(即 orient 指定的方向)的 padding 设置为 0。目前只在组件上生效。

属性说明:

- 类型:`boolean`
- 默认值:`true`
- 依赖于 `orient` 属性,只有设置了 `orient` 并且组件支持该属性时才生效。
- 仅对组件有效,对其他布局元素无效。

使用场景:

- 当组件(如图例、标题、坐标轴等)贴近图表边缘时,通常希望外侧(orient 指定方向)的 padding 自动为 0,以节省空间并实现更好的视觉对齐。
- 需要最大化利用图表空间时。

使用示例:

```ts
const legendSpec = {
type: 'legend',
orient: 'right', // 图例位于右侧
padding: [10, 10, 10, 10], // 上、右、下、左四个方向都有10px的内边距
noOuterPadding: true // 自动将右侧padding设置为0
};
// 结果:实际生效的padding为 { top: 10, right: 0, bottom: 10, left: 10 }
```

效果对比:

- `noOuterPadding: false` 时,所有方向的 padding 都会保留。
- `noOuterPadding: true` 时,orient 指定方向的 padding 会被自动设置为 0。

注意事项:

- 该属性默认值为 `true`,通常无需显式配置,除非你希望保留外侧 padding。
- 依赖于 `orient`,未设置 `orient` 时该属性无效。
- 目前仅对组件生效。

#${prefix} width(ILayoutNumber)

模块的布局宽度配置。
Expand Down