Joa*_*edt 5 javascript geometry svg
我在描述这个问题时遇到了麻烦,但是这里有:
我正在尝试创建一个SVG圈子进度条,我找到了一个完美的例子,我想要做什么而没有像snap这样的第三部分库:
http://codepen.io/JMChristensen/pen/Ablch
问题是我在改变中风起源方面遇到了实际问题.正如您所知,如果您尝试一下,原点就在右侧.我需要它来自顶部.
现在,我是一名开发人员,所以我已经尝试过自己,但我不能为我的生活找到方法.如果我更改stroke-dasharray属性,则笔划将与stroke-dashoffset中设置的百分比不匹配.
我理解这一切都归结为使用stroke-dasharray值的数学,但我不太明白该怎么做.
dashoffset的计算方式如下:
var pct = ((100-val)/100)*(Math.PI*(r*2));
Run Code Online (Sandbox Code Playgroud)
并且它与标准dasharray值565.48之间必须存在某种相关性.在任何地方都没有提到它.
将其添加到<circle ...></circle>SVG中的第2个:
transform="rotate(270,100,100)"
Run Code Online (Sandbox Code Playgroud)