如何使用 SVG 创建一个圆

在 SVG 中，我们可以使用 <circle> 元素来创建一个圆形。

圆形的基本参数包括：

• 圆心坐标：cx 和 cy
• 半径：r

代码示例

下面是创建一个圆形的示例代码：

<svg width="100" height="100">
  <circle cx="50" cy="50" r="40" fill="red" />
</svg>

在上面的代码中：

• cx="50" cy="50" 表示圆心坐标为 (50, 50)
• r="40" 表示圆的半径为 40
• fill="red" 表示圆的填充色为红色

圆形的属性列表

下面是 <circle> 元素的属性列表：

属性|描述 -|- cx|定义圆心的 x 坐标。在 SVG 中，x 轴是向右延伸的。 cy|定义圆心的 y 坐标。在 SVG 中，y 轴是向下延伸的。 r|定义圆的半径。必须是非负数。 fill|定义填充颜色。可以使用颜色名称、十六进制值或 rgb 值。默认值是黑色。 stroke|定义边框颜色。可以使用颜色名称、十六进制值或 rgb 值。默认值是无边框。 stroke-width|定义边框宽度。必须是非负数。默认值是 1。 stroke-opacity|定义边框透明度。值的范围是 0 到 1。默认值是 1。 fill-opacity|定义填充透明度。值的范围是 0 到 1。默认值是 1。

更多关于 <circle> 元素的使用方法，可以参考 https://developer.mozilla.org/zh-CN/docs/Web/SVG/Element/circle。