如何在React Native中使用SVG制作圆形图？

jaql4c8m 于 2023-05-18 发布在 React

关注(0)|答案(1)|浏览(125)

我正在尝试在React Native中使用SVG绘制一个圆形图。我想在图表上加一笔。我该怎么做？
是我干的

这就是我想做的。

验证码：

return (
    <View style={{ height: 250, width: 250, backgroundColor: "green" }}>

        <Svg viewBox="0 0 120 120">
            <Circle
                cx="60"
                cy="60"
                r="30"
                fill="transparent"
                stroke="red"
                strokeWidth="60"
                strokeDasharray={(2 * Math.PI * 30 * 75) / 100}
            />
        </Svg>

    </View>
);

react-native

来源：https://stackoverflow.com/questions/76204315/how-can-i-make-a-circular-graph-with-svg-in-react-native

1条答案

按热度按时间

46qrfjad1#

对于添加笔划，我建议使用另一个圆圈。

<View style={{ height: 250, width: 250, backgroundColor: "green" }}>
                    <Svg viewBox="0 0 120 120">
                        <Circle
                            cx="60"
                            cy="60"
                            r="30"
                            fill="transparent"
                            stroke="red"
                            strokeWidth="60"
                            strokeDasharray={(2 * Math.PI * 30 * 75) / 100}
                        />
                        <Circle
                            cx="60"
                            cy="60"
                            r="60"
                            fill="transparent"
                            stroke="black"
                            strokeDasharray={(2 * Math.PI * 60 * 75) / 100}
                            strokeWidth="2"
                        />
                    </Svg>
                </View>

请让我知道，如果这个Answear帮助你。：—）

赞(0）回复(0）举报 2023-05-18

我来回答

如何在React Native中使用SVG制作圆形图？

1条答案

相关问题

热门标签

最新问答