D3-將變量傳遞給x刻度

Question

我在這里有一個Codepen- https ://codepen.io/anon/pen/yvgJKB

我有一個簡單的堆積條形圖。

我想將其變成一個組件，所以我需要傳遞值以使其可重用

x縮放函數返回d.date

let x = d3.scaleBand()
    .domain(dataToStack.map(function(d){
        return d.date;
    }))
    .rangeRound([0,width])
    .padding(0.05);

我想從變量中傳遞“日期”部分

我可以針對欄的x attr進行此操作。

let xAxisValue = 'date'

.attr('x', (d, i) => {
    let link = d.data[xAxisValue];                         
    return x(link)
})

我還需要將此傳遞到x刻度

let x = d3.scaleBand()
    .domain(dataToStack.map(function(d){
        //let link = d.[xAxisValue];                         
        //return x(link)
        return d.date;
    }))
    .rangeRound([0,width])
    .padding(0.05);

相同的方括號在這里不起作用。

如何將xAxisValue傳遞給x縮放函數。

Answer 1

let xAxisValue = 'date';

在第1行中使Codepen樣本正常工作。

接着

let x = d3.scaleBand()
.domain(dataToStack.map(function(d){
    let link = d[xAxisValue];                         
    return link;
    //return d.date;
}))
.rangeRound([0,width])
.padding(0.05);

當我在您的Codepen樣本中修改它時，它就可以工作。