无法在d3.js中生成某些值的弧，

Question

I am using d3.js to generate a circle kind of graph. My graph has three layers background,midground and foreground. I have a function called call for foreground and midground layer.

I am able to generate the arc for values till .96 but if it goes beyond that .97, .98, .99 and 1.0 arc are getting collapsed.

midground.transition()
      .duration(750)
      .call(arcTween, 0. * τ);

foreground.transition()
      .duration(750)
      .call(arcTween, 0. * τ);

I am new to d3.js and svg kindly help with this. I have provided the jsfiddle link as well. http://jsfiddle.net/Lxnymj28/1/

Answer 1

This setting is messing up the arc calculation:

.cornerRadius(outerRadius - innerRadius)

If you remove the cornerRadius, everything draws fine .

EDITS

Did some research, this was a bug in the library , fixed back in October, 2015. You are using way out of date software.

If you use the latest version of d3.js version 3, everything works fine.

New fiddle here .