I crop the image and put it into canvas:
image.addEventListener('load', () => {
ctx.drawImage(
image,
0,
0,
dw,
dh,
0,
0,
dw,
dh,
);
});
How to get cropped image and put it to body -> img?
HTML canvas elements have a function called toDataURL(), which returns a data URL representation of the canvas pixels.
Call the toDataURL() function on the canvas element and set the image source to the data URL.
image.src = canvas.toDataURL();