diff --git a/spec/axis-spec.js b/spec/axis-spec.js index 1e4d5be..a206bab 100644 --- a/spec/axis-spec.js +++ b/spec/axis-spec.js @@ -65,6 +65,36 @@ describe('c3 chart axis', function () { }); + + describe('axis.y.tick.exact', function () { + + it('should update args to have 12 ticks on y axis', function () { + args.axis.y.tick.count = 12; + expect(true).toBeTruthy(); + }); + + it('should display exact count numbers', function () { + var text = d3.select('.c3-axis-y').selectAll('g.tick').filter(function (d, i) { + return i === 1; + }).select('text').text(); + + expect(+text).toBe(13.545454545454547); + }); + + it('should update args to not to be exact ticks on y axis', function () { + args.axis.y.tick.exact = false; + expect(true).toBeTruthy(); + }); + + it('should display average count numbers', function () { + var text = d3.select('.c3-axis-y').selectAll('g.tick').filter(function (d, i) { + return i === 1; + }).select('text').text(); + + expect(+text).toBe(50); + }); + }); + describe('axis.y.tick.values', function () { var values = [100, 500]; diff --git a/src/axis.js b/src/axis.js index e3310b4..302b8cc 100644 --- a/src/axis.js +++ b/src/axis.js @@ -76,12 +76,13 @@ Axis.prototype.updateXAxisTickValues = function updateXAxisTickValues(targets, a } return tickValues; }; -Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText) { +Axis.prototype.getYAxis = function getYAxis(scale, orient, tickFormat, tickValues, withOuterTick, withoutTransition, withoutRotateTickText, tickCount) { var $$ = this.owner, config = $$.config, axisParams = { withOuterTick: withOuterTick, withoutTransition: withoutTransition, - tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate + tickTextRotate: withoutRotateTickText ? 0 : config.axis_y_tick_rotate, + tickCount: tickCount }, axis = c3_axis($$.d3, axisParams).scale(scale).orient(orient).tickFormat(tickFormat); if ($$.isTimeSeriesY()) { @@ -275,10 +276,10 @@ Axis.prototype.getMaxTickWidth = function getMaxTickWidth(id, withoutRecompute) targetsToShow = $$.filterTargetsToShow($$.data.targets); if (id === 'y') { scale = $$.y.copy().domain($$.getYDomain(targetsToShow, 'y')); - axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true); + axis = this.getYAxis(scale, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, false, true, true, config.axis_y_tick_count); } else if (id === 'y2') { scale = $$.y2.copy().domain($$.getYDomain(targetsToShow, 'y2')); - axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true); + axis = this.getYAxis(scale, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, false, true, true, config.axis_y2_tick_count); } else { scale = $$.x.copy().domain($$.getXDomain(targetsToShow)); axis = this.getXAxis(scale, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, false, true, true); diff --git a/src/c3.axis.js b/src/c3.axis.js index 6d4f7a3..f1853b0 100644 --- a/src/c3.axis.js +++ b/src/c3.axis.js @@ -25,10 +25,11 @@ function c3_axis(d3, params) { var start = domain[0], stop = domain[domain.length - 1]; return start < stop ? [ start, stop ] : [ stop, start ]; } - function generateTicks(scale) { + function generateTicks(scale, count) { var i, domain, ticks = []; if (scale.ticks) { - return scale.ticks.apply(scale, tickArguments); + count = count ? [count] : tickArguments; + return scale.ticks.apply(scale, count); } domain = scale.domain(); for (i = Math.ceil(domain[0]); i < domain[1]; i++) { @@ -81,7 +82,7 @@ function c3_axis(d3, params) { var scale0 = this.__chart__ || scale, scale1 = this.__chart__ = copyScale(); - var ticks = tickValues ? tickValues : generateTicks(scale1), + var ticks = tickValues ? tickValues : generateTicks(scale1, params.tickCount), tick = g.selectAll(".tick").data(ticks, scale1), tickEnter = tick.enter().insert("g", ".domain").attr("class", "tick").style("opacity", 1e-6), // MEMO: No exit transition. The reason is this transition affects max tick width calculation because old tick will be included in the ticks. diff --git a/src/config.js b/src/config.js index aa6e57a..5998c8e 100644 --- a/src/config.js +++ b/src/config.js @@ -124,6 +124,7 @@ c3_chart_internal_fn.getDefaultConfig = function () { axis_y_tick_values: null, axis_y_tick_rotate: 0, axis_y_tick_count: undefined, + axis_y_tick_exact: true, axis_y_tick_time_value: undefined, axis_y_tick_time_interval: undefined, axis_y_padding: {}, @@ -139,6 +140,7 @@ c3_chart_internal_fn.getDefaultConfig = function () { axis_y2_tick_outer: true, axis_y2_tick_values: null, axis_y2_tick_count: undefined, + axis_y2_tick_exact: true, axis_y2_padding: {}, axis_y2_default: undefined, // grid diff --git a/src/core.js b/src/core.js index 7a933d5..a64cc5e 100644 --- a/src/core.js +++ b/src/core.js @@ -525,10 +525,10 @@ c3_chart_internal_fn.redraw = function (options, transitions) { $$.y.domain($$.getYDomain(targetsToShow, 'y', xDomainForZoom)); $$.y2.domain($$.getYDomain(targetsToShow, 'y2', xDomainForZoom)); - if (!config.axis_y_tick_values && config.axis_y_tick_count) { + if (!config.axis_y_tick_values && config.axis_y_tick_count && config.axis_y_tick_exact) { $$.yAxis.tickValues($$.axis.generateTickValues($$.y.domain(), config.axis_y_tick_count)); } - if (!config.axis_y2_tick_values && config.axis_y2_tick_count) { + if (!config.axis_y2_tick_values && config.axis_y2_tick_count && config.axis_y2_tick_exact) { $$.y2Axis.tickValues($$.axis.generateTickValues($$.y2.domain(), config.axis_y2_tick_count)); } diff --git a/src/scale.js b/src/scale.js index 6c4c045..7a495bf 100644 --- a/src/scale.js +++ b/src/scale.js @@ -76,8 +76,8 @@ c3_chart_internal_fn.updateScales = function () { $$.xAxis = $$.axis.getXAxis($$.x, $$.xOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer); $$.subXAxis = $$.axis.getXAxis($$.subX, $$.subXOrient, $$.xAxisTickFormat, $$.xAxisTickValues, config.axis_x_tick_outer); - $$.yAxis = $$.axis.getYAxis($$.y, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, config.axis_y_tick_outer); - $$.y2Axis = $$.axis.getYAxis($$.y2, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, config.axis_y2_tick_outer); + $$.yAxis = $$.axis.getYAxis($$.y, $$.yOrient, config.axis_y_tick_format, $$.yAxisTickValues, config.axis_y_tick_outer, undefined, undefined, config.axis_y_tick_count); + $$.y2Axis = $$.axis.getYAxis($$.y2, $$.y2Orient, config.axis_y2_tick_format, $$.y2AxisTickValues, config.axis_y2_tick_outer, undefined, undefined, config.axis_y2_tick_count); // Set initialized scales to brush and zoom if (!forInit) {