タイトル: 色
Canvasでの色の指定の仕方
色
|
ctx.strokeStyle=色 |
図形の枠線の色を指定 |
|
ctx.fillStyle = 色 |
図形を塗りつぶす色を指定 |
”色”に指定する色はCSSで指定するフォーマットに対応。
透明度
|
ctx.globalAlpha = 透明度 |
描いた図形の半透明度を指定 |
”透明度”は、0.0（完全に透明）から1.0（透明度なし）の範囲で指定する。
線形グラデーション
|
CanvasGradient = ctx.createLinearGradient(x0, y0, x1, y1) |
線形グラデーションを指定 |
|
CanvasGradient.addColorStop(offset, color) |
グラデーション色を追加 |
グラデーションの開始地点(x0, y0)と終了地点(x1, y1)をセットすると、
その直線で初期化された線形のCanvasGradientオブジェクトを返す。
グラデーション終点のoffsetと、その地点の色をセットする。
円形グラデーション
|
CanvasGradient = ctx.createRadialGradient(x0, y0, r0, x1, y1, r1) |
円形グラデーションを指定 |
中心座標が (x0, y0) で半径 r0 の円と、中心座標が (x1, y1) で半径 r1 の円を指定すると、
その2つ円で初期化された円形のCanvasGradientオブジェクトを返す。