Skip to content

Commit

Permalink
fix showMaxLabel
Browse files Browse the repository at this point in the history
  • Loading branch information
@Ovilia
Ovilia committed Sep 15, 2017
1 parent 0206e35 commit 782a4eb
Show file tree
Hide file tree
Showing 4 changed files with 84 additions and 17 deletions.
74 changes: 60 additions & 14 deletions src/component/axis/AxisBuilder.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -189,13 +189,21 @@ define(function (require) {
var ticksCoords = axis.getTicksCoords(tickModel.get('alignWithLabel'));
var ticks = axis.scale.getTicks();

var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

var pt1 = [];
var pt2 = [];
var matrix = this._transform;

for (var i = 0; i < ticksCoords.length; i++) {
var tickEls = [];

var ticksCnt = ticksCoords.length;
for (var i = 0; i < ticksCnt; i++) {
// Only ordinal scale support tick interval
if (ifIgnoreOnTick(axis, i, tickInterval)) {
if (ifIgnoreOnTick(axis, i, tickInterval, ticksCnt,
showMinLabel, showMaxLabel)
) {
continue;
}

Expand All @@ -211,8 +219,7 @@ define(function (require) {
v2ApplyTransform(pt2, pt2, matrix);
}
// Tick line, Not use group transform to have better line draw
this.group.add(new graphic.Line(graphic.subPixelOptimizeLine({

var tickEl = new graphic.Line(graphic.subPixelOptimizeLine({
// Id for animation
anid: 'tick_' + ticks[i],

Expand All @@ -230,8 +237,12 @@ define(function (require) {
),
z2: 2,
silent: true
})));
}));
this.group.add(tickEl);
tickEls.push(tickEl);
}

fixMinMaxLabelShow(axisModel, this.textEls, tickEls);
},

/**
Expand Down Expand Up @@ -262,12 +273,17 @@ define(function (require) {
var labelLayout = innerTextLayout(opt.rotation, labelRotation, opt.labelDirection);
var categoryData = axisModel.get('data');

var textEls = [];
this.textEls = [];
var silent = isSilent(axisModel);
var triggerEvent = axisModel.get('triggerEvent');

var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

zrUtil.each(ticks, function (tickVal, index) {
if (ifIgnoreOnTick(axis, index, opt.labelInterval)) {
if (ifIgnoreOnTick(axis, index, opt.labelInterval, ticks.length,
showMinLabel, showMaxLabel)
) {
return;
}

Expand Down Expand Up @@ -330,14 +346,12 @@ define(function (require) {
this._dumbGroup.add(textEl);
textEl.updateTransform();

textEls.push(textEl);
this.textEls.push(textEl);
this.group.add(textEl);

textEl.decomposeTransform();

}, this);

fixMinMaxLabelShow(axisModel, textEls);
},

/**
Expand Down Expand Up @@ -559,29 +573,50 @@ define(function (require) {
);
}

function fixMinMaxLabelShow(axisModel, textEls) {
function fixMinMaxLabelShow(axisModel, textEls, tickEls) {
// 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
var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

var firstLabel = textEls[0];
var nextLabel = textEls[1];
var lastLabel = textEls[textEls.length - 1];
var prevLabel = textEls[textEls.length - 2];

var firstTick = tickEls[0];
var nextTick = tickEls[1];
var lastTick = tickEls[tickEls.length - 1];
var prevTick = tickEls[tickEls.length - 2];

if (showMinLabel === false) {
firstLabel.ignore = true;
tickEls[0].ignore = true;
}
else if (axisModel.getMin() != null && isTwoLabelOverlapped(firstLabel, nextLabel)) {
showMinLabel ? (nextLabel.ignore = true) : (firstLabel.ignore = true);
if (showMinLabel) {
nextLabel.ignore = true;
nextTick.ignore = true;
}
else {
firstLabel.ignore = true;
firstTick.ignore = true;
}
}

if (showMaxLabel === false) {
lastLabel.ignore = true;
}
else if (axisModel.getMax() != null && isTwoLabelOverlapped(prevLabel, lastLabel)) {
showMaxLabel ? (prevLabel.ignore = true) : (lastLabel.ignore = true);
if (showMaxLabel) {
prevLabel.ignore = true;
prevTick.ignore = true;
}
else {
lastLabel.ignore = true;
lastTick.ignore = true;
}
}
}

Expand Down Expand Up @@ -609,7 +644,18 @@ define(function (require) {
/**
* @static
*/
var ifIgnoreOnTick = AxisBuilder.ifIgnoreOnTick = function (axis, i, interval) {
var ifIgnoreOnTick = AxisBuilder.ifIgnoreOnTick = function (
axis,
i,
interval,
ticksCnt,
showMinLabel,
showMaxLabel
) {
if (i === 0 && showMinLabel || i === ticksCnt - 1 && showMaxLabel) {
return false;
}

var rawTick;
var scale = axis.scale;
return scale.type === 'ordinal'
Expand Down
14 changes: 12 additions & 2 deletions src/component/axis/CartesianAxisView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -97,13 +97,18 @@ define(function (require) {
);
var ticks = axis.scale.getTicks();

var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

var p1 = [];
var p2 = [];
// Simple optimization
// Batching the lines if color are the same
var lineStyle = lineStyleModel.getLineStyle();
for (var i = 0; i < ticksCoords.length; i++) {
if (ifIgnoreOnTick(axis, i, lineInterval)) {
if (ifIgnoreOnTick(axis, i, lineInterval, ticksCoords.length,
showMinLabel, showMaxLabel
)) {
continue;
}

Expand Down Expand Up @@ -174,8 +179,13 @@ define(function (require) {
var areaStyle = areaStyleModel.getAreaStyle();
areaColors = zrUtil.isArray(areaColors) ? areaColors : [areaColors];

var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

for (var i = 1; i < ticksCoords.length; i++) {
if (ifIgnoreOnTick(axis, i, areaInterval)) {
if (ifIgnoreOnTick(axis, i, areaInterval, ticksCoords.length,
showMinLabel, showMaxLabel
)) {
continue;
}

Expand Down
7 changes: 6 additions & 1 deletion src/component/axis/SingleAxisView.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,8 +66,13 @@ define(function (require) {
var p1 = [];
var p2 = [];

var showMinLabel = axisModel.get('axisLabel.showMinLabel');
var showMaxLabel = axisModel.get('axisLabel.showMaxLabel');

for (var i = 0; i < ticksCoords.length; ++i) {
if (ifIgnoreOnTick(axis, i, lineInterval)) {
if (ifIgnoreOnTick(axis, i, lineInterval, ticksCoords.length,
showMinLabel, showMaxLabel
)) {
continue;
}
var tickCoord = axis.toGlobalCoord(ticksCoords[i]);
Expand Down
6 changes: 6 additions & 0 deletions test/line.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,6 +123,10 @@
},
splitLine: {
show: false
},
axisLabel: {
showMaxLabel: true,
showMinLabel: true
}
},
grid: {
Expand Down Expand Up @@ -189,6 +193,8 @@
step: 'end'
}]
});

window.onresize = chart.resize;
})

</script>
Expand Down

0 comments on commit 782a4eb

Please sign in to comment.