Add canvas to a page with javascript

前端 未结 3 582
半阙折子戏
半阙折子戏 2020-12-14 05:50

I am trying to use Javascript in order to add a canvas to one page which originally does not have one. I am trying to do the following:

var canv=document.cre         


        
3条回答
  •  时光说笑
    2020-12-14 06:22

        var canvas = document.getElementById('canvas'); //finds Original Canvas
        img = document.createElement('img'); 
        img.src = 'images/a.jpg'; //stores image src
    
        var canv = document.createElement('canvas'); // creates new canvas element
        canv.id = 'canvasdummy'; // gives canvas id
        canv.height = canvas.height; //get original canvas height
        canv.width = canvas.width; // get original canvas width
        document.body.appendChild(canv); // adds the canvas to the body element
    
        var canvas1 = document.getElementById('canvasdummy'); //find new canvas we created
        var context = canvas1.getContext('2d');
    
        context.drawImage(img, 0, 0, canvas.width, canvas.height); //draws background image
        context.drawImage(canvas, 0, 0); //draws original canvas on top of background
        cscreen = canvas1.toDataURL(); //generates PNG of newly created canvas
        document.body.removeChild(canv); // removes new canvas
    

    I use this all the time and works great...

提交回复
热议问题