简体   繁体   English

d3条形图的转换被反转

[英]d3 Transition for Bar Graph is Reversed

I am new to coding in general but javascript is a little but more challenging to me than most. 我是一般的编码新手,但javascript有点但对我来说比大多数人更具挑战性。 I am currently building a d3.js Bar Chart and wanted a transition on load for the bars. 我目前正在构建一个d3.js条形图,并希望在条形图上加载转换。 When I put in the transition code it always does it in reverse and all tutorials online are not helpful for the type of data I am using of too complicated for me to understand. 当我输入转换代码时,它总是以相反的方式执行它,并且所有在线教程对我使用的数据类型都没有帮助,这对我来说太复杂了。 Here is the code I made so far: http://pastebin.com/dW1x81WT 这是我到目前为止编写的代码: http//pastebin.com/dW1x81WT

Please help me with how to make it transition properly. 请帮助我如何正确过渡。 I am very new to coding and d3 graphs expecially. 我非常擅长编码和d3图表。

Is this what you want? 这是你想要的吗? https://jsfiddle.net/gerardofurtado/4un5zgsa/ https://jsfiddle.net/gerardofurtado/4un5zgsa/

A D3 transition goes from the original value to the final value. D3转换从原始值转变为最终值。 So, you have to set the bars width initially to 0: 因此,您必须将条形宽度最初设置为0:

.attr("width", 0)

And then to the final value after, the transition() : 然后到最后一个值, transition()

.attr("width", function(d) { return widthScale(d); })

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM