我敢肯定，對于知道的人來說svg，這是一個簡單的問題，但是，這不是我，我正在轉換一個現有的程式，該程式使用svg但無法訪問原始程式員提出的問題。
我有以下函式來渲染一個多邊形，每秒旋轉一次。我希望它只渲染原始多邊形并停止。如果我animateTranform完全洗掉元素，我會得到向量，但不會設定為我想要的位置（以度為單位）。我可以將to=行更改為只包含 0而不是， 360但這似乎很奇怪。
如果有人能建議如何使這更簡單且不動，我將不勝感激。謝謝
export function SecondsArrow({deg}) {
return <polygon points="25,26 25,22" className="Clock__seconds">
<animateTransform
attributeName="transform"
begin="0s"
dur="60s"
type="rotate"
from={`${deg} 25 25`}
to={`${deg 360} 25 25`}
repeatCount="indefinite"
/>
</polygon>
}
已批準答案的引號中有一個小錯誤，因此我也在這里發布了修復程式。
export function SecondsArrow({ deg }) {
return (
<polygon
points="25,26 25,22"
transform={`rotate(${deg} 25 25)`}
className="Clock__seconds"
>
/>)
</polygon>
);
}
uj5u.com熱心網友回復：
如果要保持箭頭指向的方向為deg，請transform="rotate(${deg} 25 25)"在多邊形中包含一個屬性。
export function SecondsArrow({deg}) {
return <polygon
points="25,26 25,22"
transform={`rotate(${deg} 25 25)`}
className="Clock__seconds">
/>
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/397496.html
上一篇：rid3、shadow-cljs和拖動；開發和生產中的不同行為
下一篇：SVG背景透明度