アニメーションなどのHTML5コンテンツを手軽に制作できるオーサリングツール「Adobe Edge Animate」。前回は、Edge Animateで制作したトップバナーを既存のサイトに埋め込む方法を紹介しました。
今回は、Edge Animateでグラフアニメーションを制作します。Edge Animateを使えば、簡単にリッチなグラフアニメーションを作れます。また、PHPで作成した既存のページにアニメーションを埋め込んで、グラフの値を動的に変化させる方法も解説します。
完成サイトは以下のリンクを参照してください。
完成サイト。画像クリックでサンプルを表示します |
グラフアニメーションを制作する
最初に、Edge Animateで元になるグラフアニメーションを制作します。
Step 1. ステージを設定する
Edge Animateを起動し、新規プロジェクトを作成しましょう。ステージの大きさは、幅880×高さ320pxです。
ステージの大きさ |
ステージの色は白(#ffffff)に設定します。
ステージの色 |
...続きはこちら >>
http://ascii.jp/elem/000/000/839/839892/
─情報元:Edge Animateで作るHTML5リッチコンテンツ入門サイト様─