Finding adjacent cells in an hex map

This tutorial continues Hex maps creation and rollover.

Now I will show you how find adjacent cells. Again, at the moment it’s only code, and it only works for horizontal hex maps

and this is the result:

While I am optimizing the code and writing the routines for the vertical hex maps, James Prankard sent me the AS3 version of the code published in the Hex maps creation and rollover tutorial

Here it is:

Download the source codes and experiment

  • JDog

    Great, but what do you plan to do with it onc its done ?

  • Yeah…
    It seems…sorta…pointless…

  • Kesh

    as much as i think eaglevisions comments are pointless, i think he has a point. I dont see where ur going with this. Honeycomb??? was it a request?? but still works fine for whoever would need it. Thanks.

  • Kesh

    edit: what i did was make those hexagon’s cubes and it look like steps….. it looks sorta cool so try it !!!!!!!

  • with this code you can find any tile relative to the one your mouse is on, that could be great for puzzle games!

  • Emanuele Feronato

    styxtwo is right…

  • Pingback: Finding adjacent cells in an hex map - part 2 : Emanuele Feronato - italian geek and PROgrammer()

  • Pingback: MiniGladiator » Blog Archive » Javascript Gladiators()

  • Pingback: Halloween Couples : Emanuele Feronato()

  • Great script thx alot for it.

    Is it possible to place in a container of some sort so the hex grid can be centered in a stage?
    I was able to make the grid draw in a different place by adjusting the “var hexagon_x_position:Number” and “var hexagon_y_position:Number” but the mouseover dont follow. Where should I adjust so the mouseover matches the grid?

    In advance thx for your reply to a total newbee to AS3.

  • I also tried to manipulate the container object:
    var hexagon_container:MovieClip = new MovieClip();
    hexagon_container.x = 116;
    hexagon_container.y = 26;
    addChild(hexagon_container);

    but still the mouseover dont follow correctly

  • Xerks

    I’ve running this but it wouldn’t compile, something about 1046: Type was not found or was not a compile-time constant: hhexagon and 1180: Call to a possibly undefined method hhexagon. I’ve no idea what that means and any help would be apprieciated. Thanks.

    Great site btw

  • Xerks

    nevermind I goofed….

  • Xerks

    Hi again, I’d like to use to start of your code to set up a matching game instead, how would I change it to instead of a set grid where every row has the same number of hexagons but each row has alternate hexagons. i.e. row 1 has 6 hexagons then row 2 has 5, then back to 6 again and so on.

    I’ve tried to set up an if statement but i can’t seem to get it to work. Thanks in advance for any help you’d give me

  • Pingback: Finding adjacent cells in an hex map – AS3 Version : Emanuele Feronato - italian geek and PROgrammer()

  • Hmmmm,

    nice !!! i guess you need some more effort, because this editor is only true for 10×12 grid, try to change the grid value, and it sucks !!!

  • i figured out in 5 mins how to change the grid to get everything working:

    hexagon_width = 38;
    hexagon_height = 44;
    grid_x_size = 18;
    grid_y_size = 18;
    sector_width = hexagon_width;
    sector_height = hexagon_height/4*3;
    gradient = (hexagon_height/4)/(hexagon_width/2);
    for (x=0; x<grid_x_size; x++) {
    for (y=0; y=hexagon_width/2) {
    if (delta_sector_y<(hexagon_height/2-delta_sector_x*gradient)) {
    real_x = sector_x;
    real_y = sector_y-1;
    } else {
    real_x = sector_x;
    real_y = sector_y;
    }
    } else {
    if (delta_sector_y<delta_sector_x*gradient) {
    real_x = sector_x;
    real_y = sector_y-1;
    } else {
    real_x = sector_x-1;
    real_y = sector_y;
    }
    }
    break;
    case 0 :
    real_x = sector_x;
    real_y = sector_y;
    if (delta_sector_y<((hexagon_height/4)-delta_sector_x*gradient)) {
    real_x = sector_x-1;
    real_y = sector_y-1;
    }
    if (delta_sector_y=0) and (real_x=0) and (real_y<grid_y_size)) {
    hexagon_hover = real_x+real_y*grid_x_size;
    _root["hhexagon_"+hexagon_hover].gotoAndStop(2);
    if (hexagon_hover%grid_x_size != grid_x_size-1) {
    _root["hhexagon_"+(hexagon_hover+1)].gotoAndStop(3);
    }
    if (hexagon_hover%grid_x_size != 0) {
    _root["hhexagon_"+(hexagon_hover-1)].gotoAndStop(3);
    }
    if (Math.floor(hexagon_hover/grid_x_size)%2 == 0) {
    if (hexagon_hover%grid_x_size != 0) {
    _root["hhexagon_"+(hexagon_hover+(grid_x_size-1))].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-(grid_x_size+1))].gotoAndStop(3);
    }
    _root["hhexagon_"+(hexagon_hover+grid_x_size)].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-grid_x_size)].gotoAndStop(3);
    } else {
    if (hexagon_hover%grid_x_size != grid_x_size-1) {
    _root["hhexagon_"+(hexagon_hover+(grid_x_size+1))].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-(grid_x_size-1))].gotoAndStop(3);
    }
    _root["hhexagon_"+(hexagon_hover+grid_x_size)].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-grid_x_size)].gotoAndStop(3);
    }
    }
    };

  • It would be nice to know, how to change hexagon tile sizes.

  • Hey, forget my last comment. Here you are my AS2 verison, which controls good the grid size and the hexagon size.

    hexagon_width = 19;
    hexagon_height = 22;
    grid_x_size = 20;
    grid_y_size = 20;
    sector_width = hexagon_width;
    sector_height = hexagon_height/4*3;
    gradient = (hexagon_height/4)/(hexagon_width/2);
    for (x=0; x<grid_x_size; x++) {
    for (y=0; y=hexagon_width/2) {
    if (delta_sector_y<(hexagon_height/2-delta_sector_x*gradient)) {
    real_x = sector_x;
    real_y = sector_y-1;
    } else {
    real_x = sector_x;
    real_y = sector_y;
    }
    } else {
    if (delta_sector_y<delta_sector_x*gradient) {
    real_x = sector_x;
    real_y = sector_y-1;
    } else {
    real_x = sector_x-1;
    real_y = sector_y;
    }
    }
    break;
    case 0 :
    real_x = sector_x;
    real_y = sector_y;
    if (delta_sector_y<((hexagon_height/4)-delta_sector_x*gradient)) {
    real_x = sector_x-1;
    real_y = sector_y-1;
    }
    if (delta_sector_y=0) and (real_x=0) and (real_y<grid_y_size)) {
    hexagon_hover = real_x+real_y*grid_x_size;
    _root["hhexagon_"+hexagon_hover].gotoAndStop(2);
    if (hexagon_hover%grid_x_size != grid_x_size-1) {
    _root["hhexagon_"+(hexagon_hover+1)].gotoAndStop(3);
    }
    if (hexagon_hover%grid_x_size != 0) {
    _root["hhexagon_"+(hexagon_hover-1)].gotoAndStop(3);
    }
    if (Math.floor(hexagon_hover/grid_x_size)%2 == 0) {
    if (hexagon_hover%grid_x_size != 0) {
    _root["hhexagon_"+(hexagon_hover+(grid_x_size-1))].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-(grid_x_size+1))].gotoAndStop(3);
    }
    _root["hhexagon_"+(hexagon_hover+grid_x_size)].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-grid_x_size)].gotoAndStop(3);
    } else {
    if (hexagon_hover%grid_x_size != grid_x_size-1) {
    _root["hhexagon_"+(hexagon_hover+(grid_x_size+1))].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-(grid_x_size-1))].gotoAndStop(3);
    }
    _root["hhexagon_"+(hexagon_hover+grid_x_size)].gotoAndStop(3);
    _root["hhexagon_"+(hexagon_hover-grid_x_size)].gotoAndStop(3);
    }
    }
    };