flauwekeul / honeycomb

Create hex grids easily, in node or the browser.
https://abbekeultjes.nl/honeycomb
MIT License
630 stars 57 forks source link

Generating a Diamond shaped grid (Isometric requirement) #104

Closed arvalaan closed 1 year ago

arvalaan commented 1 year ago

Interlacing a grid with various chunks in an isometric view causes tiles to overlap each other. This is prevented when we are able to create a diamond shaped grid instead of a squared grid.

Examples of issues being caused when interlacing as is:

image

Examples of interlacing with a diamond shaped grid:

image

flauwekeul commented 1 year ago

Hi. Thanks for opening this issue. It's already possible to create diamond-shaped grids by using the rectangle() traverser. See https://abbekeultjes.nl/honeycomb/guide/traversing-grids.html#rectangle and scroll down a bit for the "Warning" block. Does this help?

What do you mean with "interlacing" and how are rectangular grids causing issues? And how are diamond grids fixing these issues?

arvalaan commented 1 year ago

Ah! Very nice. Yes @flauwekeul that'll do it.

If you have 2 isometric square grids and you want to lay them out next to each other, you get the issue that I'm showing in my first screenshot.

You can resolve this by making it a diamond shape as you can see in my second screenshot.