docs(Circle): add stroke-width description (#11728)

packages/vant/src/circle/README.md

@@ -47,6 +47,8 @@ export default {
 
 ### Custom Width
 
+The width of the progress bar is controlled by the `stroke-width` prop, `stroke-width` refers to the width of `path` in SVG, and the default value is `40`.
+
 ```html
 <van-circle
   v-model:current-rate="currentRate"
@@ -56,6 +58,19 @@ export default {
 />
 ```
 
+The unit of `stroke-width` is not `px`, if you want to know the relationship between `stroke-width` and `px`, you can use the following formula to calculate:
+
+```js
+// viewBox size for SVG
+const viewBox = 1000 + strokeWidth;
+
+// The width of the Circle component, the default is 100px
+const circleWidth = 100;
+
+// Final rendered progress bar width (px)
+const pxWidth = (strokeWidth * circleWidth) / viewBox;
+```
+
 ### Custom Color
 
 ```html

packages/vant/src/circle/README.zh-CN.md

@@ -49,7 +49,7 @@ export default {
 
 ### 宽度定制
 
-通过 `stroke-width` 属性来控制进度条宽度。
+通过 `stroke-width` 属性来控制进度条宽度，`stroke-width` 指的是 SVG 中 `path` 的宽度，默认值为 `40`。
 
 ```html
 <van-circle
@@ -60,6 +60,19 @@ export default {
 />
 ```
 
+`stroke-width` 的单位不是 `px`，如果你想知道 `stroke-width` 与 `px` 的换算关系，可以通过如下公式计算：
+
+```js
+// SVG 的 viewBox 大小
+const viewBox = 1000 + strokeWidth;
+
+// Circle 组件的宽度，默认为 100px
+const circleWidth = 100;
+
+// 最终渲染出来的进度条宽度（px）
+const pxWidth = (strokeWidth * circleWidth) / viewBox;
+```
+
 ### 颜色定制
 
 通过 `color` 属性来控制进度条颜色，`layer-color` 属性来控制轨道颜色。