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.