Class: Circle

graphics.geom. Circle


new Circle( [x] [, y] [, radius])

A simple circle definition in a two-dimensional coordinate system.

The Circle class represents a simple circle definition in a two-dimensional coordinate system, where x represents the horizontal center coordinate and y represents the vertical center coordinate.

Parameters:
Name Type Argument Default Description
x number <optional>
0

The x value of the object.

y number <optional>
0

The y value of the object.

radius number <optional>
0

The radius value of the object.

Extends

Members


area :Number

The area of the circle.

Type:
  • Number
Default Value:
  • 0

bottom :Number

The bottom value of the circle.

Type:
  • Number
Default Value:
  • 0

circumference :Number

The circumference of the circle.

Type:
  • Number
Default Value:
  • 0

diameter :Number

The diameter value of the circle.

Type:
  • Number
Default Value:
  • 0

left :Number

The left value of the circle.

Type:
  • Number
Default Value:
  • 0

radius :Number

The radius value of the circle.

Type:
  • Number
Default Value:
  • 0

radiusSquared :Number

The radius squared value of the circle.

Type:
  • Number
Default Value:
  • 0

The right value of the circle.

Type:
  • Number
Default Value:
  • 0

top :Number

The top value of the circle.

Type:
  • Number
Default Value:
  • 0

x :Number

The horizontal coordinate of the point.

Type:
  • Number
Inherited From:
Default Value:
  • 0

y :Number

The vertical coordinate of the point.

Type:
  • Number
Inherited From:
Default Value:
  • 0

Methods


circumferencePoint(angle [, point])

Returns a circumference point on the circle with a specific angle.

Parameters:
Name Type Argument Default Description
angle number

The angle in radian to find the point on a circle.

point graphics.geom.Vector2 | Vector2D <optional>
null

The optional point to populates (if null a new Vector2D instance is created).

Returns:

circumference point on the circle with a specific angle.


clone()

Returns a shallow copy of the object.

Overrides:
Returns:

a shallow copy of the object.


contains(x, y)

Indicates if the specific x,y position is inside the circle.

Parameters:
Name Type Description
x number

The x value of the coordinate to check.

y number

The y value of the coordinate to check.

Returns:

true if the x,y position is inside the circle.


copyFrom(source)

Copies all of vector data from the source Circle object into the calling Circle object.

Parameters:
Name Type Description
source graphics.geom.Circle

The Circle object from which to copy the data.

Overrides:
Returns:

The current graphics.geom.Circle reference.


equals()

Compares the passed-in object with this object for equality.

Overrides:
Returns:

true if the the specified object is equal with this object.

Type
boolean

getBounds()

Returns a {graphics.geom.Rectangle|Rectangle} area of the circle.

Returns:

A area of the circle.

Type
graphics.geom.Rectangle | Rectangle

intersects(toIntersect)

Determines whether the object specified in the toIntersect parameter intersects with this Circle object.

Parameters:
Name Type Description
toIntersect *

The object to compare against this Circle object.

Returns:

A value of true if the specified object intersects with this Circle object; otherwise false.

Type
boolean

metaball(tx, ty)

Calculates the result of the typical equation for a circle metaball.

Metaballs are, in computer graphics, organic-looking n-dimensional objects. The technique for rendering metaballs was invented by Jim Blinn in the early 1980s.

Each metaball is defined as a function in n-dimensions (ie. for three dimensions, f(x,y,z); three-dimensional metaballs tend to be most common, with two-dimensional implementations as well). A thresholding value is also chosen, to define a solid volume.

Parameters:
Name Type Description
tx number

The x value of the coordinate to check.

ty number

The y value of the coordinate to check.

Example
var bgColor = '#333333' ;
var color   = '#FF0000' ;

var area   = new Rectangle( 0 , 0 , 340 , 260 ) ;
var spot   = new Circle( area.x + (area.width/2) , area.y + (area.height / 2) , 60 ) ;

var metaballs =
[
    new Circle(  20 ,  20 , 10 ) ,
    new Circle(  70 ,  80 , 30 ) ,
    new Circle( 250 , 100 , 35 ) ,
    new Circle( 220 , 130 , 30 ) ,
    new Circle( 60  , 180 , 20 ) ,
    new Circle( 90  , 200 , 25 ) ,
    spot
];

var canvas = document.getElementById('canvas') ;
var context = canvas.getContext('2d');

canvas.width  = area.width;
canvas.height = area.height ;

// ----- render

var maxThreshold = 4 ;
var minThreshold = 3 ;

var cpt = 0 ;
var i   = 0 ;
var tx  = 0 ;
var ty  = 0 ;

var len = metaballs.length ;

var render = function()
{
    context.clearRect(0, 0, area.width, area.height );

    context.fillStyle = bgColor ;
    context.fillRect(0, 0, area.width, area.height );

    cpt = 0 ;

    for( tx = 0 ; tx < area.width ; tx++ )
    {
        for( ty = 0 ; ty < area.height ; ty++ )
        {
            cpt = 0 ;
            for( i = 0 ; i < len ; i++ )
            {
                cpt += metaballs[i].metaball( tx , ty ) ;
            }
            if( cpt >= minThreshold && cpt <= maxThreshold)
            {
                context.fillStyle = color ;
                context.fillRect( tx , ty , 1 , 1 ) ;
            }
        }
    }

    window.requestAnimationFrame( render ) ;
}

var move = function( event )
{
    spot.x = event.clientX ;
    spot.y = event.clientY ;
}

canvas.addEventListener( "mousemove", move ) ;

render() ;

setTo( [x] [, y] [, radius])

Sets the horizontal and vertical coordinates of this object. If the x, the y and the radius parameters are NaN or null the x, y and radius value are 0.

Parameters:
Name Type Argument Default Description
x number <optional>
0

The horizontal coordinate of the circle.

y number <optional>
0

The vertical coordinate of the circle.

radius number <optional>
0

The radius of the circle.

Overrides:

toObject()

Returns the Object representation of this object.

Overrides:
Returns:

the Object representation of this object.


toString()

Returns the string representation of this instance.

Overrides:
Returns:

The string representation of this instance.

Type
string

translate(x, y)

Translate the horizontal and the vertical coordinates of this object.

Parameters:
Name Type Description
x number

The value to increment the horizontal coordinate of the circle.

y number

The value to increment the vertical coordinate of the circle.