How to display the value for the final tick on the axis in D3?

Question

I use d3.time.scale to generate the x axis, and the area varies from 1980 to 2013 (year). However, the checkmark value is displayed only until 2012, and not until 2013.

I tried .ticks (), but the last tick value is not displayed until the number of ticks is 25 ...

Although I can add the final value by manually increasing the domain until 2014, is there a way to show the tick value for the last tick?

xAxis = d3.svg.axis()
        .scale(xScale).tickSize(20)

var maxYear = format.parse('2014')

xScale = d3.time.scale().domain([min,max])
    .range([100,width-200])    //domain = [1980 ~ 2013] 


var min = d3.min(data, function(d) {
    return d.Year;              // + operator converts string to number.
})

var max = d3.max(data, function(d) {
    return d.Year;
})

Thanks in advance.

Answer 1

Have you tried using .nice()?

https://github.com/mbostock/d3/wiki/Time-Scales#nice

This should complete the task:

xScale = d3.time.scale().domain([min,max])
    .range([100,width-200])    //domain = [1980 ~ 2013]
    .nice()