Canvas How to - Set shadow color

Question

We would like to know how to set shadow color.

Answer


<!--  w ww.  j a  v a  2s  .c o m-->
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.3.js'></script>
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
        var canvas=document.getElementById("canvas");
        var ctx=canvas.getContext("2d");
        ctx.rotate(.6);
        ctx.rect(150, 50, 50, 60);
        ctx.shadowOffsetX = 50;
        ctx.shadowOffsetY = 50;
        ctx.shadowBlur = 5;
        ctx.shadowColor = "DarkGoldenRod";
        ctx.strokeStyle = "Gold";
        ctx.stroke();
});//]]>  
</script>
</head>
<body>
    <canvas id="canvas" width=300 height=300></canvas>
</body>
</html>

The code above is rendered as follows: