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

Support multiple lines tick text on category axis - #139

pull/654/head
Masayuki Tanaka 10 years ago
parent
1f4e222883
commit
e1e3ddcf59
8 changed files with 543 additions and 37 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. 1
      Gruntfile.coffee
  2. 111
      c3.js
  3. 9
      c3.min.js
  4. 344
      spec/axis-spec.js
  5. 2
      spec/legend-spec.js
  6. 8
      src/axis.js
  7. 102
      src/c3.axis.js
  8. 1
      src/config.js

1
Gruntfile.coffee
Unescape View File

@ -85,6 +85,7 @@ module.exports = (grunt) ->
options:
specs: 'spec/*-spec.js'
helpers: 'spec/*-helper.js'
styles: 'c3.css'
vendor: 'http://d3js.org/d3.v3.min.js'
uglify:

111
c3.js
Unescape View File

@ -975,6 +975,7 @@
axis_x_tick_values: null,
axis_x_tick_rotate: undefined,
axis_x_tick_outer: true,
axis_x_tick_width: 80,
axis_x_max: undefined,
axis_x_min: undefined,
axis_x_padding: {},
@ -3893,7 +3894,11 @@
};
c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) {
var $$ = this, config = $$.config,
axisParams = {isCategory: $$.isCategorized(), withOuterTick: withOuterTick},
axisParams = {
isCategory: $$.isCategorized(),
withOuterTick: withOuterTick,
tickWidth: $$.isCategorized() ? config.axis_x_tick_width : undefined
},
axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient);
if ($$.isTimeSeries() && tickValues) {
@ -4129,7 +4134,7 @@
axis = $$.getXAxis(scale, $$.xOrient, $$.getXAxisTickFormat(), $$.getXAxisTickValues());
}
$$.d3.select('body').append("g").style('visibility', 'hidden').call(axis).each(function () {
$$.d3.select(this).selectAll('text').each(function () {
$$.d3.select(this).selectAll('text tspan').each(function () {
var box = this.getBoundingClientRect();
if (box.left > 0 && maxWidth < box.width) { maxWidth = box.width; }
});
@ -6343,6 +6348,23 @@
function textFormatted(v) {
return tickFormat ? tickFormat(v) : v;
}
function getSizeFor1Char(tick) {
var size = {
h: 11.5,
w: 5.5
};
tick.select('text').text(textFormatted).each(function (d) {
var box = this.getBoundingClientRect(),
text = textFormatted(d),
h = box.height,
w = text ? (box.width / text.length) : undefined;
if (h && w) {
size.h = h;
size.w = w;
}
}).text('');
return size;
}
function axis(g) {
g.each(function () {
var g = d3.select(this);
@ -6364,7 +6386,6 @@
var lineEnter = tickEnter.select("line"),
lineUpdate = tickUpdate.select("line"),
text = tick.select("text").text(textFormatted),
textEnter = tickEnter.select("text"),
textUpdate = tickUpdate.select("text");
@ -6376,20 +6397,77 @@
tickOffset = tickX = 0;
}
var text, tspan, sizeFor1Char = getSizeFor1Char(tick), counts = [];
var tickLength = Math.max(innerTickSize, 0) + tickPadding,
isVertical = orient === 'left' || orient === 'right';
// this should be called only when category axis
function splitTickText(d) {
var tickText = textFormatted(d) + "",
maxWidth = isVertical ? params.tickWidth : tickOffset * 2 - 10,
subtext, spaceIndex, textWidth, splitted = [];
function split(splitted, text) {
spaceIndex = undefined;
for (var i = 0; i < text.length; i++) {
if (text.charAt(i) === ' ') {
spaceIndex = i;
}
subtext = text.substr(0, i + 1);
textWidth = sizeFor1Char.w * subtext.length;
// if text width gets over tick width, split by space index or crrent index
if (maxWidth < textWidth) {
return split(
splitted.concat(text.substr(0, spaceIndex ? spaceIndex : i)),
text.slice(spaceIndex ? spaceIndex + 1 : i)
);
}
}
return splitted.concat(text);
}
return split(splitted, tickText);
}
function tspanDy(d, i) {
var dy = sizeFor1Char.h;
if (i === 0) {
if (orient === 'left' || orient === 'right') {
dy = -((counts[d.index] - 1) * (sizeFor1Char.h / 2) - (params.isCategory ? 2 : 3));
} else {
dy = params.isCategory ? ".40em" : ".71em";
}
}
return dy;
}
function tickSize(d) {
var tickPosition = scale(d) + tickOffset;
return range[0] < tickPosition && tickPosition < range[1] ? innerTickSize : 0;
}
text = tick.select("text");
tspan = text.selectAll('tspan')
.data(function (d, i) {
var splitted = params.tickWidth ? splitTickText(d) : [textFormatted(d)];
counts[i] = splitted.length;
return splitted.map(function (s) {
return { index: i, splitted: s };
});
})
.enter().append('tspan')
.text(function (d) { return d.splitted; });
switch (orient) {
case "bottom":
{
tickTransform = axisX;
lineEnter.attr("y2", innerTickSize);
textEnter.attr("y", Math.max(innerTickSize, 0) + tickPadding);
textEnter.attr("y", tickLength);
lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", tickSize);
textUpdate.attr("x", 0).attr("y", Math.max(innerTickSize, 0) + tickPadding);
text.attr("dy", ".71em").style("text-anchor", "middle");
textUpdate.attr("x", 0).attr("y", tickLength);
text.style("text-anchor", "middle");
tspan.attr('x', 0).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + range[0] + "," + outerTickSize + "V0H" + range[1] + "V" + outerTickSize);
break;
}
@ -6397,10 +6475,11 @@
{
tickTransform = axisX;
lineEnter.attr("y2", -innerTickSize);
textEnter.attr("y", -(Math.max(innerTickSize, 0) + tickPadding));
textEnter.attr("y", -tickLength);
lineUpdate.attr("x2", 0).attr("y2", -innerTickSize);
textUpdate.attr("x", 0).attr("y", -(Math.max(innerTickSize, 0) + tickPadding));
text.attr("dy", "0em").style("text-anchor", "middle");
textUpdate.attr("x", 0).attr("y", -tickLength);
text.style("text-anchor", "middle");
tspan.attr('x', 0).attr("dy", "0em");
pathUpdate.attr("d", "M" + range[0] + "," + -outerTickSize + "V0H" + range[1] + "V" + -outerTickSize);
break;
}
@ -6408,10 +6487,11 @@
{
tickTransform = axisY;
lineEnter.attr("x2", -innerTickSize);
textEnter.attr("x", -(Math.max(innerTickSize, 0) + tickPadding));
textEnter.attr("x", -tickLength);
lineUpdate.attr("x2", -innerTickSize).attr("y1", tickY).attr("y2", tickY);
textUpdate.attr("x", -(Math.max(innerTickSize, 0) + tickPadding)).attr("y", tickOffset);
text.attr("dy", ".32em").style("text-anchor", "end");
textUpdate.attr("x", -tickLength).attr("y", tickOffset);
text.style("text-anchor", "end");
tspan.attr('x', -tickLength).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + -outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + -outerTickSize);
break;
}
@ -6419,10 +6499,11 @@
{
tickTransform = axisY;
lineEnter.attr("x2", innerTickSize);
textEnter.attr("x", Math.max(innerTickSize, 0) + tickPadding);
textEnter.attr("x", tickLength);
lineUpdate.attr("x2", innerTickSize).attr("y2", 0);
textUpdate.attr("x", Math.max(innerTickSize, 0) + tickPadding).attr("y", 0);
text.attr("dy", ".32em").style("text-anchor", "start");
textUpdate.attr("x", tickLength).attr("y", 0);
text.style("text-anchor", "start");
tspan.attr('x', tickLength).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + outerTickSize);
break;
}

9
c3.min.js vendored
View File

File diff suppressed because one or more lines are too long

344
spec/axis-spec.js
Unescape View File

@ -32,10 +32,19 @@ describe('c3 chart axis', function () {
}
};
beforeEach(function () {
beforeEach(function (done) {
if (typeof chart === 'undefined') {
window.initDom();
}
chart = window.c3.generate(args);
d3 = chart.internal.d3;
chart.internal.d3.select('.jasmine_html-reporter')
.style('position', 'absolute')
.style('right', 0);
window.setTimeout(function () {
done();
}, 10);
});
describe('axis.y.tick.count', function () {
@ -87,4 +96,337 @@ describe('c3 chart axis', function () {
});
describe('axis.x.tick.width', function () {
describe('indexed x axis and y/y2 axis', function () {
describe('not rotated', function () {
it('should update args successfully', function () {
args = {
data: {
columns: [
['data1', 30, 200, 100, 400, 150, 250],
['data2', 50, 20, 10, 40, 15, 25]
],
axes: {
data2: 'y2'
}
},
axis: {
y2: {
show: true
}
}
};
expect(true).toBeTruthy();
});
it('should construct indexed x axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
expectedX = '0',
expectedDy = '.71em';
expect(ticks.size()).toBe(6);
ticks.each(function (d, i) {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe(i + '');
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
it('should set axis.x.tick.format', function () {
args.axis.x = {
tick: {
format: function () {
return 'very long tick text on x axis';
}
}
};
expect(true).toBeTruthy();
});
it('should not split x axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
expectedX = '0',
expectedDy = '.71em';
expect(ticks.size()).toBe(6);
ticks.each(function () {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe('very long tick text on x axis');
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
it('should construct y axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'),
expectedX = '-9',
expectedDy = '3';
expect(ticks.size()).toBe(9);
ticks.each(function (d) {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe(d + '');
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
it('should construct y2 axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick'),
expectedX = '9',
expectedDy = '3';
expect(ticks.size()).toBe(9);
ticks.each(function (d) {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe(d + '');
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
it('should set big values in y', function () {
args.data.columns = [
['data1', 3000000000000000, 200, 100, 400, 150, 250],
['data2', 50, 20, 10, 40, 15, 25]
];
expect(true).toBeTruthy();
});
it('should not split y axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-y2').selectAll('g.tick');
ticks.each(function () {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
});
});
});
describe('rotated', function () {
it('should update args to rotate axis', function () {
args.axis.rotated = true;
expect(true).toBeTruthy();
});
it('should not split x axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick'),
expectedX = '-9',
expectedDy = '3';
expect(ticks.size()).toBe(6);
ticks.each(function () {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe('very long tick text on x axis');
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
it('should not split y axis tick text to multiple lines', function () {
var ticks = chart.internal.main.select('.c3-axis-y').selectAll('g.tick'),
expectedTexts = [
'0',
'500000000000000',
'1000000000000000',
'1500000000000000',
'2000000000000000',
'2500000000000000',
'3000000000000000'
],
expectedX = '0',
expectedDy = '.71em';
expect(ticks.size()).toBe(7);
ticks.each(function (d, i) {
var tspans = d3.select(this).selectAll('tspan');
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTexts[i]);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
});
});
});
});
describe('category axis', function () {
describe('not rotated', function () {
it('should update args successfully', function () {
args = {
data: {
x: 'x',
columns: [
['x', 'this is a very long tick text on category axis', 'cat1', 'cat2', 'cat3', 'cat4', 'cat5'],
['data1', 30, 200, 100, 400, 150, 250],
['data2', 50, 20, 10, 40, 15, 25]
]
},
axis: {
x: {
type: 'category'
}
}
};
expect(true).toBeTruthy();
});
it('should locate ticks properly', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
ticks.each(function (d, i) {
var tspans = d3.select(this).selectAll('tspan'),
expectedX = '0',
expectedDy = '.40em';
if (i > 0) { // i === 0 should be checked in next test
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
}
});
});
it('should split tick text properly', function () {
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
tspans = tick.selectAll('tspan'),
expectedTickTexts = [
'this is a very',
'long tick text on',
'category axis'
],
expectedX = '0',
expectedDys = ['.40em', '10', '10'];
expect(tspans.size()).toBe(3);
tspans.each(function (d, i) {
var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTickTexts[i]);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDys[i]);
});
});
});
describe('rotated', function () {
it('should update args to rotate axis', function () {
args.axis.rotated = true;
expect(true).toBeTruthy();
});
it('should locate ticks on rotated axis properly', function () {
var ticks = chart.internal.main.select('.c3-axis-x').selectAll('g.tick');
ticks.each(function (d, i) {
var tspans = d3.select(this).selectAll('tspan'),
expectedX = '-9',
expectedDy = '2';
if (i > 0) { // i === 0 should be checked in next test
expect(tspans.size()).toBe(1);
tspans.each(function () {
var tspan = d3.select(this);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDy);
});
}
});
});
it('should split tick text on rotated axis properly', function () {
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
tspans = tick.selectAll('tspan'),
expectedTickTexts = [
'this is a very',
'long tick text',
'on category axis'
],
expectedX = '-9',
expectedDys = ['-8', '10', '10'];
expect(tspans.size()).toBe(3);
tspans.each(function (d, i) {
var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTickTexts[i]);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDys[i]);
});
});
});
describe('option used', function () {
describe('as null', function () {
it('should update args not to split ticks', function () {
args.axis.x.tick = {
width: null
};
expect(true).toBeTruthy();
});
it('should not split x tick', function () {
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
tspans = tick.selectAll('tspan');
expect(tspans.size()).toBe(1);
});
});
describe('as value', function () {
it('should update args not to split ticks', function () {
args.axis.x.tick = {
width: 150
};
expect(true).toBeTruthy();
});
it('should split x tick to 2 lines properly', function () {
var tick = chart.internal.main.select('.c3-axis-x').select('g.tick'),
tspans = tick.selectAll('tspan'),
expectedTickTexts = [
'this is a very long tick text',
'on category axis'
],
expectedX = '-9',
expectedDys = ['-3', '10'];
expect(tspans.size()).toBe(2);
tspans.each(function (d, i) {
var tspan = d3.select(this);
expect(tspan.text()).toBe(expectedTickTexts[i]);
expect(tspan.attr('x')).toBe(expectedX);
expect(tspan.attr('dy')).toBe(expectedDys[i]);
});
});
});
});
});
});
});

2
spec/legend-spec.js
Unescape View File

@ -34,7 +34,7 @@ describe('c3 chart legend', function () {
it('should be located on the center of chart', function () {
var box = chart.internal.legend.node().getBoundingClientRect();
expect(box.left + box.right).toBe(640);
expect(box.left + box.right).toBe(645);
});
});

8
src/axis.js
Unescape View File

@ -32,7 +32,11 @@ c3_chart_internal_fn.initAxis = function () {
};
c3_chart_internal_fn.getXAxis = function (scale, orient, tickFormat, tickValues, withOuterTick) {
var $$ = this, config = $$.config,
axisParams = {isCategory: $$.isCategorized(), withOuterTick: withOuterTick},
axisParams = {
isCategory: $$.isCategorized(),
withOuterTick: withOuterTick,
tickWidth: $$.isCategorized() ? config.axis_x_tick_width : undefined
},
axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient);
if ($$.isTimeSeries() && tickValues) {
@ -268,7 +272,7 @@ c3_chart_internal_fn.getMaxTickWidth = function (id) {
axis = $$.getXAxis(scale, $$.xOrient, $$.getXAxisTickFormat(), $$.getXAxisTickValues());
}
$$.d3.select('body').append("g").style('visibility', 'hidden').call(axis).each(function () {
$$.d3.select(this).selectAll('text').each(function () {
$$.d3.select(this).selectAll('text tspan').each(function () {
var box = this.getBoundingClientRect();
if (box.left > 0 && maxWidth < box.width) { maxWidth = box.width; }
});

102
src/c3.axis.js
Unescape View File

@ -48,6 +48,23 @@ function c3_axis(d3, params) {
function textFormatted(v) {
return tickFormat ? tickFormat(v) : v;
}
function getSizeFor1Char(tick) {
var size = {
h: 11.5,
w: 5.5
};
tick.select('text').text(textFormatted).each(function (d) {
var box = this.getBoundingClientRect(),
text = textFormatted(d),
h = box.height,
w = text ? (box.width / text.length) : undefined;
if (h && w) {
size.h = h;
size.w = w;
}
}).text('');
return size;
}
function axis(g) {
g.each(function () {
var g = d3.select(this);
@ -69,7 +86,6 @@ function c3_axis(d3, params) {
var lineEnter = tickEnter.select("line"),
lineUpdate = tickUpdate.select("line"),
text = tick.select("text").text(textFormatted),
textEnter = tickEnter.select("text"),
textUpdate = tickUpdate.select("text");
@ -81,20 +97,77 @@ function c3_axis(d3, params) {
tickOffset = tickX = 0;
}
var text, tspan, sizeFor1Char = getSizeFor1Char(tick), counts = [];
var tickLength = Math.max(innerTickSize, 0) + tickPadding,
isVertical = orient === 'left' || orient === 'right';
// this should be called only when category axis
function splitTickText(d) {
var tickText = textFormatted(d) + "",
maxWidth = isVertical ? params.tickWidth : tickOffset * 2 - 10,
subtext, spaceIndex, textWidth, splitted = [];
function split(splitted, text) {
spaceIndex = undefined;
for (var i = 0; i < text.length; i++) {
if (text.charAt(i) === ' ') {
spaceIndex = i;
}
subtext = text.substr(0, i + 1);
textWidth = sizeFor1Char.w * subtext.length;
// if text width gets over tick width, split by space index or crrent index
if (maxWidth < textWidth) {
return split(
splitted.concat(text.substr(0, spaceIndex ? spaceIndex : i)),
text.slice(spaceIndex ? spaceIndex + 1 : i)
);
}
}
return splitted.concat(text);
}
return split(splitted, tickText);
}
function tspanDy(d, i) {
var dy = sizeFor1Char.h;
if (i === 0) {
if (orient === 'left' || orient === 'right') {
dy = -((counts[d.index] - 1) * (sizeFor1Char.h / 2) - (params.isCategory ? 2 : 3));
} else {
dy = params.isCategory ? ".40em" : ".71em";
}
}
return dy;
}
function tickSize(d) {
var tickPosition = scale(d) + tickOffset;
return range[0] < tickPosition && tickPosition < range[1] ? innerTickSize : 0;
}
text = tick.select("text");
tspan = text.selectAll('tspan')
.data(function (d, i) {
var splitted = params.tickWidth ? splitTickText(d) : [textFormatted(d)];
counts[i] = splitted.length;
return splitted.map(function (s) {
return { index: i, splitted: s };
});
})
.enter().append('tspan')
.text(function (d) { return d.splitted; });
switch (orient) {
case "bottom":
{
tickTransform = axisX;
lineEnter.attr("y2", innerTickSize);
textEnter.attr("y", Math.max(innerTickSize, 0) + tickPadding);
textEnter.attr("y", tickLength);
lineUpdate.attr("x1", tickX).attr("x2", tickX).attr("y2", tickSize);
textUpdate.attr("x", 0).attr("y", Math.max(innerTickSize, 0) + tickPadding);
text.attr("dy", ".71em").style("text-anchor", "middle");
textUpdate.attr("x", 0).attr("y", tickLength);
text.style("text-anchor", "middle");
tspan.attr('x', 0).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + range[0] + "," + outerTickSize + "V0H" + range[1] + "V" + outerTickSize);
break;
}
@ -102,10 +175,11 @@ function c3_axis(d3, params) {
{
tickTransform = axisX;
lineEnter.attr("y2", -innerTickSize);
textEnter.attr("y", -(Math.max(innerTickSize, 0) + tickPadding));
textEnter.attr("y", -tickLength);
lineUpdate.attr("x2", 0).attr("y2", -innerTickSize);
textUpdate.attr("x", 0).attr("y", -(Math.max(innerTickSize, 0) + tickPadding));
text.attr("dy", "0em").style("text-anchor", "middle");
textUpdate.attr("x", 0).attr("y", -tickLength);
text.style("text-anchor", "middle");
tspan.attr('x', 0).attr("dy", "0em");
pathUpdate.attr("d", "M" + range[0] + "," + -outerTickSize + "V0H" + range[1] + "V" + -outerTickSize);
break;
}
@ -113,10 +187,11 @@ function c3_axis(d3, params) {
{
tickTransform = axisY;
lineEnter.attr("x2", -innerTickSize);
textEnter.attr("x", -(Math.max(innerTickSize, 0) + tickPadding));
textEnter.attr("x", -tickLength);
lineUpdate.attr("x2", -innerTickSize).attr("y1", tickY).attr("y2", tickY);
textUpdate.attr("x", -(Math.max(innerTickSize, 0) + tickPadding)).attr("y", tickOffset);
text.attr("dy", ".32em").style("text-anchor", "end");
textUpdate.attr("x", -tickLength).attr("y", tickOffset);
text.style("text-anchor", "end");
tspan.attr('x', -tickLength).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + -outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + -outerTickSize);
break;
}
@ -124,10 +199,11 @@ function c3_axis(d3, params) {
{
tickTransform = axisY;
lineEnter.attr("x2", innerTickSize);
textEnter.attr("x", Math.max(innerTickSize, 0) + tickPadding);
textEnter.attr("x", tickLength);
lineUpdate.attr("x2", innerTickSize).attr("y2", 0);
textUpdate.attr("x", Math.max(innerTickSize, 0) + tickPadding).attr("y", 0);
text.attr("dy", ".32em").style("text-anchor", "start");
textUpdate.attr("x", tickLength).attr("y", 0);
text.style("text-anchor", "start");
tspan.attr('x', tickLength).attr("dy", tspanDy);
pathUpdate.attr("d", "M" + outerTickSize + "," + range[0] + "H0V" + range[1] + "H" + outerTickSize);
break;
}

1
src/config.js
Unescape View File

@ -92,6 +92,7 @@ c3_chart_internal_fn.getDefaultConfig = function () {
axis_x_tick_values: null,
axis_x_tick_rotate: undefined,
axis_x_tick_outer: true,
axis_x_tick_width: 80,
axis_x_max: undefined,
axis_x_min: undefined,
axis_x_padding: {},

Write Preview
Loading…
Cancel
Save