gpt4 book ai didi

javascript - D3 - 将变量传递到 x 刻度

转载 作者:行者123 更新时间:2023-12-03 02:31:02 28 4
gpt4 key购买 nike

我这里有一个代码笔 - 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 属性执行此操作。

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 缩放函数。

最佳答案

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 示例中修改它时,它就起作用了。

关于javascript - D3 - 将变量传递到 x 刻度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48736188/

28 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com