Procedurally Generating A Hexagon Grid in Unity
ฝัง
- เผยแพร่เมื่อ 29 พ.ค. 2024
- Hexagons are common in a lot of strategy games, so today let's look at how we can create them from scratch in Unity.
Further Reading - www.redblobgames.com/grids/he...
--------------------------------------------------------------------------------
Want to support the channel?
▶️ Help fund new episodes and get free project downloads by joining the Patreon - / gamedevguide
💡 Get One-Month Free of Skillshare Premium - skl.sh/MKR826
Use these links to grab some cool assets from the asset store:
Get the Must Have Assets! - assetstore.unity.com/top-asse...
Free Unity Assets! - assetstore.unity.com/top-asse...
New on the Asset Store! - assetstore.unity.com/top-asse...
Top Paid Asset Store Packages - assetstore.unity.com/top-asse...
Asset Store Partners - assetstore.unity.com/lists/as...
--------------------------------------------------------------------------------
Socials and Other Stuff:
• Subscribe - th-cam.com/users/gamedevguide?...
• Join the Discord - / discord
• Twitter - / gamedevguideyt
• Facebook - / gamedevguideyt
• Instagram - / gamedevguideyt
Hexagon is the bestagon.
In this house we follow the church of Grey
Amen dude
Porygon > any polygon
Otherwise yes
All praise our lord hexagon.
scrolled too far to fin this xD
Hint: If u want to stay in 2D, then the Grid Component in Unity has an option for exactly that.
And one can always extrapolate a tilemap into 3D objects~
@@AGreatTsunami Wait, what? Would you happen to know of a video or article detailing what you mentioned?
However, those hexagons are not accurate
what is the game at 0:47 ?
@@NominativoUnivoco Why aren't the Grid Component hexes inaccurate? I have a game that needs hex grid
For anyone with a null error when you go to render the first hex, make sure you update the return on CreateFace() to return new Face(vertices, triangles, uvs); because he initially writes it as 'return Face()' and then later amends it.
Hope that helps!
Hi, can you check my code, i thing ive done big wrong :8 nothing works
thanks for the comment I had missed him rewritting that part haha
My face lit up when I saw you had a new video. It was amazing as always! Thanks dude
Another great video mate cheers. Can't wait to see what you come up with next!
YES ! Your videos are so great, and this one did not disappoint.
Hexagons are the bestagons...
Thank you so much! I searched and searched for this exact thing to no avail!
I've just started trying to learn how to code for games and this Channel is just so cool. There's not a lot out there to help learn to make strategy games
Amazing stuff as always! Thanks for the content!
This man deserves more attention, he’s so helpful.
great tutorial can't wait for the next one on hexagonal grids!
Nice stuff. I just started working on hexagons for my own game literally hours before this video came out.
One thing I strongly suggest is that you consider using axial or cubic coordinates instead of offset coordinates. While the coordinates aren't quite as intuitive at first, the maths gets *much* simpler. In your coordinate conversions for example, you get rid of all those odd/even conditionals.
Is It Possible You Can Show How To Use Axial instead of Offset coordinate system?
"Hexagons are the bestagons" felt like a CGP Grey easter egg
This is an awesome video, thank you for the explanation!
Great video, as usual :-)
Calculating Math.sqrt(3) is expensive, and because you are doing that several times, maybe you could create a constant with that value instead.
Microsoft's CLR (the C# virtual machine) is able to optimize away the call to sqrt(3). It might not bother in debug builds though. That being said, you use sqrt(3) often enough `SQRT_3` might be more legible than `Math.sqrt(3)`
Allocating memory for the list at every tick probably has a much bigger performance impact here. But honestly is it such a big deal for a prototype like this? Nobody cares.
@@Neph0 maybe newer game devs that don’t know the best practices and or why this wouldn’t scale well into a big project? I definitely am interested in hearing points like this…
what is the game at 0:47 ?
@@vinhnghiang1273 That game is called, "Before we Leave".
I'm a massive beginner so most of this went way over my head but this has inspired me to learn to use the mesh renderer by rendering some shapes procedurally - cheers!!
Thank you for your knowledge sharing. Subscribed and liked offcorse. :)
Great video, I do wish there was some diagrams showing what the different variables in the grid positioning function were doing coz I got very lost there but I'm glad you covered this topic - I've been wondering how to do this for ages
Thank you very much for this video! For me it is too complicated at first look but again thank you for detailed explanation without useless waste of time! HUGE like and subscribe!
i love how you show the code. i sub immediately! i hope all of you have fun and great days!
This is a very cool video and it will help me a lot in my engine. Thanks!
I love your videos. Please keep up the good work! Can you make a video on setting up a car traffic system or a raycast detection system.
Great video, I'm collecting tutorials like this to learn and also have a nice reference when building something similar. Appreciate the time you took to help the community.
For those with an issue setting the material, I think there was a method setup in the HexRenderer that wasn't shown but you can use something like this if you need it.
public void SetMaterial(Material newMaterial)
{
m_meshRenderer.material = newMaterial;
}
I'm having trouble setting up the innersize, outersize, and height. Can you help?
@@HaoaHaNa8513 [SerializeField] private Material material;
[SerializeField] private float innerSize;
[SerializeField] private float height;
[SerializeField] private float outersize;
then set them in the inspector
Great video, can't wait for the next one :)
I've found my new favourite gamedev channel! :D
For those getting an error when first rendering your hex it might be related to the OnValidate method. I had to check for not null on m_mesh. Example: if(Application.isPlaying && m_mesh != null)
I typed up the code seen in the video but Unity is giving me a bunch of errors. Is there something that I should be doing that's not being covered?
@@SpankytheEvilMo I've only completed generating the hex. The code in the video works. I haven't started coding the grid yet.
@@rutchjohnson Huh, then I wonder what I'm doing wrong. Researching, it seems that this may be a custom editor and I missed that fact.
@@SpankytheEvilMo I’m not using a custom editor.
Thank you! Been debugging that one for the last couple of hours :)
Good tutorial, it would be helpful to have visual representation of what code is doing side by side with current piece of code, otherwise it becomes a bit confusing
Nice video, the mesh building is very clean. Surprised you didn’t use the axial/cube representation from redblob though, it simplifies everything related to selection which is a huge part of many hex games
Watchout for part 2 😉
@@GameDevGuide subscribed and notified!
@@GameDevGuide Whens Part 2??
what is the game at 0:47 ?
0:22 And in my, hexagons are... bestagons
Edit 1:
0:51 YES my brother!
Also I've already worked on it for a while, there is a simple way to make hexagon based coordinate system, also allows for making layers of hexagon tiled planes, I guess you'll show it on one of other methods soon
Great tutorial thanks
Great tutorial! Absolutely loved it 👏🏻
I found in my case that the hexagons were disappearing when they got near the edge of the screen. I fixed this by setting the size of mesh.bounds in the DrawMesh function (center being Vector3.zero and the size being a slightly different Vector3 depending on whether the hex is flat-topped or not)
The full code I added:
Vector3 boundSize = new Vector3( outerSize, height, outerSize );
if( isFlatTopped ){
boundSize.x *= 2f;
boundSize.z *= 1.75f;
}else{
boundSize.x *= 1.75f;
boundSize.z *= 2f;
}
mesh.bounds = new Bounds( Vector3.zero, boundSize );
what is the game at 0:47 ?
You can also just use "mesh.RecalculateBounds()" right after "mesh.RecalculateNormals()" in the "CombineFaces()" method.
@@GregX999 Awesome, didn't know this - thanks!
Damn this was definitely an amazing video that inspired me to choose hexagons as the general theme for my game :D
great vid, great explanations, love it +1 follower
Great explanation. That Red Blob's hex-site you mentioned is indeed an excellent resource.
Hex grid is actually a special case of the Voronoi diagram. Another curious pattern that all programmers should be aware of.
You know the tutorial is good when you already know the solution, but it's funny to watch and see the things being built and explained. :)
From which games did you use the clips in this video?
Also can you draw hexagon shaped grids, so all the hexagon tiles in a hexagon shape
Thank You
This Was a great video, albeit, I found myself not quite understanding what's going on where you used sin and cosin, but perhaps that's my job to actually study the link that you provided
I was Looking for procedural generation and this video was helpful to what things I must do, but I will probably not use a hex grid in the foreseeable future
awesome video thanks mate
Thank you so much!
Thank yiu for the tutorial, but it would be so much better if you explained what you were doing more and helped us visualize it. I was left a bit confused.
So from what I see, this creates multiple hexagon meshes and then aligns them side-by-side so that neighbouring vertices overlap. Is there a way to merge the overlapping vertices in a way that retains the triangle faces, so that something like a perlin noise algorithm could generate some cool terrain?
awesome as always
Yessss! I love this tutorial!!
Thanks, and waiting for the next video for thepathfinding and fog of war!
I am very excited for the pathfinding
Hello, this video is awesome!
Great tutorial, straightforward! Thanks.
One thing I noticed was forgetting to disable OnEnable drawing of mesh after implementing the HexGridLayout. Which was resulting in the grid creating 2 versions of itself. A sneaky catch that was leading to performance issues.
I have a question, maybe you have addressed already, but how would you approach giving each hex a collider to be raycasted/interacted with? I tried creating a MeshCollider based on the sharedMesh of the mesh we create but to no avail.
I'm not using anything like this right now in my projects, but I watched it anyways. Very informative and great production value. Next level!
Looking forward to the pathfinding and fog of war episodes!
Nice video, I was able to follow along just fine, and complete the project. Question: When I create the grid initially, it takes ~250ms. However, when it is recreated using OnValidate, it takes over 5 seconds. I then tested by just calling Invoke("LayoutGrid", 10f) in Start(), and changing the inner size before the 10s expired, and it again took only ~250ms. Why does it take ~20x longer to execute when called in OnValidate?
Awesome!!
Thanks for this guide, it helped me out a lot.
Anyone have tips for laying this grid on top of a plane programmatically?
I am eventually trying to project the grid overtop of terrain.
Step at a time.
Hello, does anyone know how I could outline the grid so that I could see the borders of the individual hexes? Thank you
Any advice for presenting/wrapping the grid around a sphere?
How do you use the script? What do you do after you've written it?
Very nice.
5:38 if you want to convert to radians Mathf has a Deg2Rad constant which is equal to Mathf.PI/180f
I thought the same thing but realised it’s always good to know the derivation of those constants too… some game engines don’t have them, and not all programmers use them.
@@j.j.maverick9252 I agree
Great video, looking forward to the next one. BTW one should NOT call DrawMesh() in OnValidate() because this creates a horrible race condition, as OnValidate() can be called before Awake() resulting in numerous null dereference attempts. Instead, OnValidate() can set a flag that Update() checks before calling DrawMesh(), or Awake() can set a flag that OnValidate() checks before calling DrawMesh(). I favour the former because the Unity docs for OnValidate() actually say that this function should not be used to create objects. It's only meant for validating existing data.
Bruh, i'm getting this error, and i don't know how to fix it (i'm more than a noob in programming), can you write here the code correction please?
@@OBrownie_ sorry I don't have the code any more - but from memory, instead of calling DrawMesh() in OnValidate(), just set a bool flag to true, and then in Update(), if the flag is true, then call DrawMesh(). This ensures that the mesh is only created in the Update phase, and never before Awake (which can happen sometimes because OnValidate() can be called before Awake() is). Hope this helps.
Nice!
I was one of the first subscribers of Sebastian Lague - and I'm so glad I found another eloquent, entertaining Unity content creator in his early days.
Trust me man, you're gonna make it big. Fantastic video.
Please make your code available on a repo so we don't have to spend 1h trying to figure out where we went wrong by copying manually.
Cool video. The background music is a bit distracting, though. Keep it up!
0:01 What kraków does there? I live in it. (Actually on a border)
Hi, I finished writing the code but how do i make it so it would automaically run after I start my program?
Tried to make a square board, when I looked all my squares got 6 sides, Hexagons are truly the bestagon.
At 04:08 my script material just shows none and when I add it as a component it just says none for material and mesh, any one know where I'm going wrong? Are you supposed to add it as a component to something specific?
You probably need to create a new GameObject (named "Hex") and add component > script (HexRenderer) to get to the next point in the video.
Made it all works except the last part with the grid, for that I slapped a prompt in ChatGPT and works now. It was confusing at times, but it's doable.
When I create m_mesh=new Mesh() later in the CombineFaces() I get NullReferenceException: Object reference not set to an instance of an object . After debugging tunes out that ,_mesh is still null. Been looking at this for a while now and cant figure out why.
I had the same issue, another commenter wrote the solution. In "OnValidate()" add "&& mesh != null" in the if statement, after Application.isPlaying
@@blizzzard900 cant confirm myself(not using the project anymore), but if anyone reading and trying this, please confirm if true
@@Tin_Protopixel I had the same problem, and using the check made it go away.
i am getting a CS0103 error for height, innersize and outersize for the Drawfaces method at the end.
i cant see any misstakes that i have made in my code, any help?
As some once famous youtuber said, Hexagons are the bestagons.
It’s looks really cool but how about with performance in this this solution. Can we just save somehow our procedurally generated hex as prefab and not calculated it each time when we want to display it?
What are the names of those games u showed as examples ?
Instant like for "Hexagons are the bestagons!"
I got a problem. For some reason my OnValidate is not working properly. I can change innerSize or outerSize but while changing it leaves like trace of tiles and they are not removing (
Also in LayoutGrid() i cant write tile.SetParent(transform, true); because .transform is missing - so i think may be it can cause my problem?
I'm having the same issue, did you manage to fix it?
@@jamesmamaliga4824 No
Did you try it with a newer version? Try changing it to:
tile.transform.SetParent(transform, true);
Maybe it helps.
@@MrYTThor Thank you!
The created tiles are not deleted. To achieve this, you can add a ClearGrid() to the onValidate():
Add a List of the created tiles:
private List tiles = new List();
Add all created tiles in the LayoutGrid to this List:
tiles.Add(tile);
Create a ClearGrid function:
private void ClearGrid()
{
foreach (GameObject tile in tiles)
{
Destroy(tile);
}
tiles.Clear();
}
Call the ClearGrid(); before LayoutGrid(); in your OnValidate().
I have an issue, hexagon is not rendered if it’s center is outside of my camera view 😢
What is the name of the game at 0:23, I can never remember the name and I've been wanting to play it
OPUS MAGNUM
When I am setting up the DrawFaces() Method, it is saying that innerSize, outerSize, height, and height don't exist in the current context. I already tried swapping them with innerRad, outerRad, heightA, and heightB, but it still didn't work. Does anyone know how to fix this?
6:24
Okay so I did everything just as in the video up until the point where the Hexagon should render but nothing happens. Since it wasnt stated in the video, I attached the Script to an Empty Gameobject so it would run but still nothing happens. Can anyone explain what type of Gameobject to attach the Script to or what I did wrong?
If you start out with an empty project, do the following: 1) add an empty gameobject 2) attach the HexRenderer.cs to it 3) position the camera so it looks at the object 4) press the Play button to run the scene
Also, check the other comments to sort out some issues since there are changes done to the code that are not highlighted in the video.
For anyone wondering why it's not working on newer versions of Unity you need to comment out the OnValidate method and replace the OnEnable method with Update. This will make sure it draws every frame like in the video, just won't work in the editor.
What is the game at 0:08? The art style is awesome.
Youre epic. Just epic.
0:27 what game is it?
I'm on Unity 2022.3.13f1 and cannot get even the base mesh to render... I have no idea what's going wrong. Has anyone else encountered this?
I can't seem to show my hex in the scene . The only way I can see my hex is by hitting the play button. Is there is a download link for the code maybe I miss something
i have the content downloaded from patron it just made it worst. i just want this thing to show up in scene lol.
Does anyone know what game that is at 0:23 ?
I've been looking to play that game!
Edit: for anyone wondering the game is called Opus Magnum by Zachtronics
Thanks
What's the game at 0:08-0:10? Looks awesome
What is the name of the game at 0:47???
I copied your code on screen exactly and it didn't output anything but errors. Is it because you switched terms without correcting the edit? For example, the private void DrawFaces had very similar code to the private void DrawMesh.
I have the same problem that there is no output but two errors.I cant find any difference between video and my codes.
Glad I'm not the only one. I've tried the fixes put forward by other commenters and none of them work. Would be nice to see the script in full at the end of writing. :/
@@junjiepeng Two Errors. Perhaps we have the same ones. HexRenderer does not contain a definition for SetMaterial, and same thing for GameObject ... Set Parent. If I find solution, I will post it here. Just starting to get back into code after years and years haitus, and I was never that proficient, so I expect to run into a lot of errors.
Copying the code from the video is really difficult, it changes slide to slide as he fixes errors between shots. This is not to mention that I have no doubt mistyped something, it makes following the tutorials and actually getting something working to play around with very difficult, but I just can't learn on theory only. Would be good to see the final clips of the script.
Okay I've found the problem. At some point, UnityEngine stopped allowing a bunch of the components of GameObject to be referenced. Don't know how long ago this change happened, can't find any documentation on the update itself. SetParent is now part of Transform, so the correct line here is
tile.transform.SetParent(transform, true);
The SetMaterial on the other hand doesn't exist at all, only as part of a CanvasRenderer. This line just appears to be completely wrong. In this part of the code we are creating GameObjects of type HexRenderer, referencing the variables at the top of the HexRenderer script, and assigning to them the variables in this script. So the material should be the same pattern as all the other variables we used.
hexRenderer.material = material;
I think, I could be wrong, but the errors go away with these changes. Hope this helps. Annoying that the video is either already out of date after a year, or just riddled with mistakes. Clearly a lot of work has been put into making the video, but its a big barrier to learning that videos need to be basically perfect and released a day ago to be even functional.
Even after fixing these errors, I still have a lot of tweaking to do to even get Hexagons appearing, which I see is a problem many others were having.
@@Liamneedham29 Got those same 2 errors
Think this needs an update, tried doing this is Unity 2021.3.19f1 and while I can make a grid, I get a tonne of warnings thrown out about "Send message cannot be called during Awake, CheckConsistency, or OnValidate" - If I comment out the 'On validate' sections the grid won't generate, but if I leave them in, when I update the grid size it leaves the hexes that should disappear causing a mess of gameobjects.
Also, even though the code is carbon-copy of what's show, when I invert into the 'IsFlatTopped', the hexes will move but they're not aligned properly.
I have the same problem. Were you able to fix it?
You shouldn't just arrange the hexagons next to each other; you should check if there is a neighboring hex and not redraw those edges. You'll save a huge number of tris and verts.
the hexRenderer.SetMaterial(material) is giving an error in unity saying the HexRenderer script does not contain a definition for SetMaterial, Anybody know the fix around that?
Why doesn't the hex gameobject appear in my hierarchy after 4:12 ? I've checked spelling etc a few times already and everything is the same as in the video. There are no errors
Iv'e got this problem, did you find a solution?
@@dptgames2254 I had this problem, I think I needed to create an empty GameObject to attach the script to
I wonder, since you're creating groups of faces and then just sticking the returned values in an array, are you not just duplicating some vertices? For a single solid hex that has a height, you should only have 12 vertices per hex. This seems like you'd have 36. This would obviously double with the hollow inner version. I didn't see any correcting code on the vertices array merge.
So this decision is mostly due to the way UV Mapping works in Unity. If you want clean UVs easily you need to define unique vertices. If you don't care as much about UVs, sharing vertices is a lot more optimal.
You can actually go as low as 6 vertices and 4 triangles per hex.
How are you managing the children of the HexLayout GameObject? This part isn't shown in the video ... the way it is presented is calling LayoutGrid() inside OnValidate() and this causes a re-creation of the entire HexGrid on top of the existing one - on every single tick of OnValidate. As workaround, I added a short cleanup before calling LayoutGrid to wipe away all children of the HexGrid before creating a new one, but this doesn't seem to be the most efficient way of doing things.
i wish there was good programming tutorials like this for unreal engine :/
and c++ feels more complex anyway ..
ı try to write same code to develop my skills but in the point of we create "m_faces.Add(CreateFace(innerSize,outerSize,height/2f,height/2f,point));" this code ı have an error which is "the name innerSize does not exist in the current context" but we use that name to refer to
"private Face CreateFace(float innerRad, float outerRad, float heightA, float heightB, int point, bool reverse = false)" but it doesnt work can anyone help me about this error
o after that you showed the creation of public float innerSize codes okey ı am fine now :D but how can you do that unity drawing things ı couldnt see that
What game is that at 0:28 ?
Before We Leave
What is this game 0:24?
10:28 Kraków lol
you need to paste the code in the description or github bc for me a lot of stuff is underlined in red and im not sure why. its cool that this stuff is possible but seems a little out of reach for me rn without more help. thanks though
The music is too loud :c Great video