プログラミングHTML5 Canvas
プログラミング HTML5 Canvas ―ウェブ・モバイル・ゲーム開発者のためのアプリケーション開発ガイド
オライリー・ジャパン
著者：David Geary
訳者：永井勝則
はじめに
1章 基礎
1.1 canvas要素
1.1.1 canvas要素のサイズと描画サーフェイスのサイズ
1.1.2 Canvas API
1.2 Canvasコンテキスト
1.2.1 2dコンテキスト
1.2.2 キャンバス状態の保存と復元
1.3 本書で標準とするサンプル
1.4 スタート
1.4.1 仕様
1.4.2 ブラウザ
1.4.3 コンソールとデバッガ
1.4.4 パフォーマン
1.5 基本的な描画操作
1.6 イベント処理
1.6.1 マウスイベント
1.6.2 キーボードイベント
1.6.3 タッチイベント
1.7 描画サーフェイスの保存と復元
1.8 キャンバスでのHTML要素の使用
1.8.1 目に見えないHTML要素
1.9 キャンバスの印刷
1.10 オフスクリーンキャンバス
1.11 数学の速習
1.11.1 代数方程式を解く
1.11.2 三角関数
1.11.3 ベクトル
1.11.4 計測単位を利用して方程式を導き出す
1.12 まとめ
2章 描画
2.1 座標システム
2.2 描画モデル
2.3 矩形の描画
2.4 カラーと透明度
2.5 グラデーションとパターン
2.5.1 グラデーション
2.5.2 パターン
2.6 シャドウ
2.6.1 内側シャドウ
2.7 パスとストローク、塗り
2.7.1 パスとサブパス
2.7.2 カットアウト
2.8 線
2.8.1 線とピクセル境界
2.8.2 グリッドの描画
2.8.3 軸の描画
2.8.4 ラバーバンドを使った線の描画
2.8.5 破線の描画
2.8.6 CanvasRenderingContext2Dの拡張による破線の描画
2.8.7 ラインキャップと接合
2.9 円弧と円
2.9.1 arc()メソッド
2.9.2 ラバーバンドを使った円の描画
2.9.3 arcTo()メソッド
2.9.4 ダイヤルゲージ
2.10 ベジェ曲線
2.10.1 ２次曲線
2.10.2 ３次曲線
2.11 多角形
2.11.1 Polygonオブジェクト
2.12 高度なパス操作
2.12.1 多角形のドラッグ
2.12.2 ベジェ曲線の編集
2.12.3 パスのビューへのスクロール
2.13 変換
2.13.1 移動と拡大縮小、回転
2.13.2 カスタム変換
2.14 合成
2.14.1 合成に関する物議
2.15 クリッピング領域
2.15.1 クリッピング領域を使った消去
2.15.2 クリッピング領域を使ったテレスコーピング
2.16 まとめ
3章 テキスト
3.1 テキストのストロークと塗り
3.2 fontプロパティの設定
3.3 テキストの配置
3.3.1 水平方向と垂直方向の配置
3.3.2 テキストのセンター揃え
3.3.3 テキストの計測
3.3.4 軸のラベル付け
3.3.5 ダイヤルのラベル付け
3.3.6 円弧に沿ったテキストの描画
3.4 テキスト制御の実装
3.4.1 テキストカーソル
3.4.2 キャンバスでのテキスト行の編集
3.4.3 段落
3.5 まとめ
4章 イメージとビデオ
4.1 イメージの描画
4.1.1 イメージのキャンバスへの描画
4.1.2 drawImage()メソッド
4.2 イメージの拡大縮小
4.2.1 キャンバス境界外でのイメージの描画
4.3 キャンバスのキャンバスへの描画
4.4 オフスクリーンキャンバス
4.5 イメージ操作
4.5.1 イメージデータへのアクセス
4.5.2 イメージデータの変更
4.6 イメージのクリッピング
4.7 イメージのアニメーション
4.7.1 オフスクリーンキャンバスを使ったアニメーション
4.8 セキュリティ
4.9 パフォーマンス
4.9.1 drawImage(HTMLImage)とdrawImage(HTMLCanvas)とputImageData()
4.9.2 キャンバスへのキャンバスの描画とイメージの描画、拡大縮小する場合としない場合
4.9.3 イメージデータのループ処理
4.10 虫めがね
4.10.1 オフスクリーンキャンバスの使用
4.10.2 ファイルシステムからのイメージのドロップを受け取る
4.11 ビデオの処理
4.11.1 ビデオ形式
4.11.2 ビデオのキャンバスでの再生
4.11.3 ビデオ処理
4.12 まとめ
5章 アニメーション
5.1 アニメーションループ
5.1.1 requestAnimationFrame()メソッド：フレームレートはブラウザに設定させる
5.1.2 Internet Explorer
5.1.3 ポータブルなアニメーションループ
5.2 フレームレートの算出
5.3 別のフレームレートで作業を予定化する
5.4 背景の復元
5.4.1 クリッピング
5.4.2 ブリット
5.5 ダブルバッファリング
5.6 時間ベースのモーション
5.7 背景のスクロール
5.8 視差
5.9 ユーザージェスチャ
5.10 時限的なアニメーション
5.10.1 ストップウォッチ
5.10.2 アニメーションタイマー
5.11 アニメーションのベストプラクティス
5.12 まとめ
6章 スプライト
6.1 スプライトの概要
6.2 ペインター
6.2.1 ストロークと塗りペインター
6.2.2 イメージペインター
6.2.3 スプライトシートペインター
6.3 スプライトのビヘイビア
6.3.1 ビヘイビアを組み合わせる
6.3.2 時限的なビヘイビア
6.4 スプライトアニメータ
6.5 スプライトベースのアニメーションループ
6.6 まとめ
7章 物理演算
7.1 重力
7.1.1 落下
7.1.2 弾の軌道
7.1.3 振り子
7.2 時間のワープ
7.3 タイムワープ関数
7.4 モーションのワープ
7.4.1 リニアモーション：加速しない
7.4.2 イーズイン：徐々に加速
7.4.3 イーズアウト：徐々に減速
7.4.4 イーズインしてイーズアウト
7.4.5 弾性と跳ね返り
7.5 アニメーションのワープ
7.6 まとめ
8章 衝突判定
8.1 境界領域
8.1.1 矩形の境界領域
8.1.2 円形の境界領域
8.2 壁からの跳ね返り
8.3 レイキャスティング
8.3.1 微調整
8.4 分割軸原理（SAT）と最小並進ベクトル（MTV）
8.4.1 SATによる衝突判定
8.4.2 最小並進ベクトルを使った衝突へのリアクション
8.5 まとめ
9章 ゲーム開発
9.1 ゲームエンジン
9.1.1 ゲームループ
9.1.2 イメージのロード
9.1.3 マルチトラックサウンド
9.1.4 キーボードのイベント
9.1.5 ハイスコア
9.1.6 ゲームエンジンの全コード
9.2 アンゲーム
9.2.1 アンゲームの HTML
9.2.2 アンゲームのゲームループ
9.2.3 アンゲームのロード
9.2.4 一時停止
9.2.5 キーリスナー
9.2.6 ゲームオーバーとハイスコア
9.3 ピンボールゲーム
9.3.1 ゲームループ
9.3.2 ボール
9.3.3 重力と摩擦
9.3.4 フリッパーの動き
9.3.5 キーボードのイベントの処理
9.3.6 衝突判定
9.4 まとめ
10章 カスタムコントロール
10.1 角丸矩形
10.2 プログレスバー
10.3 スライダー
10.4 イメージパンナー
10.5 まとめ
11章 モバイル
11.1モバイルのビューポート
11.1.1 viewportメタタグ
11.2 メディアクエリ
11.2.1 メディアクエリとCSS
11.2.2 JavaScriptを使ったメディア変更へのリアクション
11.3 タッチイベント
11.3.1 タッチイベントオブジェクト
11.3.2 タッチリスト
11.3.3 タッチオブジェクト
11.3.4 タッチイベントとマウスイベントのサポート
11.3.5 ピンチ＆ズーム
11.4 iOS
11.4.1 アプリケーションアイコンとスタートアップイメージ
11.4.2 iOSアプリケーションアイコンとスタートアップイメージ向けのメディアクエリ
11.4.3 ブラウザのクロムのないフルスクリーン表示
11.4.4 アプリケーションのステータスバー
11.5 仮想キーボード
11.5.1 Canvasベースのキーボードの実装
11.6 まとめ
索引