iio
 

Circle

Extends :: Shape :: Obj

A class that defines a circle with a position and a radius. The position vector pos is at the center of the circle.

This class must be accessed through the iio package.

 

Constructors

These functions are used to instantiate new instances of the Circle class. Constructor functions must be preceded by the new keyword.

 

iio.Circle( Vector position, Number radius )

iio.Circle( Number x, y, radius )

- creates a circle with the given position and radius. The default value for all parameters is 0.

//create a circle at canvas center
//with a 40px radius
var circle = new iio.Circle(io.canvas.center,40);

//create a circle at 20,40
//with a 40px radius
var circle = new iio.Circle(20,40,40);
 

Inherited Properties

Circle :: Shape :: Obj

Obj.pos :: ioVec

Obj.rotation :: Number

 

Graphics Properties

The following properties can are attached by the iio Graphics Engine. Note that these properties are 'undefined' by default, so you must define them with their set functions or set their values directly.

.styles.alpha :: Number

.styles.strokeStyle :: Color||Pattern||Gradient

.styles.lineWidth :: Number

.styles.shadow :: Object

.styles.fxFade :: Object

.styles.fillStyle :: Color||Pattern||Gradient

.img :: Image

.anims :: Array

.animKey :: Number

.animFrame :: Number

.refLine :: Number

 

Kinematics Properties

The following properties can are attached by the iio Kinematics Engine. Note that these properties are 'undefined' by default, so you must define them with their set functions or set their values directly.

.vel :: Vec

.acc :: Vec

.torque :: Number

.shrinkRate :: Number

.bounds :: Object

 

Properties

The new data added by the Circle class.

 

.radius :: Number

- the radius of this circle, measured in pixels.

//get a circle's radius
var r = circle.radius;
 

Inherited Functions

Circle :: Shape :: Obj

Obj.setPos

Obj.translate

Obj.rotate

 

Graphics Functions

The following functions can are attached by the iio Graphics Engine.

.draw

.clearDraw

.fade

.fadeIn

.fadeOut

.setShadow

.setShadowColor

.setShadowBlur

.setShadowOffset

.setAlpha

.setStrokeStyle

.setLineWidth

.drawReferenceLine

.setFillStyle

.addImage

.createWithImage

.flipImage

.setImgOffset

.setImgSize

.setImgScale

.setImgRotation

.addAnim

.createWithAnim

.setAnim

.setAnimKey

.setAnimFrame

.nextAnimFrame

.playAnim

.stopAnim

 

Kinematics Functions

The following functions can are attached by the iio Kinematics Engine. Note that you must call the enableKinematics function before you can utilize any of these functions.

.enableKinematics

.update

.setVel

.setAcc

.setTorque

.setBound

.setBounds

.shrink

 

Functions

These functions are added by the Circle class, and available to all instantiated Circle objects.

 

.clone()

:: Returns Circle

- returns a new Circle with the same properties as this one. Makes a hard copy of the object.

 

.setRadius( Number radius )

:: Returns this

- sets this circles radius to the given value. The default value for radius is 0

//change the radius of a circle
circle.setRadius(20);
 

.contains( Vector point )

.contains( Number: x, y )

:: Returns Boolean

- returns true if the given point is inside this circle. Returns false otherwise.

//alert when a circle is clicked
io.canvas.addEventListener('mousedown', function(event){
    if (circle.contains(io.getEventPosition(event)))
      alert('you clicked the circle');
});