You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@echarts.apache.org by su...@apache.org on 2018/12/14 13:08:07 UTC
[incubator-echarts] branch release updated: (axis) when
axisLabel.interval of a category axis is set as 0,
all labels show regardless of overlap. Fix #9589
This is an automated email from the ASF dual-hosted git repository.
sushuang pushed a commit to branch release
in repository https://gitbox.apache.org/repos/asf/incubator-echarts.git
The following commit(s) were added to refs/heads/release by this push:
new cd16113 (axis) when axisLabel.interval of a category axis is set as 0, all labels show regardless of overlap. Fix #9589
cd16113 is described below
commit cd1611327e3ceba7b71646eebb7cbef00c8ebece
Author: sushuang <su...@gmail.com>
AuthorDate: Fri Dec 14 21:07:10 2018 +0800
(axis) when axisLabel.interval of a category axis is set as 0, all labels show regardless of overlap. Fix #9589
---
src/component/axis/AxisBuilder.js | 5 ++
src/coord/axisHelper.js | 19 +++++++
src/coord/axisTickLabelBuilder.js | 23 ++++-----
test/axis-lastLabel.html | 103 ++++++++++++++++++++++++++++++++++++++
4 files changed, 137 insertions(+), 13 deletions(-)
diff --git a/src/component/axis/AxisBuilder.js b/src/component/axis/AxisBuilder.js
index 1f0ff7e..919fb5e 100644
--- a/src/component/axis/AxisBuilder.js
+++ b/src/component/axis/AxisBuilder.js
@@ -25,6 +25,7 @@ import {isRadianAroundZero, remRadian} from '../../util/number';
import {createSymbol} from '../../util/symbol';
import * as matrixUtil from 'zrender/src/core/matrix';
import {applyTransform as v2ApplyTransform} from 'zrender/src/core/vector';
+import {shouldShowAllLabels} from '../../coord/axisHelper';
var PI = Math.PI;
@@ -479,6 +480,10 @@ function isSilent(axisModel) {
}
function fixMinMaxLabelShow(axisModel, labelEls, tickEls) {
+ if (shouldShowAllLabels(axisModel.axis)) {
+ return;
+ }
+
// If min or max are user set, we need to check
// If the tick on min(max) are overlap on their neighbour tick
// If they are overlapped, we need to hide the min(max) tick label
diff --git a/src/coord/axisHelper.js b/src/coord/axisHelper.js
index 34762bf..a0e2a13 100644
--- a/src/coord/axisHelper.js
+++ b/src/coord/axisHelper.js
@@ -387,4 +387,23 @@ function rotateTextRect(textRect, rotate) {
return rotatedRect;
}
+/**
+ * @param {module:echarts/src/model/Model} model axisLabelModel or axisTickModel
+ * @return {number|String} Can be null|'auto'|number|function
+ */
+export function getOptionCategoryInterval(model) {
+ var interval = model.get('interval');
+ return interval == null ? 'auto' : interval;
+}
+
+/**
+ * Set `categoryInterval` as 0 implicitly indicates that
+ * show all labels reguardless of overlap.
+ * @param {Object} axis axisModel.axis
+ * @return {boolean}
+ */
+export function shouldShowAllLabels(axis) {
+ return axis.type === 'category'
+ && getOptionCategoryInterval(axis.getLabelModel()) === 0;
+}
diff --git a/src/coord/axisTickLabelBuilder.js b/src/coord/axisTickLabelBuilder.js
index 822cd9d..2809d10 100644
--- a/src/coord/axisTickLabelBuilder.js
+++ b/src/coord/axisTickLabelBuilder.js
@@ -20,7 +20,11 @@
import * as zrUtil from 'zrender/src/core/util';
import * as textContain from 'zrender/src/contain/text';
import {makeInner} from '../util/model';
-import {makeLabelFormatter} from './axisHelper';
+import {
+ makeLabelFormatter,
+ getOptionCategoryInterval,
+ shouldShowAllLabels
+} from './axisHelper';
var inner = makeInner();
@@ -304,12 +308,11 @@ function makeLabelsByNumericCategoryInterval(axis, categoryInterval, onlyTick) {
// suitable for splitLine and splitArea rendering.
// (2) Scales except category always contain min max label so
// do not need to perform this process.
- var showMinMax = {
- min: labelModel.get('showMinLabel'),
- max: labelModel.get('showMaxLabel')
- };
+ var showAllLabel = shouldShowAllLabels(axis);
+ var includeMinLabel = labelModel.get('showMinLabel') || showAllLabel;
+ var includeMaxLabel = labelModel.get('showMaxLabel') || showAllLabel;
- if (showMinMax.min && startTick !== ordinalExtent[0]) {
+ if (includeMinLabel && startTick !== ordinalExtent[0]) {
addItem(ordinalExtent[0]);
}
@@ -319,7 +322,7 @@ function makeLabelsByNumericCategoryInterval(axis, categoryInterval, onlyTick) {
addItem(tickValue);
}
- if (showMinMax.max && tickValue !== ordinalExtent[1]) {
+ if (includeMaxLabel && tickValue !== ordinalExtent[1]) {
addItem(ordinalExtent[1]);
}
@@ -360,9 +363,3 @@ function makeLabelsByCustomizedCategoryInterval(axis, categoryInterval, onlyTick
return result;
}
-
-// Can be null|'auto'|number|function
-function getOptionCategoryInterval(model) {
- var interval = model.get('interval');
- return interval == null ? 'auto' : interval;
-}
diff --git a/test/axis-lastLabel.html b/test/axis-lastLabel.html
index aa51add..5d7d1bd 100644
--- a/test/axis-lastLabel.html
+++ b/test/axis-lastLabel.html
@@ -47,6 +47,7 @@ under the License.
<div class="chart" id="chart0"></div>
<div class="chart" id="chart1"></div>
<div class="chart" id="chart2"></div>
+ <div class="chart" id="chart3"></div>
@@ -357,5 +358,107 @@ under the License.
+
+
+
+
+
+
+
+ <script>
+
+ require([
+ 'data/rainfall.json',
+ 'echarts'
+ ], function (rainfallData, echarts) {
+
+ var chart = echarts.init(document.getElementById('chart1'), null, {
+
+ });
+
+ var option = {
+ tooltip : {
+ trigger: 'axis',
+ axisPointer : { // 坐标轴指示器，坐标轴触发有效
+ type : 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+ }
+ },
+ legend: {
+ data: ['直接访问', '邮件营销','联盟广告','视频广告','搜索引擎']
+ },
+ grid: [{
+ height: 80,
+ width: '40%',
+ containLabel: true
+ }, {
+ height: 80,
+ right: 10,
+ width: '40%',
+ containLabel: true
+ }],
+ xAxis: [{
+ type: 'value'
+ }, {
+ type: 'value',
+ gridIndex: 1
+ }],
+ yAxis: [{
+ axisLabel: {
+ interval: 0,
+ textStyle: {
+ fontSize: 18
+ }
+ },
+ type: 'category',
+ data: ['周 A','周 B','周 C','周 D','周 E','周 F','周 G']
+ }, {
+ gridIndex: 1,
+ axisLabel: {
+ interval: 0,
+ textStyle: {
+ fontSize: 18
+ },
+ showMinLabel: false,
+ showMaxLabel: false
+ },
+ type: 'category',
+ data: ['周 A','周 B','周 C','周 D','周 E','周 F','周 G']
+ }],
+ series: [{
+ type: 'bar',
+ data: [320, 302, 301, 334, 390, 330, 320]
+ }, {
+ type: 'bar',
+ data: [325, 102, 201, 84, 190, 230, 120],
+ xAxisIndex: 1,
+ yAxisIndex: 1
+ }]
+ };
+
+ var chart = testHelper.create(echarts, 'chart3', {
+ title: [
+ 'category yAxis: all Label should be displayed.',
+ 'axisLabel.interval is 0, showMaxLabel/showMinLabel should be ignored.'
+ ],
+ option: option,
+ info: {
+ yAxis0: {
+ axisLabel: option.xAxis[0].axisLabel,
+ axisTick: option.xAxis[0].axisTick
+ },
+ yAxis1: {
+ axisLabel: option.xAxis[1].axisLabel,
+ axisTick: option.xAxis[1].axisTick
+ }
+ },
+ infoKey: 'xAxis'
+ });
+ })
+
+ </script>
+
+
+
+
</body>
</html>
\ No newline at end of file
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@echarts.apache.org
For additional commands, e-mail: commits-help@echarts.apache.org