JSGS Shapes

6 Parameters:

• center: TNTPoint
• radius: an 'double'
• numSpokes: a positive integer ≥ 2
• stroke: a TNTStroke: to set the radii color and weight
• rotn: a 'double' that rotates the shape about its center. rotn > 0 ==> counter-clockwise; rotn < 0 ==> clockwise
• probDot: The probability (in [0,1]) that a radius will have a little dot on the end of it

The randomly-generatred pattern above was created by:

var myBlackStroke = new TNTStroke(black, .1);

for(var x = XMIN; x < XMAX; x += 6){
    for(var y = YMAX; y > YMIN; y -= 6){
        var anX = x + 3;
        var anY = y - 3;
        var center = new TNTPoint(anX, anY);
        if(Math.random() < .8){
            //do nothing
        }else{
            if(Math.random() < 1){
                var rayLen = addRandomJitterAbout(1.5, -.5, .5);
                anX = addRandomJitterAbout(anX, -1, 1);
                anY = addRandomJitterAbout(anY, -1, 1);
                var rotn = 0;
                center = new TNTPoint(anX, anY);
                var aStar = new TNTRetroStar(center, rayLen, 8, myBlackStroke, rotn, .125);
                aStar.drawTNTRetroStar(context);
            }
        }
    }
}
                                    

aStar.drawTNTRetroStar(context);

At the labs, we are always on the look out for interesting patterns that we see in 'the real world' and challenge ourselves to see if they can be recreated in code!

The image to the right is a re-creation of the retro pattern that we were originally inspired by!

You can see the TNTRetroDiamond at its own landing page.