点击上方亿元程序员+关注和★星标
引言
一文告诉你三国志战略版中用到的六边形网格地图的原理。
传统的正方形网格地图：
与许多 传统战略游戏使用的正方形网格不同，《三国志战略版》采用了错位的正方形网格，可以理解成六边形网格的变种。
"六边形"网格地图：
本文将介绍 一下六边形网格地图 的原理，以及如何在Cocos Creator 中实现一下六边形网格地图，非常详细。
本文源码和源工程在文末获取，小伙伴们自行前往。
1.什么是六边形网格地图？
想象一下蜜蜂的蜂巢，或者一些策略游戏的地图，那就是最典型的六边形网格。
它是由正六边形这一种图形，以边对边的方式无缝、无重叠地铺满整个平面。
我们接着来看。
2.六边形网格地图有什么特点？
以下是六边形网格地图的主要特点：
-
方向：比传统的方形网格多2个方向，即6个方向。
-
距离：一个格子有且只有6个邻居，且中心到所有邻居中心的距离完全相等。
话不多说，一起来看下如何在Cocos Creator中实现一个六边形网格地图
3.一起来实现一个六边形网格地图
我们根据 以下的步骤一步一步来实现一个2D版本的六边形网格地图：
1.环境
引擎版本：Cocos Creator 3.8.7
编程语言：TypeScript
2.资源准备
简单找两个六边形格子分别表示地图格子的不同状态，再找一个其他图片作为主角。
然后 将资源放进去项目，并且简单制作一下地图格子 的预制体和主角的预制体，方便生成。
3.编写代码
首先 新建一个Main.ts脚本，简单预制一下地图数据，演示用，可以通过配置加载。
其中 0=空地，1=障碍物，2=玩家起点
然后绑定一下预制体、图片和切换关卡按钮，以及一些常量的定义。
将脚本拖拽到节点上，然后就可以进行绑定：
然后 在start中初始化游戏，以及绑定按钮事件。点击模拟进入下一关。
其中初始化游戏包括：
-
清理上一关的内容
-
获取当前关卡配置数据
-
创建关卡
创建关卡的关键在于：
- 1.格子坐标的计算
偶数行的格子向右偏移1/4个宽度。
- 2.格子和主角的创建
instantiate克隆预制体。
addChild添加到游戏世界。
- 3.突出主角
为了突出主角，我们给主角加个简单的上下动的tween动画。
4.效果演示
结语
本章 的核心在于格子坐标的偏移和获取，下一章我们将介绍六边形网格地图的寻路 ，记得关注我，帮我点赞 和推荐哦！
本文源工程 可通过私信 发送 HexagonalGrid 获取。
我是"亿元程序员"，一位有着8年游戏行业经验的主程。在游戏开发中，希望能给到您帮助, 也希望通过您能帮助到大家。
AD:笔者线上的小游戏《打螺丝闯关》《贪吃蛇掌机经典》《重力迷宫球》《填色之旅》《方块掌机经典》大家可以自行点击搜索体验。
实不相瞒，想要个赞 和在看 ！请把该文章分享给你觉得有需要的其他小伙伴。谢谢！
推荐专栏：