HTML5 Canvas 基礎(三) 陰影

分享:

要在 canvas 上的物件增加陰影,只要使用以下設定就好了,注意要設定完才繪製圖形,不然陰影不會出現。

context.fillStyle = "#ddd";  //填滿顏色
context.shadowOffsetX = 5;
context.shadowOffsetY = 5;
context.shadowBlur = 4;
context.shadowColor = "rgba(0,0,0,.8)";

context.fillRect(0,0,150,100); 

 這個在各種 canvas 繪製的圖形上都可以,之後可以試著在文字上加看看就可以製作文字的陰影。