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.strokeStyle="green";
			ctx.lineWidth=1;
			ctx.beginPath();
			//-
			ctx.moveTo(494, 0);
			ctx.lineTo(494, 494);
			//-
			ctx.moveTo(494, 189);
			ctx.lineTo(800, 189);
			//-
			ctx.moveTo(612, 0);
			ctx.lineTo(612, 189);
			//-
			ctx.moveTo(494, 117);
			ctx.lineTo(611, 117);
			//-
			ctx.moveTo(566, 117);
			ctx.lineTo(566, 189);
			//-
			ctx.moveTo(566, 144);
			ctx.lineTo(611, 144);
			//-
			ctx.moveTo(584, 117);
			ctx.lineTo(584, 144);
			//-
			ctx.moveTo(566, 135);
			ctx.lineTo(584, 135);
			//-
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(494, 0, 493, Math.PI, 0.5*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(494, 188, 305, 0.5*Math.PI, 0*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(611, 188, 188, 0*Math.PI, 1.5*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(611, 117, 116, 1.5*Math.PI, Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(566, 117, 71, Math.PI, 0.5*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(566, 144, 44, 0.5*Math.PI, 0*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(584, 144, 26, 0*Math.PI, 1.5*Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
			//-
			ctx.beginPath();
			ctx.arc(584, 135, 17, 1.5*Math.PI, Math.PI, true);
			ctx.lineWidth=4;
			ctx.stroke();
		

Dodaj komentarz

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *