###SVGアニメーションを滑らかに表示する
http://www.tam-tam.co.jp/tipsnote_sample/uenaka/151207/index2.html
こちらのsvgアニメーションのように滑らかに処理をしたいです。
コードの内容はほぼそのままでvaluesの値のみイラレから書き出した実装したい形に書き換えたのですがコマ送りのような描画しかできず滑らかなアニメーションになりません。
一通りSVGについて調べましたが基本的な部分が分かってない節があるので、解決方法と合わせてなぜこのようになるかもご教授頂けると助かります。
宜しくお願い致します。
###該当のソースコード
html
1<svg fill="#00266D" x="0px" y="0px" width="1000px" height="1000px"> 2<path> 3<animate repeatCount="indefinite" dur="3s" attributeName="d" attributeType="XML" values=" 4M892.5,334.5c0,0-208.807-68.98-407.822,0s-418.178,0-418.178,0 5 v-183h826V334.5z; 6M892.5,334.5c0,0-184.131-154.046-407.822,0 7 c-223.691,154.046-418.178,0-418.178,0v-183h826V334.5z"> 8</animate> 9</path> 10</svg>
###試したこと
アトリビュートにvaluesではなくfromとtoを使った場合でも同じようになりました。
###補足情報
使用ブラウザはChromeの最新版です。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。