什麼是處理支柱變化的SVG動畫的最佳方式？

MyGraphThingy，它充當實際元素的容器。它將渲染成一個svg元素，裏面有孩子。

MyGraphElement，呈現爲一個圓圈。

在第三部件render方法返回以下結果：

<MyGraphThingy><MyGraphElement position={this.getPosition()/></MyGraphThingy>

其中爲getPosition（）取決於部件的狀態。所以如果組件的相關狀態發生變化，SVG圈的位置應該改變。

問題是，實現動畫的最佳方法是什麼，以便不是從一個地方跳到另一個地方，而是平穩過渡？

圓圈只是一個例子，真正的用例涉及動畫幾乎所有的SVG屬性。

不，我不想依賴於D3，是的，我希望在MyGraphThingy中處理此屬性更改而不是使用像react-animate這樣的模塊。我應該使用一些生命週期方法，但如何實現實際的動畫是我想知道的。

2015-10-08 Seppo420

-1

看一看網絡動畫：

2015-10-08 12:04:05

不知道如何做到這一點連同陣營合作。 – Seppo420

網頁動畫並未與反應或任何其他框架綁定。這只是一種動畫元素屬性和屬性的方法。 animate是一個可以在任何元素上調用的函數。 f1。在changePosition（）你可以做yourCircle.animate（...）。如果你提供更多的代碼，我可以告訴你更多關於放置動畫的位置。 –

回答