Dropshadow вне области отсечения для холста

Question

Я обрезаю изображение в треугольную форму с помощью холста, теперь я хочу добавить тень от него. Как это сделать?

canvas1_img.src = "images/postcard.jpg";

var canvas_wd = 1600;
var canvas_ht = 1000;
var y1 = 330;
var y2 = 682;

canvas1.beginPath();
canvas1.moveTo(0, y1);
canvas1.lineTo(0, y2);
canvas1.lineTo(canvas_wd, canvas_ht);
canvas1.lineTo(canvas_wd, 0);
canvas1.closePath();
canvas1.clip();

canvas1.drawImage(canvas1_img,0,0);

Answer 1

Сделайте это прямо вокруг canvas1.clip()

также, вместо того, чтобы называть его canvas1, вы должны называть его ctx или context, поскольку это не холст, это контекст, верно?

ctx.shadowOffsetX = 2; // Sets the shadow offset x, positive number is right
ctx.shadowOffsetY = 2; // Sets the shadow offset y, positive number is down
ctx.shadowBlur = 4; // Sets the shadow blur size
ctx.shadowColor = 'rgba(0, 0, 0, 0.6)'; // Sets the shadow color
ctx.fillStyle = 'none'
ctx.fill()