Library: Turtle
Overview
Object Turtle is a LOGO style turtle for drawing on a HTML canvas 2d context
- source: turtle.js
- author: John Snyders
- license: BSD
- version: 0.1
Constructors
Construct a Turtle object.
The turtle starts off at the origin (0,0) heading 0 degrees which is east. The initial pen color (style) is black and solid and the initial width is 2. There are 360 degrees to a circle. The units for distance and pen width are the same as for the 2d context.
The turtle will use whatever context settings are in effect such as lineCap, globalAlpha etc. except for penWidth and penStyle which are maintained independently by the turtle. lineJoin will have no effect because each linear motion of the turtle is a seperate path.
Any transformations on the canvas will confuse the clear method.
All turtle methods return the turtle so that you can chain method calls.
Example:
var t = new jjs.Turtle(canvas); t.penDown().forward(10).right(90).forward(10).right(90).forward(10) .right(90).forward(10);
parameters
canvas | a canvas element. The caller must make sure the canvas supports a 2d context. |
methods
- forward(d)
- back(d)
- left(a)
- right(a)
- penUp()
- penDown()
- heading(a)
- moveTo(x, y)
- home()
- clear(color)
- width(pw)
- style(s)
- push()
- pop()
- toString()
properties
Functions
Sets up the normal turtle drawing world with 0,0 in the center
of the canvas and positive values of y going up.
parameters
canvas | a canvas element. The caller must make sure the canvas supports a 2d context. |
Move forward d units in the current direction.
If the pen is down a line is drawn in the current style and width.
parameters
d | the distance to move |
returns
this |
Move backward d units in the current direction.
If the pen is down a line is drawn in the current style and width.
parameters
d | the distance to move |
returns
this |
Turn left a degrees. The current heading is updated. Right and left are determined
by facing in the forward direction given by the current heading.
parameters
a | the angle to turn by |
returns
this |
Turn right a degrees. The current heading is updated. Right and left are determined
by facing in the forward direction given by the current heading.
parameters
a | the angle to turn by |
returns
this |
Turtle.penDown()
Put the pen down. With the pen down moving forward or back leaves a line.
returns
this |
Set the heading to a degrees. Zero degrees is east.
parameters
a | the angle to turn by |
returns
this |
Move the turtle to given x, y coordinates without drawing a line
regardless of the pen setting.
parameters
x | x position | |
y | y position |
returns
this |
Clear the turtle canvas
parameters
color | optional background color. If not specified the background will be transparent. |
returns
this |
Set the pen width. pw is any legal value for context lineWidth.
The lineWidth is not set until there is drawing to do.
parameters
pw | the pen width |
returns
this |
Set the pen style. s is any legal value for context strokeStyle.
The strokeStyle is not set until there is drawing to do.
parameters
s | a canvas style. |
returns
this |
Turtle.push()
Save the current turtle state and context state on the stack.
This does a save on the context.
returns
this |
Turtle.pop()
Restore the current turtle state and context state from the stack.
This does a restore on the context.
returns
this |
Turtle.toString()
Format the turtle state as a string.
Objects
current x position. OK to read use goto to set.
current y position. OK to read use goto to set.
current heading. OK to read use heading to set.
Turtle.penIsDown
true when the pen is down, false otherwise
Turtle.penWidth
pen width. OK to read use width to set.
Turtle.penStyle
pen style. OK to read use style to set.