HTML5 Canvas 学习日志（四）

HTML5 Canvas 学习日志（四）

Canvas Shadow

//Shadow
context.shadowBlur = 60;
context.shadowColor = "rgb(255, 123, 172)";
context.fillStyle="rgb(255, 123, 172)";
context.fillRect(100, 100, 100, 100);

Canvas Shadow Offset

context.shadowBlur = 10;
context.shadowOffsetX = 10;
context.shadowOffsetY = 10;
context.shadowColor = "rgba(100, 100, 100, 0.5)";
context.fillStyle="rgb(0, 102, 153)";
context.fillRect(50, 50, 100, 100);

Canvas Arc Shadow

context.shadowBlur = 50;
context.shadowOffsetX = 0;
context.shadowOffsetY = 0;
context.shadowColor = "rgb(255, 255, 0)";
context.fillStyle="rgb(225, 225, 0)";
context.beginPath();
context.arc(400, 100, 50, 0, Math.PI*2, false);
context.closePath();
context.fill();