Javascript DOM image to canvas

2019-03-03 20:33发布

问题:

I need to create a canvas element from a previously loaded image in the DOM. How I can do this with javascript?

The source of my images are on another server. Therefore I have Cross domain problems...

Thanks in advance !

回答1:

So I have created this fiddle that shows how to load images, cross domain and then display on canvas..

    var canvas = document.getElementById('myCanvas');
    var context = canvas.getContext('2d');
    var imageObj = new Image();

    var img = new Image();
    img.onload = function(){
        context.drawImage(img, 69, 50);

    }
    img.src="http://indianautosblog.com/wp-content/uploads/2013/01/2014-Ferrari-F150-Enzo-successor-rendered.jpeg";

This JS shows how to load an image from another site..



回答2:

Here Just pass drawImage the image object.