You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by GitBox <gi...@apache.org> on 2022/09/23 03:17:04 UTC
[GitHub] [echarts] Ovilia commented on a diff in pull request #16825: Changed calculated label gap to be passed from top
Ovilia commented on code in PR #16825:
URL: https://github.com/apache/echarts/pull/16825#discussion_r978236387
##########
src/component/axis/AxisBuilder.ts:
##########
@@ -365,29 +366,47 @@ const builders: Record<'axisLine' | 'axisTickLabel' | 'axisName', AxisElementsBu
},
axisName(opt, axisModel, group, transformGroup) {
+ function calcDistanceToAxis() {
+ const defaultMargin = 10;
+ const axis = axisModel.axis;
+ const isHorizontal = axis.isHorizontal();
+ const labelUnionRect = estimateLabelUnionRect(axis);
+ if (!labelUnionRect) {
+ return 0;
+ }
+ const dim = isHorizontal ? 'height' : 'width';
+ const margin = axisModel.getModel('axisLabel').get('margin');
+ return labelUnionRect[dim] + margin + defaultMargin;
+ }
const name = retrieve(opt.axisName, axisModel.get('name'));
if (!name) {
return;
}
-
+ const isOutside = name === 'outsideStart' || name === 'outsideMiddle' || name === 'outsideEnd';
+ const labelGap = isOutside ? calcDistanceToAxis() : 0;
const nameLocation = axisModel.get('nameLocation');
const nameDirection = opt.nameDirection;
const textStyleModel = axisModel.getModel('nameTextStyle');
- const gap = axisModel.get('nameGap') || 0;
-
+ const gap = (axisModel.get('nameGap') || 0);
const extent = axisModel.axis.getExtent();
const gapSignal = extent[0] > extent[1] ? -1 : 1;
+
const pos = [
nameLocation === 'start'
? extent[0] - gapSignal * gap
+ : nameLocation === 'outsideStart'
+ ? extent[0] + gapSignal * (gap) + (nameDirection * labelGap)
Review Comment:
`'start'` and `'outsideStart'` can use the same logic because `labelGap` is 0 for `'start'`.
##########
src/component/axis/AxisBuilder.ts:
##########
@@ -365,29 +366,47 @@ const builders: Record<'axisLine' | 'axisTickLabel' | 'axisName', AxisElementsBu
},
axisName(opt, axisModel, group, transformGroup) {
+ function calcDistanceToAxis() {
+ const defaultMargin = 10;
Review Comment:
We should probably use [xAxis.nameGap](https://echarts.apache.org/en/option.html#xAxis.nameGap) instead. The document can be updated so that when the `nameLocation` is `outsideXXX`, it means the distance between the axis name and the axis labels.
##########
src/coord/axisCommonTypes.ts:
##########
@@ -35,7 +35,7 @@ export interface AxisBaseOptionCommon extends ComponentOption,
inverse?: boolean;
// Axis name displayed.
name?: string;
- nameLocation?: 'start' | 'middle' | 'end';
+ nameLocation?: 'start' | 'middle' | 'end' | 'outsideStart' | 'outsideMiddle' | 'outsideEnd';
Review Comment:
Make this a new type and export it so that it can be used in `endTextLayout`.
##########
src/component/axis/AxisBuilder.ts:
##########
@@ -365,29 +366,47 @@ const builders: Record<'axisLine' | 'axisTickLabel' | 'axisName', AxisElementsBu
},
axisName(opt, axisModel, group, transformGroup) {
+ function calcDistanceToAxis() {
+ const defaultMargin = 10;
+ const axis = axisModel.axis;
+ const isHorizontal = axis.isHorizontal();
+ const labelUnionRect = estimateLabelUnionRect(axis);
+ if (!labelUnionRect) {
+ return 0;
+ }
+ const dim = isHorizontal ? 'height' : 'width';
+ const margin = axisModel.getModel('axisLabel').get('margin');
+ return labelUnionRect[dim] + margin + defaultMargin;
+ }
const name = retrieve(opt.axisName, axisModel.get('name'));
if (!name) {
return;
}
-
+ const isOutside = name === 'outsideStart' || name === 'outsideMiddle' || name === 'outsideEnd';
+ const labelGap = isOutside ? calcDistanceToAxis() : 0;
const nameLocation = axisModel.get('nameLocation');
const nameDirection = opt.nameDirection;
const textStyleModel = axisModel.getModel('nameTextStyle');
- const gap = axisModel.get('nameGap') || 0;
-
+ const gap = (axisModel.get('nameGap') || 0);
Review Comment:
```ts
const nameGap = axisModel.get('nameGap') || 0;
const gap = isOutside ? calcDistanceToAxis(nameGap) : nameGap;
```
And `labelGap` is not necessary any more.
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For queries about this service, please contact Infrastructure at:
users@infra.apache.org
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org