These forums are currently read-only due to receiving more spam than actual discussion. Sorry.

It is currently Sat Dec 02, 2017 4:11 pm Advanced search

Offscreen canvas and strange behaviour when composing images

Here you can discuss things related to HTML and the Web in general that do not fit in to other categories.

Offscreen canvas and strange behaviour when composing images

Postby dariodariodario » Tue Jul 06, 2010 12:16 pm

Hello,
I found this issue while working on a HTML5 app, with multibrowser support. The issue happens both in firefox and chrome 5.0.3. I've a png image that is 480x268 and I tried to render it on a offscreen canvas this way (jQuery is involved):

Code: Select all
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src = "js/jquery-1.4.2.js"></script>
<script type="text/javascript">

jQuery(window).bind("load", function() {
   var elem = $("<canvas>", {width:300, height:300});

   var canvele = elem[0];
   
   
   var imm = new Image();

   imm.src = "card1/mask-x-6.png";
   imm.onload = function(){
      var ctx = canvele.getContext('2d');
      ctx.drawImage(imm, 0,0);
      $('body').append(elem);
   }
});
   

</script>
</head>
<body>

</body>
</html>


the result is that the image gets drawn extremely stretched, instead of it's real size. Even trying to manually setting the size using

ctx.drawImage(imm, 0, 0, imm.width, imm.height)

doesn't work but results in further stretching. If I insert the Canvas element in the page by coding it in HTML (no using JS), the problem doesn't happen. Why is this happening? What are the issues of using canvas outside the main DOM three? How can I solve this problem?[/code]
dariodariodario
<h6>
 
Posts: 2
Joined: Tue Jul 06, 2010 12:09 pm

Postby zcorpan » Tue Jul 06, 2010 12:32 pm

http://software.hixie.ch/utilities/js/l ... /saved/535

Works fine for me. Is it something jQuery is doing?
zcorpan
<article>
 
Posts: 807
Joined: Tue Feb 06, 2007 8:29 pm
Location: Sweden


Return to General Discussion

Who is online

Users browsing this forum: No registered users and 2 guests