質問編集履歴
3
タイトル変更
test
CHANGED
@@ -1 +1 @@
|
|
1
|
-
SVGのパスを基にアニメーション処理を行いたい
|
1
|
+
JavaScriptでSVGのパスを基にアニメーション処理を行いたい
|
test
CHANGED
File without changes
|
2
URLリンクの追加
test
CHANGED
File without changes
|
test
CHANGED
@@ -1,10 +1,10 @@
|
|
1
1
|
###前提・実現したいこと
|
2
2
|
|
3
|
-
SVGのパスを基に、anime-jsライブラリを使って要素に対してアニメーション処理を行いたいと思っています。
|
3
|
+
SVGのパスを基に、[anime.js](http://anime-js.com/)ライブラリを使って要素に対してアニメーション処理を行いたいと思っています。
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
-
https://codepen.io/juliangarnier/pen/dXNgVB
|
7
|
+
[Follow SVG Path - anime.js](https://codepen.io/juliangarnier/pen/dXNgVB)
|
8
8
|
|
9
9
|
このページを参考にコードを書いたのですが、JavaScriptの方に上手くパスを渡せていないのか、アニメーションが動きません。
|
10
10
|
|
@@ -108,4 +108,4 @@
|
|
108
108
|
|
109
109
|
###補足情報(言語/FW/ツール等のバージョンなど)
|
110
110
|
|
111
|
-
anime.jsライブラリを使用しています。
|
111
|
+
[anime.js](http://anime-js.com/)ライブラリを使用しています。
|
1
一部タグの閉じ忘れを修正
test
CHANGED
File without changes
|
test
CHANGED
@@ -38,7 +38,9 @@
|
|
38
38
|
|
39
39
|
<path fill="none" stroke="black" stroke-width="10"
|
40
40
|
|
41
|
-
d= "m100,100 h100 v 100 h -100 v -100 z">
|
41
|
+
d= "m100,100 h100 v 100 h -100 v -100 z"></path>
|
42
|
+
|
43
|
+
</svg>
|
42
44
|
|
43
45
|
|
44
46
|
|