score:2

Accepted answer

I've found a better solution.

Instead of playing with the scale attribute I've added 

.attr("d", pathArc.innerRadius(60 * ((i*0.1) + 1)), pathArc.outerRadius(60 * ((i*0.1) + 1) + 10))

to the return of the arcFunction.

See the modified jsfiddle

https://jsfiddle.net/szada3/tu6d7wzc/13/

Result:

enter image description here

score:1

Manipulate with i in arcFunction and arcFunction2:

.attr("transform", "scale(1." + i*3 + ")");

https://jsfiddle.net/szada3/tu6d7wzc/9/

score:1

You have to change the scaling in arcFunction to add some space between the rings (just be careful that (i+5) < 10)

.attr("transform", "scale(1." + (i+5) + ")");

You should also change the size of the ring like that :

 .outerRadius((width + 200) / 5 + 2);

See : https://jsfiddle.net/v1wh8y09/


Related Query

More Query from same tag