JS
(quick guide & examples)
JUST AN EMPTY CANVAS <canvas id="demo"></canvas>
IMAGE + WATERMARK + CANVAS var img = new Image(), wm = "Copyright", canvas = document.getElementById ("demo"), ctx = canvas.getContext("2d");
img.onload = () => { ADD SOURCE IMAGE canvas.width = img.naturalWidth; canvas.height = img.naturalHeight; ctx.drawImage(img, 0, 0, img.naturalWidth, img.naturalHeight);
GO img.src = "SOURCE.WEBP";
ADD WATERMARK ctx.font = "bold 24px Arial"; ctx.fillStyle = "rgba(255, 0, 0, 0.5)"; ctx.fillText(wm,10, 30); };