Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
const img = new Image(); img.src = "photo.jpg"; img.onload = () => { const ctx = canvas.getContext("2d"); // Draw at position (0,0) ctx.drawImage(img, 0, 0); // Draw scaled to 300x200 ctx.drawImage(img, 0, 0, 300, 200); // Draw cropped: source(sx,sy,sw,sh) dest(dx,dy,dw,dh) ctx.drawImage(img, 100, 100, 200, 200, 0, 0, 150, 150); };
Result
Open