CODEWITHSUNDEEP
javascriptjquerycanvas
Johnny
Johnny

Reputation: 9964

Type error when using todataurl

Whenever I try to run this, I get a type error in chrome: Code Update

// Get the drawing canvas
canvas = $('#drawing');
context = canvas[0].getContext('2d');

function resizeCanvas() {

    canvas.attr({'width' : $(window).width()});
    canvas.attr({'height' : $(window).height() - 158});

    var dataURL = canvas[0].toDataURL('image/png');
    context.drawImage(dataURL, 0, 0);

}

$(window).resize(function() {
    resizeCanvas();
}); resizeCanvas();

// Various event handlers after this.

Why!?

Upvotes: 0

Views: 639

Answers (2)

Esailija
Esailija

Reputation: 140210

drawImage takes an image or a canvas reference, you are passing it a string.

For instance:

var a = document.createElement("canvas");
a.getContext("2d").drawImage("asdasdasd", 0, 0 )
//TypeError: Type error

You could try:

context.drawImage(canvas[0], 0, 0);

Or

var image = new Image();
image.src = dataURL;
context.drawImage( image, 0, 0 );

Upvotes: 1

João Silva
João Silva

Reputation: 91299

Your code seems fine. Check the following:

  1. There exists a canvas element with id drawing;
  2. Your version of Chrome supports canvas.

Upvotes: 1

Related Questions