CODEWITHSUNDEEP
javascriptcanvas
MCGRAW
MCGRAW

Reputation: 817

How can I get a canvas image into a function?

 var formElement2 = document.getElementById("recImage");
 formElement2.addEventListener('click', recImagePressed, false);

 function recImagePressed(e){
     var outputCanvas = document.getElementById("outputCanvas");
     outputCtx = outputCanvas.getContext('2d');
     outputCTX.draw();
     outputCtx.drawImage(canvas2, 0, 0);
 }

 function draw() {   
            img = new Image();  
            **img.src = context2.canvas2.toDataURL();** 
            fr1 = makeFrame(context2, makeVect(400,0), makeVect(400, 0), makeVect(0, 400));
            img.onload = function(){ 
                context2.save(); 
                newPainter = cornerSplit(imagePainter,5);
                newPainter(fr1);     
                context2.restore();
                context2.save();
                newPainter(flipHorizLeft(fr1));
                context2.restore();
                context2.save();
                newPainter(flipVertDown(fr1));  
                context2.restore();
                context2.save();
                newPainter(flipVertDown(flipHorizLeft(fr1)));   
            }  
        }

I think the problem lies here: img.src = context2.canvas2.toDataURL();

the methods that are being called have been tested and work independently of this particular block of code.

Upvotes: 0

Views: 105

Answers (2)

Phrogz
Phrogz

Reputation: 303168

You don't have a variable named context2 declared anywhere. This is the (first) reason that what you have doesn't work.

What are you trying to do? Draw an image to a canvas?

Upvotes: 1

Simon Sarris
Simon Sarris

Reputation: 63812

img.src = context2.canvas2.toDataURL();

doesn't make any sense. A canvas context doesn't have a property called canvas2. Either use the variable canvas2 if it exists or use context2.canvas.

Its hard to tell what you want to do since img isn't even used, but if you are trying to draw one canvas to another at some point you can use drawImage with a canvas as the argument, so if thats what you're trying to do you don't have to make an image and use toDataUrl at all.

Upvotes: 0

Related Questions