Skip to content

Commit

Permalink
tweak(line): tweak #13013 & #13501.
Browse files Browse the repository at this point in the history
- only make line bolder when there is more than one series and blur state
- or the user manually specify `lineStyle.width` as `bolder`
  • Loading branch information
plainheart committed Mar 11, 2021
1 parent 13f1f03 commit 90d17c1
Show file tree
Hide file tree
Showing 2 changed files with 24 additions and 8 deletions.
5 changes: 1 addition & 4 deletions src/chart/line/LineSeries.ts
Original file line number Diff line number Diff line change
Expand Up @@ -163,10 +163,7 @@ class LineSeriesModel extends SeriesModel<LineSeriesOption> {
},

emphasis: {
scale: true,
lineStyle: {
width: 'bolder'
}
scale: true
},
// areaStyle: {
// origin of areaStyle. Valid values:
Expand Down
27 changes: 23 additions & 4 deletions src/chart/line/LineView.ts
Original file line number Diff line number Diff line change
Expand Up @@ -736,10 +736,7 @@ class LineView extends ChartView {

setStatesStylesFromModel(polyline, seriesModel, 'lineStyle');

if (polyline.style.lineWidth > 0 && seriesModel.get(['emphasis', 'lineStyle', 'width']) === 'bolder') {
const emphasisLineStyle = polyline.getState('emphasis').style;
emphasisLineStyle.lineWidth = polyline.style.lineWidth + 1;
}
this._bolderLine(polyline, seriesModel, ecModel);

// Needs seriesIndex for focus
getECData(polyline).seriesIndex = seriesModel.seriesIndex;
Expand Down Expand Up @@ -1171,6 +1168,28 @@ class LineView extends ChartView {
}
}

/**
* To determine if the line should be bolder
*
* TODO:
* It's better to disable bolder when data is large,
* but it seems no simple way to figure out.
*/
_bolderLine(polyline: ECPolyline, seriesModel: LineSeriesModel, ecModel: GlobalModel) {
if (polyline.style.lineWidth > 0) {
// only make line bolder when there is more than one series and blur state
// or the user manually specify `lineStyle.width` as `bolder`
// see https://github.com/apache/echarts/pull/13501
const emphasisLineWidth = seriesModel.get(['emphasis', 'lineStyle', 'width']);
if (emphasisLineWidth === 'bolder'
|| (emphasisLineWidth == null && polyline.getState('blur') && ecModel.getSeriesCount() > 1)
) {
const emphasisLineStyle = polyline.getState('emphasis').style;
emphasisLineStyle.lineWidth = polyline.style.lineWidth + 1;
}
}
}

/**
* @private
*/
Expand Down

0 comments on commit 90d17c1

Please sign in to comment.