色

▶

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オブジェクトを返す。

子ページ

子ページはありません

同階層のページ

2017-08-18 10:42:52 guest 178