Stap 6: Cirkels tekenen op het scherm
In deze sectie hebben we 4 cirkels op het canvas met behulp van de ellips functie toegevoegd.
Paper.Ellipse (x, y, rx, ry)
http://raphaeljs.com/Reference.html#paper.Ellipse Parameters
- x - x-coördinaat van het centrum
- y - y-coördinaat van het centrum
- RX - horizontale straal
- Ry - verticale straal
Wij zijn de eerste cirkel met het middelpunt te tekenen één cm van de bovenkant verlaten van het doek. met een straal van 1 cm.
paper.ellipse( ONE_CM_IN_PX, ONE_CM_IN_PX, ONE_CM_IN_PX, ONE_CM_IN_PX).attr( BRUSH_CUT_FIRST );
Van de volgende cirkel center begint 2cm op de x-koord en op de dezelfde y-snoeren. Deze twee lijnen zal produceren twee cirkels die elkaar overlappen.
paper.ellipse( ONE_CM_IN_PX*2, ONE_CM_IN_PX, ONE_CM_IN_PX, ONE_CM_IN_PX).attr( BRUSH_CUT_FIRST );
Voegen we twee meer cirkels gebruikend de zelfde methode.
paper.ellipse( ONE_CM_IN_PX, ONE_CM_IN_PX*2, ONE_CM_IN_PX, ONE_CM_IN_PX).attr( BRUSH_CUT_FIRST ); paper.ellipse( ONE_CM_IN_PX*2, ONE_CM_IN_PX*2, ONE_CM_IN_PX, ONE_CM_IN_PX).attr( BRUSH_CUT_FIRST );
Broncode voor deze stap kan worden gevonden op mijn Gist
https://gist.github.com/funvill/11351377
