jonessieka / explorercanvas

Automatically exported from code.google.com/p/explorercanvas
Apache License 2.0
0 stars 0 forks source link

excanvas fails in stroke of a line in IE8 #118

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.beginPath();
4. ctx.moveTo(XCent,YCent);
5. ctx.lineWidth=1;
6. ctx.lineTo(XCent + Xlength,YCent + Ylength);
7. ctx.strokeStyle="red";
8. ctx.stroke();

What is the expected output? What do you see instead?
I expect the line to be drawn as requested. Instead the excanvas.js file fails 
in line 765

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

Please provide any additional information below.
The canvas width and height are 400. The XCent and YCent are both 200. XLength 
and YLength are less than 200. The application is a clock face. The code works 
fine in Firefox 11.

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

GoogleCodeExporter commented 9 years ago
This is the same solution as Issue 117.

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:27