Css 在svg中悬停时完成圆的周长

我是trynna所做的是在svg标记的悬停处完成一个圆圈的半划

<div class="wrapper">
<div class="center">    
  <svg class="center" xmlns="http://www.w3.org/2000/svg">
  <g id="shap">
 <circle class="path-1" cx="65" cy="70" r=63 fill="none" stroke-width="3" stroke="#fff" />
    </g>

  </svg>
</div>
</div>

像这样吗

svg#shap{
笔划阵列：200px；
行程偏移：0%；
过渡：全部400ms；
}
svg：悬停#形状{
笔划阵列：400px；
行程偏移：0%；
}

---

10/10比我的方法好得多。我正在处理一个onmouseover事件，但是伪类绝对是一个不错的选择。