D3中time.scale上的動態tickValues

Question

我在D3中建立了一個圖表，以根據日期時間和支出金額顯示支出，但是我無法在tickValues()上動態設置tickValues()以僅顯示數據點的價格變動。

我的秤設置為：

   var dateScale = d3.time.scale()
        .domain(d3.extent(newData, function(d) { return d.Date; }))
        .range([padding, width - padding]);

    var amountScale = d3.scale.linear()
        .domain([0, d3.max(newData, function(d) { return d.Amount; })])
        .range([window.height - padding, padding]);

    // Define date Axis
    var dateAxis = d3.svg.axis().scale(dateScale)
        .tickFormat(d3.time.format('%a %d %m'))
        .tickSize(100 - height)
        .orient("bottom");

    // Draw date Axis
    svg.append("g")
        .attr({
            "class": "axis date-axis",
            "transform": "translate(" + [0, height -padding] + ")"
        }).call(dateAxis);

    // Define amount Axis
    var amountAxis = d3.svg.axis().scale(amountScale)
        .tickSize(1)
        .orient("left");

    // Draw amount Axis
    svg.append("g")
        .attr({
            "class": "axis amount-axis",
            "transform": "translate(" + padding + ",0)"
        }).call(amountAxis);   

我嘗試設置
dateAxis.tickValues(d3.extent(newData, function(d) { return d.Date; }))
但這只會返回日期軸的最小值和最大值。
另外tickValues()本身不接受newData我還能在這里嘗試什么？

我想實現這一目標：

僅突出顯示與相關數據相關的刻度線。

Answer 1

最后，我從數據中創建了所有日期點的新數組，然后將其傳遞給tickValues()方法。 我的代碼現在是：

var newData = toArray(uniqueBy(data, function(x){return x.Date;}, function(x, y){ x.Amount += y.Amount; return x; }));

    // Create array of data date points
    var tickValues = newData.map(function(d){return d.Date;});

    // Sorting data ascending
    newData = newData.sort(sortByDateAscending);

    var dateScale = d3.time.scale()
        .domain(d3.extent(newData, function(d) { return d.Date; }))
        .range([padding, width - padding]);

    var amountScale = d3.scale.linear()
        .domain([0, d3.max(newData, function(d) { return d.Amount; })])
        .range([window.height - padding, padding]);

    // Define date Axis
    var dateAxis = d3.svg.axis().scale(dateScale)
        .tickFormat(d3.time.format('%d %m %Y'))
        .tickValues(tickValues)
        .orient("bottom");   

所以現在整個圖看起來像：

我發現這個SO（@AmeliaBR）答案解釋了tickValues()函數， 這也是它的文檔 。