3D Hexagon Grid Tutorial with Godot

welcome to erima studios everyone i hope you're having a great day in this mini tutorial we're going to talk about how to create a hexagon grid in 3d space i'll also add in a few notes of how you would do something similar in a 2d space let's get into it now we have our example hexagon grid here and it looks pretty great with a little bit of effort here we can get something like this just for you so one of the key points with a hexagon grid is we're going to have to translate from just a normal grid of x y coordinates into a bunch of pixel locations the the complicated part of this is that with each row there's a little bit of offset left and right and north and south to get these to kind of pair up nicely like this so you can see here the top of this hexagon i'm pointing at here is not in the same it's not directly kind of in line with the hexagon and the row above it there's a little bit of offset and we have the same sort of thing left and right you can see so we have to we have to do some adjustments on the fly to figure this out luckily though this is a problem that's been solved already amit patel has a great article about hexagon grids i've added the link below and i would suggest reading through it a few times it really took me a while to to sit with this and and and mess around with it with my own example project so i'd highly recommend going through and reading it he has some implementation guides for various languages but most of the math is pretty easy to translate into gdscript here all right let's dive into the implementation of this so if we go to our map and find the attached script we can see we have three export variables which we're going to use in the editor to just adjust these on the fly really nice and quickly we have our cell size this is going to help determine those offsets left and right with the 3d implementation 1 1 usually gets you to where you need to be if this was 2d you're going to have to fiddle with this it's kind of going to be related to the pixel size left and right of that and that number will just be a little bit fiddlier to figure out so having this is an export variable can help you out really quickly there map size is going to tell us how big the map we want to generate is once you actually implement this you can maybe have something else or a very dynamic map that changes or just a bunch of different implementations where you're not just setting a hardcore value you might have a bunch of different types of tiles you're creating your hexagon tile pack scene here in my case if we come down that's this scene here which is just a a mesh that i created in blender and imported very quickly coming back here on ready we're going to call generate hex tile map iterate through our different map sizes to create a bunch of cells instantiate our hex from the pack scene create that cell and then call cell to pixel which is the key piece from omits article again link in the description below here's a little bit of math here for for pointy hexagons you would change this a little bit if you were doing a flat hexagon flap being that the top of that is flat as opposed to pointy the one piece i want to call out is here's where we're using that cell size to give us our x offset and our y offset so this is the key piece of understanding the rest of this math you'll set it once and you kind of can forget it after that so we get that tile position if we were doing a 2d game this would just be simply hextile.position equals tile position but since we're in 3d space we need to set the translation which is a vector 3. in this case the x gets mapped into x we don't care about the height so y is going to be set to zero and then our tile position of y gets set into the z variable and then lastly we're going to add that as a child of the map node we're in running this by clicking f5 gives us our tile map that wraps up this little mini tutorial let me know in the comments below if you have any questions or things you want me to elaborate on in future tutorials i appreciate you taking the time to hang out with me and i'll see in the next one thanks

Channel: Aarimous

Views: 174

Keywords:

Id: hmDavGzy1Hw

Length: 4min 24sec (264 seconds)

Published: Tue Nov 16 2021

Reddit Comments

[u/aolson15]

I'm going start sharing some of the knowledge I've gained over the past year though bashing my head against my keyboard. I'd apricate any tips or tricks to improve my future tutorials. This is a great community on reddit and I'd like to help give back. Thanks everyone!