- DomName('CanvasRenderingContext2D.drawImage')
Draws an image from a CanvasImageSource to an area of this canvas.
The image is a region of source
that is sourceWidth
wide and
destHeight
tall with top left corner at (sourceX
, sourceY
).
The image will be drawn to this context with its top left corner at the
point (destX
, destY
) and will be scaled to be destWidth
wide and
destHeight
tall.
If the image is larger than canvas will allow, the image will be clipped to fit the available space.
VideoElement video = document.query('video');
video.width = 100;
video.height = 100;
// Take the middle 20x20 pixels from the video and stretch them.
ctx.drawImageScaledFromSource(video, 40, 40, 20, 20, 50, 50, 100, 100);
// Draw the top 100x20 pixels from the otherCanvas to this one.
CanvasElement otherCanvas = document.query('canvas');
ctx.drawImageScaledFromSource(otherCanvas, 0, 0, 100, 20, 0, 0, 100, 20);
See also:
-
CanvasImageSource for more information on what data is retrieved from
source
. -
drawImage from the WHATWG.
Source
@DomName('CanvasRenderingContext2D.drawImage') void drawImageScaledFromSource(CanvasImageSource source, num sourceX, num sourceY, num sourceWidth, num sourceHeight, num destX, num destY, num destWidth, num destHeight) { _drawImage(source, sourceX, sourceY, sourceWidth, sourceHeight, destX, destY, destWidth, destHeight); }