使用 svg 和 react 的饼图
piechart using svg and react
我使用本教程中的 svg 模式在 React 中创建了一个饼图 https://www.smashingmagazine.com/2015/07/designing-simple-pie-charts-with-css/
四件我有
所有四件作品：
stroke-dasharray: 25, 100;
对于每件作品，我还有：
stroke-dashoffset: 0;,
stroke-dashoffset: -25;,
stroke-dashoffset: -50; 和
stroke-dashoffset: -75;
问题是第一块和最后一块之间有间隙，所以这些块没有完全填满圆圈。
我通过查看这个类似的帖子找到了答案
原来我的半径是16整圆超过了100%。设置 stroke-dasharray: 100,53 并将我的半径除以 1.0053 很有帮助。
我使用本教程中的 svg 模式在 React 中创建了一个饼图 https://www.smashingmagazine.com/2015/07/designing-simple-pie-charts-with-css/
四件我有
所有四件作品：
stroke-dasharray: 25, 100;
对于每件作品，我还有：
stroke-dashoffset: 0;,
stroke-dashoffset: -25;,
stroke-dashoffset: -50; 和
stroke-dashoffset: -75;
问题是第一块和最后一块之间有间隙，所以这些块没有完全填满圆圈。
我通过查看这个类似的帖子找到了答案
原来我的半径是16整圆超过了100%。设置 stroke-dasharray: 100,53 并将我的半径除以 1.0053 很有帮助。