dinamic canvas ugly head in IE8
radu
created the canvas dinamically, using initElement afterwards. But v2
is not working on IE8, so I wanted to upgrade to v3. Now if I create
the canvas dinamically, and try to initElement:
G_vmlCanvasManager.initElement(canvas)
or
canvas = G_vmlCanvasManager.initElement(canvas)
I get the same err: "Unexpected call to method or property access." on
this line:
surfaceElement.appendChild(el);
I checked this group but I didn't see any real fix for this. Has
anybody have any ideas?
Fabien
http://code.google.com/p/explorercanvas/source/browse/trunk/excanvas.js
The downloadable file is here : http://explorercanvas.googlecode.com/svn/trunk/excanvas.js
Fabien
radu
Dean Edwards
> Fabien, I get the same error.
>
-dean
Fabien
inserted into the document, or before the document is loaded.
But as Dean said, a test page is welcome !
radu
don't think it's a problem with the canvas not being loaded into DOM.
When clicking on a link, I make an ajax call, get the result (a div
with lots of canvas inside), append that div to the body and after
that I do initElement. So document is loaded, canvas elements are
loaded.
So you guys say that this scenario should work? I thought it's a
common problem, because I saw that error on google search but nobody
came up with a solution.
radu
excanvas 3). If you click "GO" you'll see the error.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="excanvas.js?v=3"></script>
</head>
<body>
<script>
function fa(){
var div = document.createElement("div");
div.id = "div";
div.innerHTML = "<div id='results'>R:<canvas id='canvas' width='200'
height='200'></canvas><canvas id='canvas2' width='200' height='200'></
canvas></div>";
$("#box")[0].appendChild(div);
var c = $("#canvas")[0];
alert(c);
if (!c.getContext){
c = G_vmlCanvasManager.initElement(c);
}
var ctx = c.getContext("2d");
ctx.strokeStyle = 'black';
ctx.lineWidth = 1;
ctx.beginPath();
ctx.moveTo(0,0);
ctx.lineTo(200,200);
ctx.closePath();
ctx.stroke();
}
</script>
<a href="#" onClick="fa()">GO</a>
<div id="box"></div>
</body>
</html>
radu
when you put the canvases in a div with innerHTML: div.innerHTML =
"<canvas ...></canvas>"