tweenjs以前の記事、javascriptで遊ぼうの続きです。やっていることは星を描いて回す、という単純な動作なんですが、もっと複雑なことをするにしても、分割していけば基本はこんな感じになると思います。今日はこういう描画に関しての基本的なおさらいをしてみます。基本としてStageと呼ばれる領域につらつらと作品を描く感じです。その作品を描く為にはいろんな道具やアイテムを使う必要があるんですが、その中でも今回は特に、ShapeGraphicsの2つにフォーカスを当ててみようと思います。いうのって、いかにしてイメージを持てるかで理解が変わると思うんです。筆みたいな感じで捉えてます。(厳密に言うとちょっと違いますが)この紙(Shape)には、筆(Graphics)がセットになっています(という設定)。筆を使って描きたい図形を描いて塗りつぶしたり、線を描いたりすることでそれが紙に反映されます。その紙を最初のStageと呼ばれる描画領域の上にぺたっと張り付けていくことで作品が出来上がっていきます。したがって、イメージ的にこんな感じかなと。筆(Graphics)は紙(Shape)にセットすることができる、紙(Shape)に備え付けてある筆(Graphics)を使うこともできる。ステージには複数の紙(Shape)を置くことができる。どんなにすごい作品であっても、一つ一つ切り分けて行けば、最終的にはこの概念になります。今回はShapeにフォーカスを当てましたけど、実際ステージに置けるアイテムはもっとたくさんあります。画像だったり、文字だったりも。置いたアイテムは自在に動かす事もできます。次は、その動かす部分に触れてみようと思います(予定)。あ、前回のサンプル、GitHubにあげてます。開発SocialFacebookGoogle+RSSTwitter毎日をより便利に。