hex grid (rectangular)

pick & grow

by jmchen

HTML

<div id="info">hex grid (rectangular)
    <br/>pick & grow by right button</div>
<script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js">
    
</script>
<script src='http://jyunming-chen.github.io/hexgrid2/hexlib.js'></script>

CSS

#info {
    position: absolute;
    top: 0px;
    width: 100%;
    padding: 10px;
    text-align: center;
    color: #ffff00
}
body {
    overflow: hidden;
}

JavaScript

var columns = 6, rows = 5;
var size = 5;
var layout = Layout(layout_pointy, Point(size,size), Point(0, 0));
var offset = Math.floor ((rows-1)/2);

var camera, scene, renderer;
var controls;
var mesh, hex0;
var pickPlane;
var vIDs = []; // row major

var mouse = new THREE.Vector2();

// draw a six-sided polyline (of size one)
function initUnitHexMesh() {
    var material = new THREE.LineBasicMaterial({
        color: 0x0000ff
    });
    var geometry = new THREE.Geometry();
    for (var i = 0, theta = Math.PI / 2; i < 7; i++, theta += Math.PI / 3) {
        var p = new THREE.Vector3(Math.cos(theta), Math.sin(theta), 0);
        geometry.vertices.push(p);
    }
    var line = new THREE.Line(geometry, material);
    return line;
}

// hash (q,r)--> (q',r) --> vIDs (q',r)
function hashHexVertex (q,r) {
    var serial = r * (columns+offset) + (q+offset);
    return vIDs[serial];
}

function highLightHex(hex) {
    vID = hashHexVertex(hex.q, hex.r);
    mesh.geometry.vertices[vID].setZ(10);

    hex0.visible = true;
    // find one of its neighbor...
    hex = hex_neighbor (hex, 0);
    
    var p = hex_to_pixel(layout, hex);
    hex0.position.set(p.x, p.y, 0);
    console.log(hex);
}

function initHex() {
    var geometry = new THREE.Geometry();
    var verts = geometry.vertices; // ptr assignment
    var i, j, p;

    var vID = 0;
	var nskip;
    
    // assign all vIDs to -1
    for (j = 0; j < rows; j++)
        for (i = 0; i < columns+offset; i++)
            vIDs.push (-1);
    
    for (j = 0; j < rows; j++) {  // r: [0, rows-1]
        nskip = 0;  // for every row...
        vertsInThisRow = 0;
        for (i = 0; i < columns+offset; i++) {  // q': [0, columns+offset-1]
        // for (i = -offset; i < columns; i++) {
            // for every row: skip first hex's if necessary
            if (nskip < offset - Math.floor (j/2)) {
                ++nskip;
    //            vIDs.push (-1);
            	continue;
            }
			// trailing skip
            if...