本書はCanvas初心者の方が、簡単なアニメーションやゲームアプリなどを作るための基礎知識を習得できることを目標としています。本書内で作るプログラムは図形を表示したり、単純なアニメーションを動かす程度ですが、基本さえ身に付ければ応用することは難しくないでしょう。
本書では、1章から8章まではサンプルコードを用いてCanvasの基本的な機能（API）を説明し、9章から13章は8章までに学んだことの復習・応用として簡単なプログラムを作ります。
本書は以下のような読者を対象としています。
• Canvas未経験の人
• Canvasの理解があいまいな人
• Canvasの復習をしたい人
また、前提として読者は以下の項目を知っていることとします。
• HTMLの書き方
• CSSの書き方
• JavaScriptの構文
• DOM操作の基本
（「はじめに」より抜粋）
[著者]
山下浩平
フリーのプログラマ。
1987年生まれ。神奈川県出身。明治大学卒業後、2010年に東京のIT企業に就職。
2013年に退職し、フリーランスとして活動中。
[目次]
第1章 Canvasを使う前の準備
1.1 はじめてのCanvasプログラム
1.2 canvasの準備処理
1.3 四角形の描画
1.4 座標系
1.5 canvasの準備をすべてJavaScriptで行う
1.6 この章のまとめ
第2章 四角形の描画
2.1 四角形の輪郭線を描く
2.2 四角形を塗りつぶす
2.3 色を変える
2.4 消す
2.5 この章のまとめ
第3章 パスの描画
3.1 パスという考え方
3.2 直線を描く
3.3 複数の直線を描く
3.4 多角形を作る
3.5 自分でstrokeRectを実装
3.6 閉じた図形を塗りつぶす
3.7 パスをリセットして描画を分ける
3.8 線や塗りつぶしの色
3.9 円弧を描く
3.10 この章のまとめ
第4章 スタイル
4.1 線の色と塗りつぶし色
4.2 グラデーション
4.3 線の太さ
4.4 影
4.5 透明度
4.6 スタイルの保存と復元
4.7 この章のまとめ
第5章 文字列の描画
5.1 文字列を描く
5.2 フォント
5.3 表示位置
5.4 スタイル
5.5 この章のまとめ
第6章 画像の描画
6.1 画像を読み込む
6.2 画像を描く
6.3 図形の背景に画像を描く
6.4 この章のまとめ
第7章 図形の変形
7.1 平行移動
7.2 回転
7.3 拡大
7.4 変形処理の組み合わせ
7.5 変形の保存と復元
7.6 この章のまとめ
第8章 アニメーション
8.1 アニメーションの原理
8.2 setIntervalでアニメーション
8.3 いろいろなアニメーション
8.4 この章のまとめ
第9章 背景画像を作る
9.1 canvasは背景画像としても使える
9.2 ランダムに線を引く
9.3 ランダムに三角形を描く
9.4 ランダムに円を描く
9.5 この章のまとめ
第10章 お絵描きアプリを作る
10.1 マウスで線を引く
10.2 タッチイベントにも対応
10.3 スタイルを変更できるようにする
10.4 この章のまとめ
第11章 Canvasでボタンを装飾
11.1 canvas要素を他のDOM要素に重ねる
11.2 canvasで装飾する
11.3 アニメーション
11.4 この章のまとめ
第12章 アナログ時計を作る
12.1 HTML準備
12.2 数字の表示
12.3 時計の針を作る
12.4 針をアニメーションさせる
12.5 この章のまとめ
第13章 花火を作る
13.1 HTML準備
13.2 火花オブジェクトを作る
13.3 花火の描画と更新
13.4 クリックしたら花火を打ち上げる
13.5 この章のまとめ
※本書はKindle版電子書籍でのみ発売されている書き下ろしです。
※白またはセピア（Kindle for PC/Macでは白のみ）の背景色で閲覧してください。
本書では、1章から8章まではサンプルコードを用いてCanvasの基本的な機能（API）を説明し、9章から13章は8章までに学んだことの復習・応用として簡単なプログラムを作ります。
本書は以下のような読者を対象としています。
• Canvas未経験の人
• Canvasの理解があいまいな人
• Canvasの復習をしたい人
また、前提として読者は以下の項目を知っていることとします。
• HTMLの書き方
• CSSの書き方
• JavaScriptの構文
• DOM操作の基本
（「はじめに」より抜粋）
[著者]
山下浩平
フリーのプログラマ。
1987年生まれ。神奈川県出身。明治大学卒業後、2010年に東京のIT企業に就職。
2013年に退職し、フリーランスとして活動中。
[目次]
第1章 Canvasを使う前の準備
1.1 はじめてのCanvasプログラム
1.2 canvasの準備処理
1.3 四角形の描画
1.4 座標系
1.5 canvasの準備をすべてJavaScriptで行う
1.6 この章のまとめ
第2章 四角形の描画
2.1 四角形の輪郭線を描く
2.2 四角形を塗りつぶす
2.3 色を変える
2.4 消す
2.5 この章のまとめ
第3章 パスの描画
3.1 パスという考え方
3.2 直線を描く
3.3 複数の直線を描く
3.4 多角形を作る
3.5 自分でstrokeRectを実装
3.6 閉じた図形を塗りつぶす
3.7 パスをリセットして描画を分ける
3.8 線や塗りつぶしの色
3.9 円弧を描く
3.10 この章のまとめ
第4章 スタイル
4.1 線の色と塗りつぶし色
4.2 グラデーション
4.3 線の太さ
4.4 影
4.5 透明度
4.6 スタイルの保存と復元
4.7 この章のまとめ
第5章 文字列の描画
5.1 文字列を描く
5.2 フォント
5.3 表示位置
5.4 スタイル
5.5 この章のまとめ
第6章 画像の描画
6.1 画像を読み込む
6.2 画像を描く
6.3 図形の背景に画像を描く
6.4 この章のまとめ
第7章 図形の変形
7.1 平行移動
7.2 回転
7.3 拡大
7.4 変形処理の組み合わせ
7.5 変形の保存と復元
7.6 この章のまとめ
第8章 アニメーション
8.1 アニメーションの原理
8.2 setIntervalでアニメーション
8.3 いろいろなアニメーション
8.4 この章のまとめ
第9章 背景画像を作る
9.1 canvasは背景画像としても使える
9.2 ランダムに線を引く
9.3 ランダムに三角形を描く
9.4 ランダムに円を描く
9.5 この章のまとめ
第10章 お絵描きアプリを作る
10.1 マウスで線を引く
10.2 タッチイベントにも対応
10.3 スタイルを変更できるようにする
10.4 この章のまとめ
第11章 Canvasでボタンを装飾
11.1 canvas要素を他のDOM要素に重ねる
11.2 canvasで装飾する
11.3 アニメーション
11.4 この章のまとめ
第12章 アナログ時計を作る
12.1 HTML準備
12.2 数字の表示
12.3 時計の針を作る
12.4 針をアニメーションさせる
12.5 この章のまとめ
第13章 花火を作る
13.1 HTML準備
13.2 火花オブジェクトを作る
13.3 花火の描画と更新
13.4 クリックしたら花火を打ち上げる
13.5 この章のまとめ
※本書はKindle版電子書籍でのみ発売されている書き下ろしです。
※白またはセピア（Kindle for PC/Macでは白のみ）の背景色で閲覧してください。
