Skip to content

feat(axis): provide splitLine.showMinLine and splitLine.showMaxLine. … #16947

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
MeetzhDing wants to merge 3 commits into from
Closed

feat(axis): provide splitLine.showMinLine and splitLine.showMaxLine. … #16947

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
8be4e47
feat(axis): provide splitLine.showMinLine and splitLine.showMaxLine
Aug 9, 2022
7d34f5c
feat(axis): provide splitLine.showMinLine and splitLine.showMaxLine
Nov 9, 2022
075741c
Merge branch 'master' of https://github.com/apache/echarts into fix-1…
plainheart Nov 15, 2022
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
25 changes: 25 additions & 0 deletions src/component/axis/CartesianAxisView.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import CartesianAxisModel from '../../coord/cartesian/AxisModel';
import GridModel from '../../coord/cartesian/GridModel';
import { Payload } from '../../util/types';
import { isIntervalOrLogScale } from '../../scale/helper';
import IntervalScale from '../../scale/Interval';

const axisBuilderAttrs = [
'axisLine', 'axisTickLabel', 'axisName'
Expand Down Expand Up @@ -135,6 +136,30 @@ const axisElementBuilders: Record<typeof selfBuilderAttrs[number], AxisElementBu
tickModel: splitLineModel
});

const axisScale = axis.scale as IntervalScale;
if (ticksCoords.length > 2 && axisScale.getInterval) {
Copy link
Copy Markdown
Contributor

@Ovilia Ovilia Nov 8, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What if ticksCoords.length is 2 but the data range is not equal to the ticks' values?

Copy link
Copy Markdown
Contributor Author

@MeetzhDing MeetzhDing Nov 9, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When ticksCoords length is 2, the splitLine is not expected to be hidden

Copy link
Copy Markdown
Contributor

@Ovilia Ovilia Nov 15, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why? For example, when data range is 11~19 and ticksCoords is [10, 20], I believe there should be no split line, right?

const interval = axisScale.getInterval();

const showMinLine = splitLineModel.get('showMinLine');
if (!showMinLine
|| (showMinLine === 'auto'
&& ticksCoords[1].tickValue - ticksCoords[0].tickValue < interval
Comment thread
Ovilia marked this conversation as resolved.
)
) {
ticksCoords.shift();
}

const showMaxLine = splitLineModel.get('showMaxLine');
if (!showMaxLine
|| (showMaxLine === 'auto'
&& ticksCoords[ticksCoords.length - 1].tickValue
- ticksCoords[ticksCoords.length - 2].tickValue < interval
)
) {
ticksCoords.pop();
}
}

const p1 = [];
const p2 = [];

Expand Down
4 changes: 4 additions & 0 deletions src/coord/axisCommonTypes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -246,6 +246,10 @@ interface MinorTickOption {

interface SplitLineOption {
show?: boolean,
// true | false | 'auto'(true when nick tick)
showMinLine?: boolean | 'auto',
// true | false | 'auto'(true when nick tick)
showMaxLine?: boolean | 'auto',
interval?: 'auto' | number | ((index:number, value: string) => boolean)
// colors will display in turn
lineStyle?: LineStyleOption<ZRColor | ZRColor[]>
Expand Down
4 changes: 3 additions & 1 deletion src/coord/axisDefault.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -97,7 +97,9 @@ const defaultOption: AxisBaseOption = {
color: ['#E0E6F1'],
width: 1,
type: 'solid'
}
},
showMinLine: true,
showMaxLine: true
},
splitArea: {
show: false,
Expand Down
132 changes: 129 additions & 3 deletions test/axis-interval.html
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.