Bogenförmige Objekte mit Canvas zeichnen
Kreise gehören wie Bezierkurven, Linien und quadratische Kurven zu den komplexen grafischen Objekten, die mit Hilfe der Pfadtechnik gezeichnet werden.
Das Zeichnen von Kreisen und allgemeine Aspekte der Pfadtechnik werden hier an Hand eines Beispiels gezeigt, bei dem zwei Kreise gezeichnet werden sollen. Ausgehend vom allgemeinen Beispiel zum Zeichnen von Pfaden könnte ein erster versuch so aussehen:
context.beginPath(); // Kreis um den Mittelpunkt (90, 90) mit Radius 80 zeichnen context.arc(90, 90, 80, 0, Math.PI*2, false); // Kreis um den Mittelpunkt (250, 90) mit Radius 40 zeichnen context.arc(250, 90, 40, 0, Math.PI*2, false); //Pfad schließen context.closePath(); //Linie zuweisen, sonst ist nichts zu sehen context.stroke();
Wenn man sich dieses erste Beispiel ansieht, dann stellt man fest, dass zwischen diesen beiden