const scaleX = d3.scaleTime() .domain([ min, max ]) .range([0, width - paddings.left - paddings.right]) .nice() const periodLength = max.getFullYear() - min.getFullYear() // in years const quaters = { 0: 'I', 3: 'II', 6: 'III', 9: 'IV' } const getLabelFormat = d => { if (periodLength > 2) { return d.getFullYear() } else { return `${d.getFullYear()} - ${quaters[d.getMonth()]}` } } let tickFrequency = [10] if (periodLength < 10) { if (periodLength > 2) { tickFrequency = [d3.timeYear.every(1)] } else { tickFrequency = [d3.timeMonth.every(3)] } } const axisX = d3.axisBottom(scaleX) .tickArguments(tickFrequency) .tickFormat(getLabelFormat)