javascript - SVG 使虚线变为实线

Question

我有一个通过 JS 和 CSS 制作动画的 SVG 元素； SVG 是从 Illustrator 导入的。我的动画运行得很好，所以这更像是一个 SVG(也可能是 CSS)问题。

SVG 的一小部分有一些虚线；目标是到处都有规则的实线。理想情况下，我想单独通过 CSS 来实现这一点，但如果更改 SVG 元素是唯一的选择，那就这样吧:

虚线之一:

<line xmlns="http://www.w3.org/2000/svg" class="st10" x1="538.7" y1="147.6" x2="633.9" y2="104.3"/>

和 st10 类:

.st10{fill:none;stroke:#000000;stroke-width:0.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2.9444,2.9444;}

CodePen 链接:https://codepen.io/sonofkyuss2401/pen/mqQJra

Answer 1

从 st10 类中删除 stroke-dasharray 属性。然后这条线将是实心的，您可以根据需要为其设置动画。