spiralIcon

JSGS Shapes

TNTDisk

Your browser does not support HTML5 Canvas
Notes:

We call it a 'disk' rather than a 'circle', because technically, a circle is just the perimeter part of the shape, and ours can include both the inside and border of the shape. Not surprisingly, the engine needs a TNTPoint for the center, a real-valued radius, and a TNTColor for fill color (fcolr) and a TNTStroke for the border/stroke/perimeter of the disk.

If you'd like your disk to look more like a sphere, we crafted a TNTOrb that takes 2 TNTDisks and morphs the larger one into the smaller one in a given number of steps. Check it out!

TNTDisk Features and Usage:
Primary Attributes:

4 Parameters:

  • center: TNTPoint
  • radius: a decimal (known as a 'double' in code)
  • fillColor: TNTColor (can be null for a framework image)
  • borderColor: a TNTStroke: to set the border color as well as the thickness of the sides
To Create:

The example above was created by:

var aggieMaroon = new TNTColor(170, 0, 65, "aggieMaroon");
var aggieGray = new TNTColor(218, 217, 216, "aggieGray");
var aggieMaroonStroke = new TNTStroke(aggieMaroon, .5);
var center = new TNTPoint(6, 9);
var radius = 8;
var myDisk = new TNTDisk(center, radius, aggieGray, aggieMaroonStroke);
myDisk.showCenter = true;
myDisk.drawTNTDisk(context);
To Draw: myDisk.drawTNTDisk(context);
Comments: To make a TNTDisk without a fill color, provide 'null' for the 'fcolr' parameter; If you do not want a border, provide 'null' for the stroke.
Even More:

Don't confuse fill colors with strokes. It's easy to do! Study the example above for clarity.

See how TNTDisk has been written in varying styles and languages at its Code Showcase page.