flauwekeul / honeycomb

Create hex grids easily, in node or the browser.

Home Page:https://abbekeultjes.nl/honeycomb

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Hex edge utilities

eranimo opened this issue · comments

Utilities for getting the edges of hexes would be appreciated. Maybe looping over them too.

There's a function to get the corners of a hex, those are also the start points and end points of the edges. If you want the corners of all hexes in a grid, you have to translate each corner point to that of each hex. You can see this in the PixiJS example.

Does this answer your question?

It would be helpful if there were an Edge class. It would contain the two hexes on each side, and also the two hexes on each end of the edge. It would also contain references to the 4 neighboring edges. Some games have entities existing on hex edges, so these utilities are necessary to build that. Doing that well and performantly can be complicated, so it would be useful in this library.

Interesting. I'm working on a rewrite of Honeycomb in typescript and adding edge-related functionality sounds like a good idea. I probably won't add it in the current version though.

Thanks!

Does the new v4 branch have this?

edit: Ah, I see a to do. New version looks great! Would be nice to have this

I have a vague idea for an API (pseudo code):

// an edge would probably just be an interface, I don't think it needs any state
interface Edge {
  // an edge is primarily defined by 2 corner points (in clockwise order?):
  [0]: Point
  [1]: Point
  sides: [HexCoordinates, HexCoordinates]
  prev: Edge // previous edge (counter-clockwise direction)
  next: Edge // next edge (clockwise direction)
}

const hexPrototype = createHexPrototype(...)
const grid = new Grid(hexPrototype, rectangle({ width: 10, height: 10 })) // creates a 10 x 10 rectangular grid

// getting a single edge requires hex coordinates and a direction:
grid.getEdge({ q: 1, r: 2 }, Compass.SE) // would be nice if less information is required to get an edge

// maybe there should be a way to traverse edges as you can traverse hexes:
grid.traverseEdges([
  at({ q: 1, r: 2 }, Compass.SE),
  move(Compass.E) // to "move" in a direction from an edge is a bit weird...
])

It might be better to work with corners instead of edges. Something like:

interface Vertex {
  // I have to think of some coordinate system, maybe a combination of a hex (axial) coordinate and a direction, like above with edges?
  x: number
  y: number
  // depending on the orientation of the hexes (pointy/flat) and the vertex, not all "next vertex directions" have a value:
  next: {
    [direction: CompassDirection]: Vertex | null,
  }
   // the 3 surrounding hexes, again in a dictionary with directions as keys:
  hexes: {
    [direction: CompassDirection]: HexCoordinates | null,
  }
}

I think working with vertices makes more sense as they're defined by a single 2D point. Edges are just tuples of 2 vertices.

Do you know of any other libs that has edges and/or vertices that you like?

No, as far as I can tell this is the only hex grid utils library. I think corners would be OK, as long as you can still iterate over the edges of a hex (and find the edges branching from a corner)

Associating state with an edge or a corner might be useful.