Skip to content

C
c3-closed
You need to sign in or sign up before continuing.
Commit 716a2c5c authored by Masayuki Tanaka's avatar Masayuki Tanaka
Browse files
Options

Assume axis.y.padding as pixels - #799

parent dceeaf28
Hide whitespace changes
Inline Side-by-side
Showing with 700 additions and 47 deletions
c3.js
View file @ 716a2c5c
......@@ -1369,16 +1369,16 @@
padding_bottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1]));
} else if (showVerticalDataLabel) {
lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, axisId, 'height');
padding_top += domainLength * (lengths[1] / $$.height);
padding_bottom += domainLength * (lengths[0] / $$.height);
padding_top += this.convertPixelsToAxisPadding(lengths[1], domainLength);
padding_bottom += this.convertPixelsToAxisPadding(lengths[0], domainLength);
}
if (axisId === 'y' && notEmpty(config.axis_y_padding)) {
padding_top = $$.getAxisPadding(config.axis_y_padding, 'top', padding, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y_padding, 'bottom', padding, domainLength);
padding_top = $$.getAxisPadding(config.axis_y_padding, 'top', padding_top, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y_padding, 'bottom', padding_bottom, domainLength);
}
if (axisId === 'y2' && notEmpty(config.axis_y2_padding)) {
padding_top = $$.getAxisPadding(config.axis_y2_padding, 'top', padding, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y2_padding, 'bottom', padding, domainLength);
padding_top = $$.getAxisPadding(config.axis_y2_padding, 'top', padding_top, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y2_padding, 'bottom', padding_bottom, domainLength);
}
// Bar/Area chart should be 0-based if all positive|negative
if (isZeroBased) {
......@@ -3233,7 +3233,15 @@
} else {
xPos = $$.hasType('bar') ? (points[2][0] + points[0][0]) / 2 : points[0][0];
}
return d.value !== null ? xPos : xPos > $$.width ? $$.width - box.width : xPos;
// show labels regardless of the domain if value is null
if (d.value === null) {
if (xPos > $$.width) {
xPos = $$.width - box.width;
} else if (xPos < 0) {
xPos = 4;
}
}
return xPos;
};
c3_chart_internal_fn.getYForText = function (points, d, textElement) {
var $$ = this,
......@@ -3243,7 +3251,15 @@
} else {
yPos = points[2][1] + (d.value < 0 ? box.height : $$.isBarType(d) ? -3 : -6);
}
return d.value !== null ? yPos : yPos < box.height ? box.height : yPos;
// show labels regardless of the domain if value is null
if (d.value === null && !$$.config.axis_rotated) {
if (yPos < box.height) {
yPos = box.height;
} else if (yPos > this.height) {
yPos = this.height - 4;
}
}
return yPos;
};
c3_chart_internal_fn.setTargetType = function (targetIds, type) {
......@@ -4315,9 +4331,19 @@
.text($$.textForY2AxisLabel.bind($$));
};
c3_chart_internal_fn.getAxisPadding = function (padding, key, defaultValue, all) {
var ratio = padding.unit === 'ratio' ? all : 1;
return isValue(padding[key]) ? padding[key] * ratio : defaultValue;
c3_chart_internal_fn.getAxisPadding = function (padding, key, defaultValue, domainLength) {
if (!isValue(padding[key])) {
return defaultValue;
}
if (padding.unit === 'ratio') {
return padding[key] * domainLength;
}
// assume padding is pixels if unit is not specified
return this.convertPixelsToAxisPadding(padding[key], domainLength);
};
c3_chart_internal_fn.convertPixelsToAxisPadding = function (pixels, domainLength) {
var length = this.config.axis_rotated ? this.width : this.height;
return domainLength * (pixels / length);
};
c3_chart_internal_fn.generateTickValues = function (values, tickCount, forTimeSeries) {
......
c3.min.js
View file @ 716a2c5c
This source diff could not be displayed because it is too large. You can view the blob instead.
spec/data-spec.js
View file @ 716a2c5c
......@@ -142,22 +142,603 @@ describe('c3 chart data', function () {
describe('data.label', function () {
it('should update args to show data label', function () {
args = {
data: {
columns: [
['data1', 0.03, 0.2, 0.1, 0.4, 0.15, 0.250]
],
labels: true
}
};
expect(true).toBeTruthy();
describe('with small values', function () {
it('should update args to show data label', function () {
args = {
data: {
columns: [
['data1', 0.03, 0.2, 0.1, 0.4, 0.15, 0.250]
],
labels: true
}
};
expect(true).toBeTruthy();
});
it('should have proper y domain', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-0.02);
expect(domain[1]).toBeCloseTo(0.45);
});
});
describe('with positive values and null', function () {
describe('on not rotated axis', function () {
it('should update args', function () {
args = {
data: {
columns: [
['data1', 190, 200, 190, null],
],
type: 'bar',
labels: {
format: function (v) {
if (v === null) {
return 'Not Applicable';
}
return d3.format('$')(v);
}
}
}
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(0, -1);
expect(domain[1]).toBeCloseTo(227, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [67, 49, 67, 423],
expectedXs = [74, 221, 368, 515];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(189, -1);
expect(domain[1]).toBeCloseTo(201, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [375, 40, 375, 422],
expectedXs = [6, 198, 391, 583];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
describe('on rotated axis', function () {
it('should update args', function () {
args.data.type = 'bar';
args.axis = {
rotated: true
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(0, -1);
expect(domain[1]).toBeCloseTo(231, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [57, 163, 269, 375],
expectedXs = [490, 516, 490, 4];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(188, -1);
expect(domain[1]).toBeCloseTo(202, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [9, 147, 286, 424],
expectedXs = [76, 526, 76, 4];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
});
describe('with positive values and null', function () {
describe('on not rotated axis', function () {
it('should update args', function () {
args = {
data: {
columns: [
['data1', -190, -200, -190, null],
],
type: 'bar',
labels: {
format: function (v) {
if (v === null) {
return 'Not Applicable';
}
return d3.format('$')(v);
}
}
}
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-227, -1);
expect(domain[1]).toBeCloseTo(0, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [368, 387, 368, 12],
expectedXs = [74, 221, 368, 515];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-201, -1);
expect(domain[1]).toBeCloseTo(-189, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [58, 392, 58, 12],
expectedXs = [6, 198, 391, 583];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
describe('on rotated axis', function () {
it('should update args', function () {
args.data.type = 'bar';
args.axis = {
rotated: true
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-232, -1);
expect(domain[1]).toBeCloseTo(0, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [57, 163, 269, 375],
expectedXs = [103, 78, 103, 526];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-202, -1);
expect(domain[1]).toBeCloseTo(-188, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [9, 147, 286, 424],
expectedXs = [511, 67, 511, 526];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
});
describe('with positive and negative values and null', function () {
describe('on non rotated axis', function () {
it('should update args', function () {
args = {
data: {
columns: [
['data1', -190, 200, 190, null],
],
type: 'bar',
labels: {
format: function (v) {
if (v === null) {
return 'Not Applicable';
}
return d3.format('$')(v);
}
}
}
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-243, -1);
expect(domain[1]).toBeCloseTo(253, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [392, 43, 52, 215],
expectedXs = [74, 221, 368, 515];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-243, -1);
expect(domain[1]).toBeCloseTo(253, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [392, 40, 49, 212],
expectedXs = [6, 198, 391, 583];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
describe('on rotated axis', function () {
it('should update args', function () {
args.data.type = 'bar';
args.axis = {
rotated: true
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-254, -1);
expect(domain[1]).toBeCloseTo(260, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [57, 163, 269, 375],
expectedXs = [69, 525, 513, 295];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-254, -1);
expect(domain[1]).toBeCloseTo(260, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [9, 147, 286, 424],
expectedXs = [67, 527, 515, 297];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
});
it('should have proper y domain', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-0.02);
expect(domain[1]).toBeCloseTo(0.45);
describe('with positive grouped values', function () {
describe('on non rotated axis', function () {
it('should update args', function () {
args = {
data: {
columns: [
['data1', 30, 200, 100, 500],
['data2', 50, 20, 10, 40],
['data3', 250, 220, 210, 240],
],
groups: [['data1', 'data2', 'data3']],
labels: true,
type: 'bar',
}
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(0, -1);
expect(domain[1]).toBeCloseTo(885, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [385, 317, 370, 164],
expectedXs = [74, 221, 368, 515];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-94, -1);
expect(domain[1]).toBeCloseTo(884, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [344, 284, 331, 144],
expectedXs = [6, 198, 391, 583];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
describe('on rotated axis', function () {
it('should update args', function () {
args.data.type = 'bar';
args.axis = {
rotated: true
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(0, -1);
expect(domain[1]).toBeCloseTo(888, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [57, 163, 269, 375],
expectedXs = [57, 150, 77, 363];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-87, -1);
expect(domain[1]).toBeCloseTo(887, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [9, 147, 286, 424],
expectedXs = [107, 192, 125, 386];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
});
describe('with negative grouped values', function () {
describe('on non rotated axis', function () {
it('should update args', function () {
args = {
data: {
columns: [
['data1', -30, -200, -100, -500],
['data2', -50, -20, -10, -40],
['data3', -250, -220, -210, -240]
],
groups: [['data1', 'data2', 'data3']],
labels: true,
type: 'bar',
}
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-885, -1);
expect(domain[1]).toBeCloseTo(0, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [51, 118, 65, 272],
expectedXs = [74, 221, 368, 515];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-884, -1);
expect(domain[1]).toBeCloseTo(94, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [88, 149, 101, 288],
expectedXs = [6, 198, 391, 583];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
describe('on rotated axis', function () {
it('should update args', function () {
args.data.type = 'bar';
args.axis = {
rotated: true
};
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-894, -1);
expect(domain[1]).toBeCloseTo(0, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [57, 163, 269, 375],
expectedXs = [533, 440, 513, 230];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
it('should update args', function () {
args.data.type = 'line';
expect(true).toBeTruthy();
});
it('should have y domain with proper padding', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-894, -1);
expect(domain[1]).toBeCloseTo(94, -1);
});
it('should locate labels above each data point', function () {
var texts = chart.internal.main.selectAll('.c3-texts-data1 text'),
expectedYs = [9, 147, 286, 424],
expectedXs = [480, 397, 462, 205];
texts.each(function (d, i) {
var text = d3.select(this);
expect(+text.attr('y')).toBeCloseTo(expectedYs[i], -1);
expect(+text.attr('x')).toBeCloseTo(expectedXs[i], -1);
});
});
});
});
});
......
spec/domain-spec.js
View file @ 716a2c5c
......@@ -3,8 +3,6 @@ var describe = window.describe,
it = window.it,
beforeEach = window.beforeEach;
var initDom = window.initDom;
describe('c3 chart axis', function () {
'use strict';
......@@ -24,16 +22,8 @@ describe('c3 chart axis', function () {
};
beforeEach(function (done) {
if (typeof chart === 'undefined') {
initDom();
}
chart = window.c3.generate(args);
chart = window.initChart(chart, args, done);
d3 = chart.internal.d3;
chart.internal.d3.select('.jasmine_html-reporter').style('display', 'none');
window.setTimeout(function () {
done();
}, 10);
});
describe('axis.y.min', function () {
......@@ -93,4 +83,34 @@ describe('c3 chart axis', function () {
});
describe('axis.y.padding', function () {
it('should change axis.y.max to 1000', function () {
args = {
data: {
columns: [
['data1', 10, 20, 10, 40, 15, 25],
['data2', 50, 40, 30, 45, 25, 45]
]
},
axis: {
y: {
padding: {
top: 200,
bottom: 200
}
}
}
};
expect(true).toBeTruthy();
});
it('should be set properly when bigger than min of data', function () {
var domain = chart.internal.y.domain();
expect(domain[0]).toBeCloseTo(-9, -1);
expect(domain[1]).toBeCloseTo(69, -1);
});
});
});
src/axis.js
View file @ 716a2c5c
......@@ -315,9 +315,19 @@ c3_chart_internal_fn.updateAxisLabels = function (withTransition) {
.text($$.textForY2AxisLabel.bind($$));
};
c3_chart_internal_fn.getAxisPadding = function (padding, key, defaultValue, all) {
var ratio = padding.unit === 'ratio' ? all : 1;
return isValue(padding[key]) ? padding[key] * ratio : defaultValue;
c3_chart_internal_fn.getAxisPadding = function (padding, key, defaultValue, domainLength) {
if (!isValue(padding[key])) {
return defaultValue;
}
if (padding.unit === 'ratio') {
return padding[key] * domainLength;
}
// assume padding is pixels if unit is not specified
return this.convertPixelsToAxisPadding(padding[key], domainLength);
};
c3_chart_internal_fn.convertPixelsToAxisPadding = function (pixels, domainLength) {
var length = this.config.axis_rotated ? this.width : this.height;
return domainLength * (pixels / length);
};
c3_chart_internal_fn.generateTickValues = function (values, tickCount, forTimeSeries) {
......
src/domain.js
View file @ 716a2c5c
......@@ -126,16 +126,16 @@ c3_chart_internal_fn.getYDomain = function (targets, axisId, xDomain) {
padding_bottom += domainLength * (ratio[0] / (1 - ratio[0] - ratio[1]));
} else if (showVerticalDataLabel) {
lengths = $$.getDataLabelLength(yDomainMin, yDomainMax, axisId, 'height');
padding_top += domainLength * (lengths[1] / $$.height);
padding_bottom += domainLength * (lengths[0] / $$.height);
padding_top += this.convertPixelsToAxisPadding(lengths[1], domainLength);
padding_bottom += this.convertPixelsToAxisPadding(lengths[0], domainLength);
}
if (axisId === 'y' && notEmpty(config.axis_y_padding)) {
padding_top = $$.getAxisPadding(config.axis_y_padding, 'top', padding, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y_padding, 'bottom', padding, domainLength);
padding_top = $$.getAxisPadding(config.axis_y_padding, 'top', padding_top, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y_padding, 'bottom', padding_bottom, domainLength);
}
if (axisId === 'y2' && notEmpty(config.axis_y2_padding)) {
padding_top = $$.getAxisPadding(config.axis_y2_padding, 'top', padding, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y2_padding, 'bottom', padding, domainLength);
padding_top = $$.getAxisPadding(config.axis_y2_padding, 'top', padding_top, domainLength);
padding_bottom = $$.getAxisPadding(config.axis_y2_padding, 'bottom', padding_bottom, domainLength);
}
// Bar/Area chart should be 0-based if all positive|negative
if (isZeroBased) {
......
src/text.js
View file @ 716a2c5c
......@@ -80,7 +80,15 @@ c3_chart_internal_fn.getXForText = function (points, d, textElement) {
} else {
xPos = $$.hasType('bar') ? (points[2][0] + points[0][0]) / 2 : points[0][0];
}
return d.value !== null ? xPos : xPos > $$.width ? $$.width - box.width : xPos;
// show labels regardless of the domain if value is null
if (d.value === null) {
if (xPos > $$.width) {
xPos = $$.width - box.width;
} else if (xPos < 0) {
xPos = 4;
}
}
return xPos;
};
c3_chart_internal_fn.getYForText = function (points, d, textElement) {
var $$ = this,
......@@ -90,5 +98,13 @@ c3_chart_internal_fn.getYForText = function (points, d, textElement) {
} else {
yPos = points[2][1] + (d.value < 0 ? box.height : $$.isBarType(d) ? -3 : -6);
}
return d.value !== null ? yPos : yPos < box.height ? box.height : yPos;
// show labels regardless of the domain if value is null
if (d.value === null && !$$.config.axis_rotated) {
if (yPos < box.height) {
yPos = box.height;
} else if (yPos > this.height) {
yPos = this.height - 4;
}
}
return yPos;
};
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment