Canvasで透過色の図形を描く

Canvasを使って、画面に透明な色を書きます

Javascript内で、cssのスタイルであるrgbaを使う。

rgba(r, g, b, a)

//rは赤、gは緑、bは青の色の設定値
//aは透明度を示します。最小0〜最大1

rgba()の第4引数aは、
0が完全透明、1が無透明となります。

canvas.html

<canvas id="draw-area" ></canvas>

canvas.js

canvas = $('#draw-area');
  
ctx = canvas[0].getContext('2d');
 
//半透明(透明度50%)の青い四角を表示
ctx.beginPath();
ctx.fillStyle = "rgba(" + [0, 0, 255, 0.5] + ")";
ctx.fillRect(1, 1, 32, 32);   

//無透明(透明度0%)の青い四角を表示  
ctx.beginPath();
ctx.fillStyle = "rgba(" + [0, 0, 255, 1] + ")";
ctx.fillRect(32, 32, 32, 32);

canvas.getImageData().dataとかで
各ピクセルのrgba値をとると、
aは255がデフォルトで入っているようだが、
1でも255でも変わらないのかな？