1、globalAlpha用于设值所有绘制的透明度,默认值为0;
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
context.fillStyle = 'rgba(280,187,188,1)';
context.fillRect(10,10,100,100);
context.globalAlpha = 0.5;//透明度为0.5
context.fillStyle = 'rgba(180,187,188,1)';
context.fillRect(20,20,80,80);
2、globalCompositionOperation表示后绘制的图形怎样与先绘制的图形结合;
context.fillStyle = 'rgba(280,187,188,1)';
context.fillRect(150,150,100,100);
context.globalCompositeOperation = 'source-in';//重叠部分可见,其他透明。
context.fillStyle = 'rgba(180,187,188,1)';
context.fillRect(160,160,80,80);
globalCompositionOperation 可能值:
source-over(默认):后绘制图层位于前图层上方。
source-in:图层重叠部分可见