存在过渡时,如何调整d3轴属性? [英] How to tweak d3 axis attributes when transition is present?
问题描述
我正在使用d3轴组件,但是在绘制之后我想对其进行一些调整.具体来说,我想通过向文本元素添加转换并还将text-anchor属性从"middle"设置为"end"来旋转文本标签.
I'm using the d3 axis component but I want to tweak a few things after it is drawn. Specifically I would like to rotate the text labels by adding a transform to the text elements and also setting the text-anchor attribute from "middle" to "end".
我遇到的问题是,作为过渡的一部分,d3代码似乎是异步设置了text-anchor属性.当我在代码中将值设置为"end"时,随后在运行过渡时将其设置回"middle".
The problem I'm hitting is that the text-anchor attribute seems to be set asynchronously by the d3 code as part of the transition. When I set the value to "end" in my code it subsequently gets set back to "middle" when the transition runs.
如果我等到过渡结束再进行更改,它会显得很不稳定.我想知道的是,是否有一种方法可以将自己插入到绘制和转换轴的过程中,以便使用我的text-anchor值代替默认值?
If I wait until transition end before making my change it's going to look choppy. What I'm wondering is if there is a way to insert myself into the process of drawing and transitioning the axis such that my text-anchor value will be used instead of the default one?
推荐答案
I believe this constitutes a bug in the axis component, so I've created a pull request to update label attributes immediately rather than as part of the axis transition. The text element's text-anchor attribute can't be interpolated, so there's no reason to defer the update to the transition, and setting it immediately makes it easy for you to fix it using post-selection.
另一种解决方法是扩展轴组件以支持刻度样式的不同样式.这样,您就无需使用后选择功能,因此与轴过渡没有冲突.
An alternate fix would be to extend the axis component to support different styles of tick labeling. This way, you wouldn't need to use post-selection, so there's no conflict with the axis transition.
这篇关于存在过渡时,如何调整d3轴属性?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!