在 this堆积条形图 我添加了一个平分线和一个自定义 x.invert
函数,以便您可以读取每个月的值:
问题是,当我添加此自定义函数时,团队 2 和 3 的矩形不再更新现有的 rect
,而是在您选择不同的类别时从左上角重新绘制条形从选择下拉列表中,我不知道为什么。
删除与 x.invert 函数相关的所有代码会使条形图再次正确更新,因此它可能与 x 域有关,但我不确定。
最佳答案
在绑定(bind)数据时使用关键函数是D3中非常好的做法,这可以确保对象的恒定性。因此,与已接受其他答案中的建议相反,您不应删除它。
无需删除它,只需修复关键功能即可。现在的问题是,因为 key 是......
["Team 1 CC", "Team 2 CC", "Team 3 CC"]
...对于选定的数据集,这...
d.key.split(' ')[0]
..将为每个组返回TEAM
,并且 key 显然不能相同。
所以,就做...
d.key.split(' ')[0] + d.key.split(' ')[1]
或者甚至只是...
d.key.slice(0, -3)
...将返回:TEAM 1
、TEAM 2
和 TEAM 3
。
这是您更新的 Plunker:https://plnkr.co/edit/XCvmDj9a3yF37dzDmA6d?p=preview
关于javascript - 堆积条形图未正确更新 d3js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48425301/