playground
/
c3
mirror of https://github.com/masayuki0812/c3.git
1
0
Fork 0
Code Issues Releases Activity
Browse Source

Assume axis.y.padding as pixels - #799

pull/813/head
Masayuki Tanaka 10 years ago
parent
dceeaf28d6
commit
716a2c5c04
7 changed files with 704 additions and 51 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 48
      c3.js
  2. 8
      c3.min.js
  3. 609
      spec/data-spec.js
  4. 42
      spec/domain-spec.js
  5. 16
      src/axis.js
  6. 12
      src/domain.js
  7. 20
      src/text.js

48
c3.js
Unescape View File

@ -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) {

8
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

609
spec/data-spec.js
Unescape View File

@ -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);
});
});
});
});
});

42
spec/domain-spec.js
Unescape View File

@ -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);
});
});
});

16
src/axis.js
Unescape View File

@ -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) {

12
src/domain.js
Unescape View File

@ -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) {

20
src/text.js
Unescape View File

@ -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;
};

Write Preview
Loading…
Cancel
Save