Your browser does not support HTML5 Canvas

Notes:

Three points determine a triangle, right? We just need to add a fill color and some TNTStrokes (for the sides) to create one of these beauties!

TNTTriangle Features and Usage:
Primary Attributes:

5 Parameters:

  • 3 TNTPoints
  • fillColor: a TNTColor. If desired, this may be 'null' which means you'll have a framework rather than a solid triangle
  • strokeColor: a TNTStroke: to set the border color
To Create:

The example above was created by:

var ptA = new TNTPoint(-15, -5);
var ptB = new TNTPoint(2, 19);
var ptC = new TNTPoint(13, -10);
var ptD = origin; //origin is defined in the graphics library

var triangleABC = new TNTTriangle(ptA, ptB, ptC, null, navyStroke);
triangleABC.showPoints = true;
triangleABC.drawTNTTriangle(context);

var triangleABD = new TNTTriangle(ptA, ptB, ptD, gold, null);
triangleABD.showPoints = false;
triangleABD.drawTNTTriangle(context);
                                    
To Draw: triangleABC.drawTNTTriangle(context);
Comments: TNTTriangles have an attribute, 'showPoints' that was used in the example code above. If 'true' the software will draw the TNTPoints that were used to make the TNTTriangle.
Even More:

Explore what happens if the triangle's points are collinear. Is there a problem?!