Trouble with Canvas rendering in Safari/Opera

Question

Been banging my head against this one for a while, and figured I'd turn to the experts for some advice.

I've made a jQuery snippet that grabs the values from a table and plots them in a line graph on a canvas element (also generated by the JS). All's well in Firefox and Chrome, but Safari and Opera aren't displaying the plotted points. I've reviewed in Firebug, Web Inspector debugger, JSLint, and checked the markup with the w3 validator, but still can't find anything glaringly obvious. I've also tried including the canvas element in the HTML rather than generating it dynamically, as well as substituting a tag pair for the self-closing tag I've been using—all to no avail.

Any chance one of you guys could help me out? Here's a page with a simplified example: http://bit.ly/aAshPQ

Thanks!

Answer 1

I think this is a problem of the time when you call stroke(). Try to call it only after the for loop, and try differents positions of the closePath call.

Answer 2

I draw lots of lines in Safari so I checked my code and the pattern is...

beginPath
moveTo
lineTo(s)
closePath or stroke

In your code moveTo is before beginPath, so I switched that in one of my apps and it stopped drawing, so try switching those around.