Canvasでローディングアイコンを作ろう
(全7回)
HTML5のCanvasを使って、ローディングアイコンを実装していく方法について見ていきます。
このレッスンでは HTML5 / CSS / CSS3 / JavaScript を使用しています。
-
#01 ローディングアイコンを作ろう (02:54) 無料公開中
- index.htmlの作成
- main.jsの作成
-
#02 stage要素を取得しよう (02:43) 無料公開中
- contextオブジェクトの取得
-
#03 座標系をわかりやすくしよう (02:19)
- 座標系の描画
-
#04 線を描画して傾けてみよう (02:12)
- rotate()
-
#05 線を回転させてみよう (02:22)
- setTimeout()
-
#06 三角関数の仕組みを理解しよう (01:50)
- 三角関数の説明
-
#07 三角関数を使って描画してみよう (01:40)
- Math.cos()
- Math.sin()
