在圆圈内打勾

ket*_*tan -1 html svg

我正在尝试在实心圆圈内创建刻度线。

我做了以下,但看起来并不完美。

<svg height=10 viewBox="0 0 10 10" width=10>
    <g fill="none" stroke="#22AE73" stroke-width="1"></g>
    <circle cx=5 cy=5 fill='#29AB87' r=5 />
    <polyline stroke="#ffffff" stroke-width="2" points="2.5,5.8 4.7,7.9 9.2,2.4 " />
</svg>
Run Code Online (Sandbox Code Playgroud)

任何帮助将不胜感激。

van*_*van 5

您的点数到达了10 10您的视图框的一部分,因此它不适合。您可以将积分更改为较低的值。

或者,这里有一个 svg 可能对你有用,它是基于路径的

<svg width="10px" height="10px" viewBox="0 0 10 10" >
        <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
            <g id="tick">
                <circle id="Oval" fill="#349006" cx="5" cy="5" r="5"></circle>
                <path d="M7.26241838,2.25 L8.35843389,3.34601551 L3.9390165,7.76543289 L3.937,7.763 L3.93041937,7.77093389 L1.65,5.49051452 L2.74601551,4.39449901 L3.932,5.58 L7.26241838,2.25 Z" id="Combined-Shape" fill="#FFFFFF"></path>
            </g>
        </g>
    </svg>
Run Code Online (Sandbox Code Playgroud)