qingyangmoke / explorercanvas

Explorercanvas (excanvas.js) is an open source, Apache-licensed JavaScript library that implements the canvas API in Internet Explorer
Apache License 2.0
0 stars 0 forks source link

excanvas fails when adding an image to the canvas #117

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
What steps will reproduce the problem?
1. cMM = document.getElementById("MMCanvas");
2. ctx = cMM.getContext("2d")
3. ctx.clearRect(0,0,CanvasWidth,CanvasHeight);
4. ctx.drawImage(backimage,0,0,CanvasWidth,CanvasHeight);       //Add the image 
width and height = 400

What is the expected output? What do you see instead?
I expect the image to be drawn in the canvas. Instead excanvas.js fails in line 
581

What version of the product are you using? On what operating system?
excanvas r3, Windows xp sp3, IE8

Please provide any additional information below.
This works fine in Firefox (11)

Original issue reported on code.google.com by crawf...@neptune.on.ca on 5 Apr 2012 at 12:51

GoogleCodeExporter commented 9 years ago
I have found what the problem is. I want to centre the canvas. I tried:
     <style>
       canvas
         {
     text-align:center;
     }
     </style>
This did not work in Firefox or IE. The only way that I could do it is to 
define the canvas as:
   <p style="text-align:center;">
      <!-- Define the canvas that the clock and hands will be placed on -->
      <canvas id="MMCanvas" width="300" height="300" style="border:1px solid #dedede; text-align:center;" >
       YOUR BROWSER DOES NOT SUPPORT THE CANVAS TAG.
      </canvas>
    </p>
  This works just fine in Firefox.
  When I removed the paragraph, specifically the alignment, it also worked in IE. 
   I do not know if:
 - The code working in Firefox, works because of a fluke, and it should not work
 - There is a problem that the style SHOULD be able to centre the canvas
 - There is a problem in excanvas.js, and it gets confused when trying to work within a centered paragraph.

   Anyway, by centering the body, aligning paragraphs left and removing the paragraph definition from around the canvas definition my clock is now displaying correctly.

   John  

Original comment by crawf...@neptune.on.ca on 8 Apr 2012 at 1:26