Zielony Smok

HTML5 canvas – tutorial

Kontur i wypełnienie prostokąta (2)

Jeżeli wyświetlamy kontur i wypełnienie to wypełnienie jest dokładnie wielkości podanego prostokąta. Kontur połową grubości mieści się w obrębie tego prostokąta, a druga połowa wystaje ponad wymiary tego prostokąta. Dlatego najlepiej jest podawać najpierw polecenie stroke(), potem polecenie fill()./p>
Zawartość możesz zobaczyć w
przeglądarce obsługującej element <canvas>
z kontekstem "2d"

Listing

	var cv = document.getElementById("canvas");
	var ctx = cv.getContext("2d");
	ctx.beginPath();
	ctx.rect(50, 50, 200, 100);
	ctx.lineWidth = 5;
	ctx.globalAlpha = 0.5;
	ctx.strokeStyle = "#ff0000";
	ctx.stroke();
	ctx.fillStyle = "#0000ff";
	ctx.fill();