610241 - canvas ctx_arc problem

Status: RESOLVED INVALID

(Core :: Graphics: Canvas2D, defect)

Description

[wartex8]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.7 (KHTML, like Gecko) Chrome/7.0.517.44 Safari/534.7
Build Identifier: 

pointer = canvas.getContext('2d');
xdist = canvas.width/11;
ydist = canvas.height/11;

for(ii = ydist; ii < canvas.height; ii += ydist){
	for(i = xdist; i < canvas.width; i += xdist){
		pointer.beginPath(); //required to loop this in firefox
		pointer.arc(i,ii,2,0,Math.PI*2,true);
		pointer.fill();
	}
}

//vs

pointer.beginPath(); //required to loop this in firefox
for(ii = ydist; ii < canvas.height; ii += ydist){
	for(i = xdist; i < canvas.width; i += xdist){
		pointer.arc(i,ii,2,0,Math.PI*2,true);
	}
}
pointer.fill();
/*
Firefox requires the .beginPath() and the .fill() to be inside the for loop (to draw the arcs individually instead of one setting)
If I use the second code example, it produces a weird image where the arcs I draw connect to one another, because firefox fills between the different arcs instead of seeing them as separate entities.
*/

Reproducible: Always

Steps to Reproduce:
1. Run the code I gave

Comment 1

[Robert Longson [:longsonr]]

That's what the html5 specification says to do isn't it?

context . arc(x, y, radius, startAngle, endAngle [, anticlockwise ] )

    Adds points to the subpath such that the arc described by the circumference of the circle described by the arguments, starting at the given start angle and ending at the given end angle, going in the given direction (defaulting to clockwise), is added to the path, connected to the previous point by a straight line.

Comment 2

[Boris Zbarsky [:bzbarsky]]

Yep, exactly.  beginPath is what makes things "separate entities.  The second code snippet is just a bunch of arc() calls in a row, which should connect them all up to each other.

What documentation led you to believe otherwise?