サンプルコード

4 グラフィックス

4-1 ビットマップグラフィックス - HTML Canvas 2D Context
- 4-1-1 クイックスタート
- 4-1-2 パスを使った図形描画
  - 三角形
  - 楕円
- 4-1-3 パスの生成と保持
- 4-1-4 線幅と先端のスタイル
- 4-1-5 点線
- 4-1-6 色とグラデーション
  - 色と透明度の指定
  - 円形グラデーションの指定
- 4-1-7 テキスト
  - テキストの描画と配置
  - テキストの幅
- 4-1-8 シャドー
- 4-1-9 画像の挿入
- 4-1-10 画像のスムージング
- 4-1-11 ピクセル操作
- 4-1-12 合成
  - 合成の比較
  - サンプル
- 4-1-13 ブレンディング
  - ブレンディングの比較
  - サンプル
- 4-1-14 座標変換
- 4-1-15 Canvas画像のエクスポート
  - toDataURL()メソッド
  - toBlob()メソッド
4-2 ベクターグラフィックス - SVG
- 4-2-1 SVGの基礎
- 4-2-2 基本図形のマークアップ
- 4-2-3 塗りと線のスタイルのマークアップ
- 4-2-4 グラデーションのマークアップ
  - 線形グラデーション
  - 円形グラデーション
- 4-2-5 SVGのDOMの基本
- 4-2-6 折れ線と多角形
- 4-2-7 パス
- 4-2-8 テキスト
  - text要素
  - SVGTextContentElementオブジェクト
- 4-2-9 表示範囲の把握
- 4-2-10 座標変換
  - transform属性
  - SVGTransformオブジェクト
- 4-2-11 座標変換行列の計算
4-3 3Dまで扱える座標変換行列 - DOMMatrix interface