帆布：形状+阴影

Question

我需要绘制一个形状，然后添加阴影，但阴影覆盖填充的颜色，我需要它在它下面..我无法很好地解释情况，所以这里是一个例子jsfiddle

var canvas = document.getElementById("myCanvas"); 
var context = canvas.getContext("2d"); 
context.beginPath(); 
context.moveTo(170, 80); 
context.bezierCurveTo(130, 100, 130, 150, 230, 150); 
context.bezierCurveTo(250, 180, 320, 180, 340, 150); 
context.bezierCurveTo(420, 150, 420, 120, 390, 100); 
context.bezierCurveTo(430, 40, 370, 30, 340, 50); 
context.bezierCurveTo(320, 5, 250, 20, 250, 50); 
context.bezierCurveTo(200, 5, 150, 20, 170, 80); 
context.closePath(); 
context.lineWidth = 5;  
context.fillStyle = "#8ED6FF"; 
context.strokeStyle = "#0000ff";  
context.shadowColor = "#000000"; 
context.shadowBlur = 2; 
context.shadowOffsetX = 5; 
context.shadowOffsetY = 5; 
context.fill();  
context.stroke(); 

http://jsfiddle.net/j8u8p/ THX

Answer 1

http://jsfiddle.net/j8u8p/11/

注：我所做的只是重新安排呼叫的上下文，并添加在globalCompositeOperation

p.s.这看起来更好：http://jsfiddle.net/j8u8p/13/

p.p.s因为你呻吟有关的差距，这是扭捏：http://jsfiddle.net/j8u8p/16/