siteIcon

Honeycomb

Kent P, 2022

Your browser does not support HTML5 Canvas

Notes:

The TNTPolygon was the star of this show, and a nested loop made the pleasing design possible.

Features:
Design Scale:

Canvas size:

Comments:

Check out our honeycomb source code:

//field of hexagons: nested loop
var xLeft, xRight;
var t = .08;
yellowStroke.lineWidth = t;
var radius = .5;
var apothem = radius/(2*Math.tan(Math.PI/6));
var delx = 2*apothem;
var dely = 2*radius - 3*t;
var myStroke = yellowStroke;
var rowCount = 0;
for(var y = 4; y >= -4; y-=dely){
    if(rowCount % 2 == 0) {
        //offset = .1;
        xLeft = -4;
        xRight = 4;
    }
    else {
        //offset = .1;
        xLeft = -4 + apothem;
        xRight = 4 + apothem;
    }
    rowCount++;
    var count = 0;
    for(var x=xLeft; x<=xRight; x+= delx){
        var center = new TNTPoint(x, y);
        var hexagon = new TNTPolygon(center, 6, radius, null, myStroke, 30);
        hexagon.drawTNTPolygon(context);
        count++;
    }
}