d3js Сетка за пределами области диаграммы

Question

Я создал диаграмму с библиотекой d3js.

Есть ли способ, чтобы линии сетки перемещались за пределы области графика, как это показано на изображении?

Функция для создания оси:

this.axis = function (scale, size) { 
    return d3.svg.axis() 
     .scale(scale) 
     .outerTickSize(0) 
     .innerTickSize(-size) 
     .tickPadding(10); 
}; 

Добавление диаграммы в SVG:

var line = d3.svg.line() 
    .x(function (d) { 
     return x(d.x); 
    }) 
    .y(function (d) { 
     return y(d.y); 
    }) 
    .interpolate('monotone'); 

svg.append('g') 
    .attr('class', 'x axis') 
    .attr('transform', 'translate(0, ' + (height - 35) + ')') 
    .call(xAxis); 

svg.append('g') 
    .attr('class', 'y axis') 
    .attr('transform', 'translate(40, 0)') 
    .call(yAxis); 

var series = svg.selectAll('.quote') 
    .data(points) 
    .enter() 
    .append('g') 
    .attr('class', 'quote'); 

series.append('path') 
    .attr('class', function(d) { return 'line ' + d.name; }) 
    .attr('d', function(d) { return line(d.values); }); 

Answer 1

Вы можете позвонить nice() по й шкале, используемой для построения XAxis

var x = d3.scale.linear() 
    .domain([0, xMax]) 
    .range([0, width]) 
    .nice();