Javascript 每n值显示一个勾号
如何设置轴,使其不显示5或10或任何数量的刻度,而是每n个单位显示一个刻度。在这种情况下,如果数据集如下所示:Javascript 每n值显示一个勾号,javascript,d3.js,charts,Javascript,D3.js,Charts,如何设置轴,使其不显示5或10或任何数量的刻度,而是每n个单位显示一个刻度。在这种情况下,如果数据集如下所示: [2,3,6,7,10,13,17,20] 如果我将其配置为每5步显示一个勾号,则勾号将启用0,5,10,15,20。 如何实现这一目标 这是我正在研究的一个真实的例子 我想在x轴上每20年显示一个记号,所以它不应该是0,10,20,30,…,n,而是0,20,40,60,80,…,n 对于y轴,我需要500k阶跃值,因此它应该是0,500k,1m,1.5m,…,n 更新 我找到了一
[2,3,6,7,10,13,17,20]
如果我将其配置为每5步显示一个勾号,则勾号将启用0,5,10,15,20
。
如何实现这一目标
这是我正在研究的一个真实的例子
我想在x轴上每20年显示一个记号,所以它不应该是0,10,20,30,…,n
,而是0,20,40,60,80,…,n
对于y轴,我需要500k阶跃值,因此它应该是0,500k,1m,1.5m,…,n
更新
我找到了一个简单可行的解决方案。我像往常一样通过`.call(yAxis)调用一个轴,然后在我将它们的值除以所需的步数时,查找创建的记号并检查它们的数据是否有余数。如果没有余数,则我将“不透明度”设置为1,否则通过将“不透明度”设置为0来隐藏它们。以下是一个例子:
yAxisElement
.selectAll('.tick')
.style({
opacity: function (d, i) {
return d % 500000 ? 0 : 1;
}
})
这不是一个理想的解决方案,因为它不能通过值添加现有的中间点,比如在这个图像上,如果我想用0, 15, 30,45等等,只显示/隐藏已经存在的那些。如果我需要为其他值添加勾号,我需要创建一个自定义轴或使用Lars Kotthoff建议的轴。
事实上,我读了你的帖子3次,仍然没有得到你想要的结果^,你能解释得更清楚一点吗?唯一的方法是自己计算刻度值,然后通过.tickValues()
进行设置。