Cocos2d-x 地图行走的实现1:图论与Dijkstra算法

 下一节《Cocos2d-x 地图行走的实现2:SPFA算法》:

  http://blog.csdn.net/stevenkylelee/article/details/38440663


  本文乃Siliphen原创,转载请注明出处:http://blog.csdn.net/stevenkylelee


  本文的实现使用的环境是:Cocos2d-x 3.2,VS2013


  本文,我们最终实现的地图行走效果如下2图:


  下面是2张屏幕录制的gif动画图,有点大,看不到的话,耐心等待一下,或者刷新页面试试。




  地图行走用于现实的地图上。





1.什么是地图行走

  很多游戏会有一个“世界”的概念。玩家在这个世界中行走,到达不同的地方去执行的任务,打怪或者是触发剧情等。下图是《锁链战记》的世界地图的截图。




  不同游戏的世界地图行走表现不同,以锁链战记为例,对于打过的关卡,玩家角色是直接瞬移过去的。对与未打过的关卡,有一个玩家角色行走过去的动画。另一些游戏的地图行走则是到达任何地方都有玩家角色的行走动画。我个人比较青睐于后者。《锁链战记》的瞬移设计,可能是出于这样的考虑:行走动画的播放需要耗费时间,有时候看起来比较烦,拖慢游戏节奏。但行走动画,有一个“走过去的过程”,能更加表现现实,更有代入感。这是一个游戏策划的问题了,到底是瞬移过去,还是走过去。一个折中的方案是,任何行走都控制在指定的一段时间内完成。这样既有代入感也不会拖慢游戏节奏。

  一般来说,制作行走过程要比直接瞬移复杂。做出了行走过程要改成瞬移是不难的,但反之则有点麻烦。所以,下面我们先实现地图行走。

2.图论简介

  仔细观察游戏的世界地图就会发现,除去界面表现后,地图的结构非常类似《离散数学》或《数据结构》中的图论。图论的图表示如下图所示:




  上图中,实心圆形在图论中叫做顶点(Vertex),连接2个顶点之间的线段叫做边(Edge)。顶点和边都是抽象的,顶点没有几何位置信息,边通常只是表示2个顶点之间有通路和这条通路的路过的代价。代价也是一个抽象的概念,上图中,顶点A到顶点B的代价是7,可以表示城堡A到城堡B的路程是7公里,也可以表示城堡A到城堡B的路费是7英镑。


  下图中,图1和图2是等价的,尽管它们的几何形态不同。




  判断它们相同的依据是:顶点相同,边相同,边上的代价也相同。因为顶点没有几何位置信息,所以把顶点A放在任何几何位置都可以,只要它到顶点B的代价不变(7),到顶点C的代价不变(20)。如果A到B的代价改变了,从7变到了50,那么图就改变了,尽管顶点A、B的几何位置不变。老实说,图论的这种抽象,让我刚接触图论时多少有点不适应。(学美术出身的我总是会关注图像的形态,之前总是觉得看起来的样子不同就是不同)但这种抽象恰恰是数学和编程解决问题的精妙之处。

  以上说的是无向图。无向图就是图的边是没有方向的。如果,顶点A到顶点B之间有一条边,就认为可以从A到B也可以从B到A。还有另一种图是有向图,有向图如下所示:




  有向图就是图的边是有方向的。如上图所示,顶点A到顶点B有一条有向边,但这条边只表示能从A到B,而B没有一条到A的有向边,所以不能从B直接到A。从B到A只有先到C再从C到A。有向图有自己的一些概念术语,顶点A和顶点B之间的那条边,对于顶点A来说叫做出度,对于顶点B来说叫做入度。为了让解释更加易懂,下面我们称出度叫出边,入度叫入边吧。

  有向图一般用来表示什么含义呢?某些城市的某些路段是车辆单行线的,因为某种原因,扩路困难但同时某个方向的车流量又大,所以规定车辆只能往一个方向走。这种情况就可以用有向图来表示了。

  上图中,顶点B到顶点C的代价是8,而反过来顶点C到顶点B的代价是50。这又是什么情况呢?

  情况1:假设B是山顶位置,C地山底位置,从山顶徒步下山耗费的体力是8,而要徒步上山耗费的体力是50。C到B还可以另加一条代价是1的边。表示坐缆车上山只需要耗费1的体力。这种建模,可以用来做某种策略的计算,比如:计算最节省体力达到山顶的策略。

  情况2:图可以表示从一点到另一点驾车所耗费的时间。Siliphen驾车从家B出发,到达了途中的一个位置C,这时突然想起有一个重要文件落在家B了,需要回去取。B到C的时间是8分钟,而因为路况问题,下班车辆单向高峰期等原因,从C到B需要50分钟。Siliphen回家取文件的最快策略应该是先花费20分钟开车到A,再从A花费7分钟到B。总体耗时27分钟。

  可以看到有向图很有用,可以为情况建模并设计算法去计算出要达到某种目的的策略。

  有向图可以用2条有向边来模拟无向图的一条无向边。如下图所示:




3.图论的数据结构的实现

  图是一种很重要的数据结构。路径寻找、人工智能、策略选择等都会用到。

  一般来说有向图能够比无向图表达更多的内容,同时有向图也能够模拟出无向图。所以,这里我们选择实现有向图。

  我们的目标是:“自己写一个图论的数据结构的类封装,在这里可以用来表示世界地图和寻路计算。也可以作为不同的使用目的、用在别的使用不同技术的项目中,例如:QT,MFC等。”

  要做类封装,第一件事就是抽象出类了,什么东西应该成为一个类。我个人有一个经验:你看到的或者你意识到存在的东西都可以考虑定为一个类。从图中,我们看到了顶点和边。OK,我们有2个类了:class Vertex,class Edge。顶点和边的集合构成一张图。OK,class Graph 类有了。

  图的数据结构表示通常有2种。1.邻接矩阵 2.邻接表。邻接表较为常用。如果邻接表的顶点类只保存其出度的信息,对于查询该顶点的入度信息就比较麻烦了,需要遍历其他所有的顶点来确定哪些顶点的出度是指向该顶点的。所以,也可以增加一个入度信息表来方便查询入度信息,这个做法称为逆邻接表。

  我的封装实现是邻接表,顶点类Vertex有出边信息也有入边信息。因为,需要维护入边信息,所以插入、删除顶点和边的操作会复杂一些。

  下面是我的有向图的封装的实现代码:

头文件:

  1. #pragmaonce
  2. #include<vector>
  3. #include<unordered_map>
  4. usingnamespacestd;
  5. classEdge;
  6. classVertex;
  7. classGraph;
  8. classGraphPathfinding;
  9. /*
  10. 图顶点
  11. */
  12. classVertex
  13. {
  14. friendclassGraph;
  15. friendclassGraphPathfinding;
  16. friendclassDijkstra;
  17. public:
  18. Vertex(conststring&Name)
  19. {
  20. m_strId=Name;
  21. m_Cost=0;
  22. m_pGraph=0;
  23. }
  24. ~Vertex(){};
  25. public:
  26. //附加数据
  27. unordered_map<string,void*>UserData;
  28. public:
  29. constunordered_map<string,Edge*>&GetEdgesOut()const{returnm_EdgesOut;}
  30. constunordered_map<string,Edge*>&GetEdgesIn()const{returnm_EdgesIn;}
  31. conststring&GetId()const{returnm_strId;}
  32. conststring&GetText()const{returnm_Text;}
  33. voidSetText(conststring&Text){m_Text=Text;}
  34. Graph*GetGraph(){returnm_pGraph;}
  35. protected:
  36. //出边集合
  37. unordered_map<string,Edge*>m_EdgesOut;
  38. //入边集合
  39. unordered_map<string,Edge*>m_EdgesIn;
  40. //节点表示的字符串
  41. stringm_Text;
  42. //节点的ID
  43. stringm_strId;
  44. //用于寻路算法。路径代价估计
  45. intm_Cost;
  46. //所属的图
  47. Graph*m_pGraph;
  48. };
  49. /*
  50. 图顶点的边
  51. 有向边
  52. */
  53. classEdge
  54. {
  55. friendclassGraph;
  56. public:
  57. Edge()
  58. {
  59. m_Weight=0;
  60. m_pStartVertex=m_pEndVertex=0;
  61. }
  62. Edge(Vertex*pStartVertex,Vertex*pEndVertex,intWeight=0)
  63. {
  64. m_Weight=Weight;
  65. m_pStartVertex=pStartVertex;
  66. m_pEndVertex=pEndVertex;
  67. }
  68. public:
  69. intGetWeight()const{returnm_Weight;}
  70. voidSetWeight(intvar){m_Weight=var;}
  71. Vertex*GetStartVertex()const{returnm_pStartVertex;}
  72. Vertex*GetEndVertex()const{returnm_pEndVertex;}
  73. protected:
  74. //边的权值
  75. intm_Weight;
  76. //起点的顶点
  77. Vertex*m_pStartVertex;
  78. //终点的顶点
  79. Vertex*m_pEndVertex;
  80. };
  81. /*
  82. 图.
  83. 图会负责释放顶点和边的内存
  84. */
  85. classGraph
  86. {
  87. public:
  88. Graph();
  89. ~Graph();
  90. public:
  91. //添加一个顶点
  92. voidAddVertex(Vertex*pV);
  93. //删除一个顶点
  94. voidDeleleVertex(conststring&VertexName);
  95. //添加一条边。返回边对象
  96. Edge*AddEdge(conststring&Vertex1Name,conststring&Vertex2Name,intWeight=0);
  97. //删除一条边
  98. voidDeleteEdge(conststring&StartVertexName,conststring&EndVertexName);
  99. public:
  100. constunordered_map<string,Vertex*>&GetVertexes()const{returnm_Vertexes;}
  101. protected:
  102. //顶点的集合
  103. unordered_map<string,Vertex*>m_Vertexes;
  104. //边的集合。Key的格式“顶点1name->顶点2name"
  105. unordered_map<string,Edge*>m_Edges;
  106. protected:
  107. #defineGetEdgeKey(pV1,pV2)(pV1->m_strId+"->"+pV2->m_strId);
  108. };

  实现文件:


  1. #include"Graph.h"
  2. Graph::Graph()
  3. {
  4. }
  5. Graph::~Graph()
  6. {
  7. //释放所有顶点
  8. for(auto&kv:m_Vertexes)
  9. {
  10. deletekv.second;
  11. }
  12. //施放所有的边
  13. for(auto&kv:m_Edges)
  14. {
  15. deletekv.second;
  16. }
  17. }
  18. voidGraph::AddVertex(Vertex*pV)
  19. {
  20. if(m_Vertexes.find(pV->GetId())!=m_Vertexes.end())
  21. {
  22. //已经存在相同Key的顶点
  23. }
  24. m_Vertexes[pV->GetId()]=pV;
  25. pV->m_pGraph=this;
  26. }
  27. voidGraph::DeleleVertex(conststring&VertexName)
  28. {
  29. Vertex*pV=m_Vertexes.find(VertexName)->second;
  30. //遍历要删除的节点的出边
  31. for(autoit=pV->m_EdgesOut.begin(),end=pV->m_EdgesOut.end();it!=end;++it)
  32. {
  33. Edge*pEdgeOut=it->second;
  34. //删除入边记录
  35. pEdgeOut->m_pEndVertex->m_EdgesIn.erase(VertexName);
  36. //在边集合列表中删除
  37. stringkey=GetEdgeKey(pV,pEdgeOut->m_pEndVertex);
  38. m_Edges.erase(key);
  39. //删除边对象
  40. deletepEdgeOut;
  41. }
  42. deletepV;
  43. }
  44. Edge*Graph::AddEdge(conststring&Vertex1Name,intWeight/*=0*/)
  45. {
  46. Vertex*pV1=m_Vertexes.find(Vertex1Name)->second;
  47. Vertex*pV2=m_Vertexes.find(Vertex2Name)->second;
  48. //加入边集合
  49. Edge*pEdge=newEdge(pV1,pV2,Weight);
  50. stringkey=GetEdgeKey(pV1,pV2);
  51. m_Edges[key]=pEdge;
  52. //加入V1的出边
  53. pV1->m_EdgesOut[Vertex2Name]=pEdge;
  54. //加入V2的入边
  55. pV2->m_EdgesIn[Vertex1Name]=pEdge;
  56. returnpEdge;
  57. }
  58. voidGraph::DeleteEdge(conststring&StartVertexName,conststring&EndVertexName)
  59. {
  60. Vertex*pV1=m_Vertexes.find(StartVertexName)->second;
  61. Vertex*pV2=m_Vertexes.find(EndVertexName)->second;
  62. stringkey=GetEdgeKey(pV1,pV2);
  63. Edge*pEdge=m_Edges.find(key)->second;
  64. //在顶点1的出边列表中删除
  65. pV1->m_EdgesOut.erase(EndVertexName);
  66. //在顶点2的入边列表中删除
  67. pV2->m_EdgesIn.erase(StartVertexName);
  68. //在边集合列表中删除
  69. m_Edges.erase(key);
  70. deletepEdge;
  71. }

  说明下以上代码的设计。

  要增加一个图顶点。需要先为顶点确定一个字符串类型的ID,new一个Vertex对象出来,然后Graph::AddVertex把顶点加入到图中。Graph管理顶点对象的释放,不用手动delete。

  有一种设计是:Graph::NewVertex(); 用图类对象来创建顶点。表明这个顶点对象的内存由Graph来管理。TinyXml库的接口就是这样的。考虑到可能用户要继承自Vertex派生出自己的顶点类,所以没采用这种设计。

  这里我们的图是用在cocos2d-x中作为地图行走的,有些人觉得Vertex类应该继承自Node。假如这样做的话,我们的图数据结构就依赖于cocos2d-x库了。尽管,我们是用在cocos2d-x的项目中,但为了通用考虑,应该尽量设计得与cocos2d-x无关。所以,我只用了C++语言本身来实现。考虑下这种情况,某一天策划需要一个完善的地图编辑器,可以编辑关卡内要触发的事件或者是敌人的生成规则。这种情况,由于cocos2d-x内置的控件较少,我们可能需要用QT写一个编辑器,这时,我们的图数据结构也可以放到QT的项目中使用。

  地图行走上的节点涉及到了表现,我们可以另写一个类:class MapWalkVertex : public Node。MapWalkVertex 和Vertex互相关联,互相保存一个对方的引用(指针)。图类与图顶点类、地图行走的节点的关系如下:



  MapWalkVertex头文件 代码如下:


  1. #pragmaonce
  2. #include"cocos2d.h"
  3. USING_NS_CC;
  4. classVertex;
  5. classMapWalkVertex:
  6. publicNode
  7. {
  8. public:
  9. MapWalkVertex();
  10. ~MapWalkVertex();
  11. public:
  12. CREATE_FUNC(MapWalkVertex);
  13. boolinit();
  14. public:
  15. voidSetGraphVertex(Vertex*Var){m_pGraphVertex=Var;}
  16. Vertex*GetGraphVertex(){returnm_pGraphVertex;}
  17. private:
  18. Vertex*m_pGraphVertex;
  19. };

  我们的Vertex并没有MapWalkVertex类型的字段。它怎么关联到MapWalkVertex对象呢?我们的Vertex有一个字段:unordered_map<string,void*> UserData ; 这个字段模拟了“动态属性”。要关联MapWalkVertex对象对象可以这样做:


  1. Vertex*pVtx=newVertex(“A”);
  2. MapWalkVertex*pMwv=MapWalkVertex::create();
  3. //互相关联起来
  4. pVtx->UserData[“mwv”]=pMwv;
  5. pMwv->SetGraphVertex(pVtx);
  6. //要取得图顶点关联的地图行走的节点可以这样做
  7. MapWalkVertex*pMwv2=(MapWalkVertex*)pVtx->UserData[“mwv”];

  在使用上,这样做有点绕,有点麻烦,互相关联来关联去的。设计可复用的组件就要在使用上付出一定的代价,没办法。

4.图编辑器的实现思路

  一般编辑器应该用普通应用软件开发的技术来做。如:Winform,QT,MFC等。这里方便起见,图的编辑也在cocos2d-x中做了。做可视化的图形编辑器首先是定义操作状态类型。比如:鼠标点了一点屏幕,这个操作是放置人物,还是放置一个节点。像Photoshop这样的软件,在画布上点了一点,是用画笔点画了一下,还是用魔棒选取工具做了选择。操作状态类型就是用来区分动作(比如,点击)的不同含义。

  操作状态定义如下:


  1. //操作模式状态
  2. enumclassOperationMode
  3. {
  4. //放置顶点
  5. PutVertex,
  6. //拖曳场景
  7. DragContent,
  8. //拖曳边
  9. DragEdge,
  10. //放置角色
  11. PositionRole,
  12. //行走
  13. RoleWalk,
  14. };

  然后,我们在onTouchBegan,onTouchMoved, onTouchEnded 3个触摸函数中针对不同情况做不同的处理。

  由于编辑处理的代码较多,就不直接贴代码了,截图演示一下大概的思路。




  这也是手游实现复杂操作的一种处理方法。在不同的操作状态下,执行不同的代码。状态的切换大部分是通过按下左边的按钮。如下图:




  这组按钮是用CocoStudio的UI编辑器做的。善用各种工具,事半功倍。

  有必要说下顶点之间边和拖曳边的显示的实现。该操作如下图:




  边的显示,其实是一张图片。如何让一个Sprite当作直线来用呢?先准备一个水平线段的图片,大小没关系,可以用10*5像素。有2个操作:1.算出起点到终点的长度,根据长度进行Sprite的缩放。2.起点到终点是一条直线,计算这条直线与水平的角度,Sprite进行相应的旋转。

  实现代码如下:


  1. voidLayerMapWalk::MakeLine(Sprite*pSpr,constPoint&pt1,constPoint&pt2)
  2. {
  3. //设置锚点与位置
  4. pSpr->setAnchorPoint(Point(0,0.5));
  5. pSpr->setPosition(pt1);
  6. //缩放
  7. floatwidth=pSpr->getTexture()->getContentSize().width;
  8. autov=pt2-pt1;
  9. floatlen=v.getLength();
  10. floatScaleX=len/width;
  11. pSpr->setScaleX(ScaleX);
  12. //旋转
  13. floatrad=v.getAngle();
  14. floatRotation=CC_RADIANS_TO_DEGREES(-rad);
  15. pSpr->setRotation(Rotation);
  16. }

5.图数据结构的保存和载入

  我们编辑好的图,需要持久化。下次可以载入使用。对于地图行走节点需要保存的信息有:顶点ID,节点的位置。边需要保存的信息有:起始顶点的ID,终点顶点的ID,边上的权值

  我们选择用xml进行保存。Cocos2d-x集成有TinyXml库,读写xml是比较方便的。



  上图中的图,保存为xml后的数据是这样:


  1. <Graph>
  2. <Vertexes>
  3. <VertexId="938"x="505.957"y="358.936"/>
  4. <VertexId="721"x="411.113"y="206.187"/>
  5. <VertexId="64"x="599.803"y="267.086"/>
  6. </Vertexes>
  7. <Edges>
  8. <EdgeStartVertexId="938"EndVertexId="64"Weight="131"/>
  9. <EdgeStartVertexId="938"EndVertexId="721"Weight="179"/>
  10. <EdgeStartVertexId="721"EndVertexId="64"Weight="198"/>
  11. <EdgeStartVertexId="721"EndVertexId="938"Weight="179"/>
  12. <EdgeStartVertexId="64"EndVertexId="721"Weight="198"/>
  13. <EdgeStartVertexId="64"EndVertexId="938"Weight="131"/>
  14. </Edges>
  15. </Graph>

  咦,图中有3条边,为什么保存为xml后,有6条边的信息?回顾下之前,我们实现的是有向图的数据结构,有向图模拟无向图,就是多加一条反向的有向边。所以有向图模拟无向图,有向图边的数量是无向图边的数量的2倍。

  图数据的保存和读取,也就是场景数据的持久化,我们可以用一个单独的类来做。避免Layer层的代码过多。我们写的类叫:MapWalkConfigManager(地图行走配置管理器)。

  该类头文件代码:


  1. #pragmaonce
  2. #include<string>
  3. usingnamespacestd;
  4. classLayerMapWalk;
  5. classMapWalkConfigManager
  6. {
  7. public:
  8. MapWalkConfigManager();
  9. ~MapWalkConfigManager();
  10. public:
  11. staticvoidLoad(conststring&ConfigFileName,LayerMapWalk*pLayerMapWalk);
  12. staticvoidSave(conststring&ConfigFileName,LayerMapWalk*pLayerMapWalk);
  13. };

  Cpp代码


  1. #include"MapWalkConfigManager.h"
  2. #include"LayerMapWalk.h"
  3. #include"MapWalkVertex.h"
  4. #include"tinyxml2/tinyxml2.h"
  5. usingnamespacetinyxml2;
  6. MapWalkConfigManager::MapWalkConfigManager()
  7. {
  8. }
  9. MapWalkConfigManager::~MapWalkConfigManager()
  10. {
  11. }
  12. voidMapWalkConfigManager::Load(conststring&ConfigFileName,LayerMapWalk*pLayerMapWalk)
  13. {
  14. tinyxml2::XMLDocumentdoc;
  15. doc.LoadFile(ConfigFileName.c_str());
  16. unordered_map<string,MapWalkVertex*>m_MwvList;
  17. autopElemRoot=doc.RootElement();
  18. //读取顶点的信息。创建出相应的顶点在界面上显示
  19. autopElemVertexes=pElemRoot->FirstChildElement("Vertexes");
  20. for(autopElem=pElemVertexes->FirstChildElement();pElem!=0;pElem=pElem->NextSiblingElement())
  21. {
  22. stringstrId=pElem->Attribute("Id");
  23. floatx=atof(pElem->Attribute("x"));
  24. floaty=atof(pElem->Attribute("y"));
  25. autopMwv=MapWalkVertex::create();
  26. pMwv->setPosition(x,y);
  27. pLayerMapWalk->AddVertex(pMwv,strId.c_str());
  28. m_MwvList[strId]=pMwv;
  29. }
  30. //读取边的信息。创建出相应的边。
  31. autopElemEdge=pElemRoot->FirstChildElement("Edges");
  32. for(autopElem=pElemEdge->FirstChildElement();pElem!=0;pElem=pElem->NextSiblingElement())
  33. {
  34. stringv1Id=pElem->Attribute("StartVertexId");
  35. stringv2Id=pElem->Attribute("EndVertexId");
  36. intWeight=atof(pElem->Attribute("Weight"));
  37. pLayerMapWalk->AddEdge(m_MwvList[v1Id],m_MwvList[v2Id]);
  38. }
  39. }
  40. voidMapWalkConfigManager::Save(conststring&ConfigFileName,LayerMapWalk*pLayerMapWalk)
  41. {
  42. tinyxml2::XMLDocumentdoc;
  43. autopElemGraph=doc.NewElement("Graph");
  44. doc.InsertEndChild(pElemGraph);
  45. autopElemGvRoot=doc.NewElement("Vertexes");
  46. pElemGraph->InsertEndChild(pElemGvRoot);
  47. //保存顶点信息
  48. for(size_ti=0;i<pLayerMapWalk->m_MapWalkVertexes.size();++i)
  49. {
  50. autopMwv=pLayerMapWalk->m_MapWalkVertexes[i];
  51. autopElemGv=doc.NewElement("Vertex");
  52. pElemGv->SetAttribute("Id",pMwv->GetGraphVertex()->GetId().c_str());
  53. pElemGv->SetAttribute("x",pMwv->getPositionX());
  54. pElemGv->SetAttribute("y",pMwv->getPositionY());
  55. pElemGvRoot->InsertEndChild(pElemGv);
  56. }
  57. autopElemEdgeRoot=doc.NewElement("Edges");
  58. pElemGraph->InsertEndChild(pElemEdgeRoot);
  59. //保存边的信息
  60. for(size_ti=0;i<pLayerMapWalk->m_MapWalkVertexes.size();++i)
  61. {
  62. autopMwvStart=pLayerMapWalk->m_MapWalkVertexes[i];
  63. autopVS=pMwvStart->GetGraphVertex();
  64. //遍历所有出边
  65. constauto&Eo=pVS->GetEdgesOut();
  66. for(auto&it:Eo)
  67. {
  68. autopElemEdge=doc.NewElement("Edge");
  69. autopEdge=it.second;
  70. autopVE=pEdge->GetEndVertex();
  71. pElemEdge->SetAttribute("StartVertexId",pVS->GetId().c_str());
  72. pElemEdge->SetAttribute("EndVertexId",pVE->GetId().c_str());
  73. pElemEdge->SetAttribute("Weight",pEdge->GetWeight());
  74. pElemEdgeRoot->InsertEndChild(pElemEdge);
  75. }
  76. }
  77. doc.SaveFile(ConfigFileName.c_str());
  78. }

6.经典的最短路径算法Dijkstra

  到此为止,图的创建、编辑、保存、载入都做完了。是时候让玩家角色实现地图行走了。一般角色从一点到另一点走的是一个最短路径,而不会是乱走。

  图的最短路径的计算,需要依赖边上的权值。这里我们需要计算的是一点到另一点在几何距离上最短的路径,所以我们边上的权值就是2个顶点的几何距离。这个在编辑图创建边的时候计算好。

  计算图最短路径的算法很多,这里介绍并实践经典的Dijkstra算法。Dijkstra的执行类似BFS(广度优先搜索),并且使用了贪心策略。很多最短路径算法都使用了一种叫做“松弛(Relax)”操作,Dijkstra也不例外,Relax是个怎样的操作呢?

  松弛是针对边的,但可能会改变出边终点对应的顶点的路径代价估计值。顶点的路径代价估计值又是什么?要计算最短路径,每个顶点还需要一个属性,这个属性就是路径代价估计。回头看看Vertex类的代码,找到一个int m_Cost ; 的字段,这个字段就是路径代价估计。

  一个顶点的路径代价估计属性表示从起始顶点出发到达该顶点所花费的代价。这个花费的代价是怎样计算出来的呢?通过累加边上的权值。看下图:




  从A点出发,目的地是D。A到C边上的权值是1,A到B边上的权值是5。A的路径估计为0,因为它到起点的代价为0,显然,自己到自己是无代价的。C的路径代价是1。因为从A到C的边上的权值是1。B的路径代价是5,因为从A到B的边上的权值是5。D有2个可能的路径代价值,8和11。8是B本身的路径代价值加上B到C边上的权值,11是C本身的路径代价值加上从C到D边上的权值。最短路径就是,路径代价相加起来最小的那条路径。显然,A到B的最短路径是A- >B->D,而不是A->C->D。

  一开始,我们只知道起点A的路径代价为0,B和C的路径代价都是不知道的,但我们知道从A到C和B的边上的权值。通过A路径代价值和边权值的累加,我们就可以知道B和C的路径代价了。OK,来看看Relax对出度顶点的路径代价的影响。

  Relax松弛A到B的边。如果A的路径代价加上边上的权值的和小于B的路径代价的值,就把B的路径代价值更新为这个和。

  中文伪代码是这样:


  1. voidRelax(顶点1,顶点2,顶点1到顶点2边上的权值)
  2. {
  3. intn=顶点1的路径代价+顶点1到顶点2边上的权值;
  4. 如果n小于顶点2的路径代价
  5. {
  6. 顶点2的路径代价=n;
  7. }
  8. }

  结合我们的图数据结构代码,Relax的C语言代码是这样:


  1. voidRelax(Vertex*pVertex1,Vertex*pVertex1,intWeight)
  2. {
  3. intn=pVertex1->m_Cost+Weight;
  4. If(n<pVertex2->m_Cost)
  5. {
  6. pVertex2->m_Cost=n;
  7. }
  8. }

  注意,这里是顶点1到顶点2的出边。Relax只可能会修改顶点2的路径代价值,而不会修改顶点1的。理解了Relax对顶点的路径代价的影响后,我们模拟这样一个过程:

  1.对所有顶点的路径代价值进行初始化,比如都为1000。然后设置起点A的路径代价值为0。

  2.对A的所有出边进行松弛,B的路径代价会被更新为5,C的路径代价会被更新为1。

  3.对B的所有出边进行松弛,D的路径代价会被更新为8。

  4.对C的所有出边进行松弛,D的路径代价不变。因为11大于8,不满足Relax 函数里面的判断条件。

  Relax实际上是“紧缩”出边终点上的顶点的路径代价,让路径代价值不断变小。通过模拟这样一个过程,我们发现找到了D的最短路径的路径代价值8。但我们没有记录这个相加边权值的路径是怎样走过来的。要记录路径,我们可以用一个哈希映射表,比如:unordered_map< Vertex*,Vertex* > PathTree ;

  PathTree[pVertex2] = pVertex1 ; 表示设置pVertex1顶点的前驱路径顶点是pVertex2。完整的Relax操作不光是改进出边终点顶点的路径代价估计值,还会更新出边终点顶点的前驱顶点。完整的Relax操作C代码如下:


  1. voidRelax(Vertex*pVertex1,Vertex*pVertex2,intWeight,unordered_map<Vertex*,Vertex*>&PathTree)
  2. {
  3. intn=pVertex1->m_Cost+Weight;
  4. If(n<pVertex2->m_Cost)
  5. {
  6. pVertex2->m_Cost=n;
  7. PathTree[pVertex2]=pVertex1;
  8. }
  9. }

  这个时候,我们再模拟上面的过程。就会发现PathTree记录了A达到D的最短路径。以D对象为key查找映射表会查到B对象,以B对象为key查找映射表会查到A对象。这个就是A到D的最短路径了。

  实际上,整个unordered_map<Vertex*,Vertex* > PathTree表示的是一个路径树。

  之前我们模拟的那4步过程,是人为地挑选顶点出来进行松弛,从而找到最短路径。Dijkstra其实就是一个挑选顶点出来松弛的一个算法,这个挑选过程使用贪心策略。OK,看下Dijkstra是怎样执行的。


  1. Dijkstra
  2. {
  3. 遍历所有的图顶点
  4. 图顶点的路径估值初始化为一个很大的值,比如:0x0FFFFFFF
  5. 把所有的顶点都加入一个列表Q中
  6. 起始顶点的路径估值初始化为0
  7. PathTree[起始顶点]=0;//起始顶点没有父节点
  8. 如果Q列表不为空的话就一直做如下循环
  9. {
  10. 在Q列表中选出一个路径估值最小的顶点v
  11. 对顶点v所有的出边进行Relax松弛操作
  12. }
  13. }

  Dijkstra的核心思想其实是非常简短的。说Dijkstra用了贪心策略,就是它会从列表Q中选出一个路径估值最小的顶点v进行Relax松弛。注意:这里的“选出”是这样的含义,在列表中找出一个路径估值最小的顶点,然后列表移除该顶点。Dijkstra的结束条件是把列表Q给选空了。也可以把结束条件修改一下,当选出了目的顶点时就终止。

  Dijkstra执行完后,会对整个图输出一个路径树。也就是PathTree表达的内容。这个路径树包括了起始顶点到其他顶点的最短路径。

  我的Dijkstra算法继承自GraphPathfinding类。GraphPathfinding作为基类主要是为了以后增加一些其他的路径搜索算法类。

  GraphPathfinding头文件


  1. #pragmaonce
  2. #include"Graph.h"
  3. #include<unordered_map>
  4. usingnamespacestd;
  5. /*
  6. 路径搜索结果
  7. */
  8. structResult
  9. {
  10. //路径树
  11. unordered_map<Vertex*,Vertex*>PathTree;
  12. };
  13. classGraphPathfinding
  14. {
  15. public:
  16. GraphPathfinding();
  17. ~GraphPathfinding();
  18. public:
  19. virtualvoidExecute(constGraph&Graph,conststring&VetexId)=0;
  20. };

  Dijjkstra 类.h


  1. #pragmaonce
  2. #include"GraphPathfinding.h"
  3. classDijkstra:publicGraphPathfinding
  4. {
  5. public:
  6. Dijkstra();
  7. ~Dijkstra();
  8. public:
  9. public:
  10. voidExecute(constGraph&Graph,conststring&VetexId)override;
  11. private:
  12. //抽出最小路径估值的顶点
  13. Vertex*ExtractMin(vector<Vertex*>&Q);
  14. //松弛
  15. voidRelax(Vertex*v1,Vertex*v2,intWeight);
  16. public:
  17. Result&GetResult(){returnm_Ret;}
  18. private:
  19. Resultm_Ret;
  20. };

  Dijkstra Cpp


  1. #include"Dijkstra.h"
  2. #include<queue>
  3. Dijkstra::Dijkstra()
  4. {
  5. }
  6. Dijkstra::~Dijkstra()
  7. {
  8. }
  9. voidDijkstra::Execute(constGraph&Graph,conststring&VetexId)
  10. {
  11. m_Ret.PathTree.clear();
  12. constauto&Vertexes=Graph.GetVertexes();
  13. Vertex*pGvStart=Vertexes.find(VetexId)->second;
  14. vector<Vertex*>Q;
  15. //初始化
  16. for(auto&it:Vertexes)
  17. {
  18. it.second->m_Cost=0x0FFFFFFF;
  19. Q.push_back(it.second);
  20. }
  21. m_Ret.PathTree[pGvStart]=0;//起始顶点的前驱顶点为空
  22. pGvStart->m_Cost=0;
  23. for(;Q.size()>0;)
  24. {
  25. //选出最小路径估计的顶点
  26. autov=ExtractMin(Q);
  27. //对所有的出边进行“松弛”
  28. constauto&EO=v->GetEdgesOut();
  29. for(auto&it:EO)
  30. {
  31. Edge*pEdge=it.second;
  32. Relax(v,pEdge->GetEndVertex(),pEdge->GetWeight());
  33. }
  34. }
  35. }
  36. Vertex*Dijkstra::ExtractMin(vector<Vertex*>&Q)
  37. {
  38. Vertex*Ret=0;
  39. Ret=Q[0];
  40. intpos=0;
  41. for(inti=1,size=Q.size();i<size;++i)
  42. {
  43. if(Ret->m_Cost>Q[i]->m_Cost)
  44. {
  45. Ret=Q[i];
  46. pos=i;
  47. }
  48. }
  49. Q.erase(Q.begin()+pos);
  50. returnRet;
  51. }
  52. voidDijkstra::Relax(Vertex*v1,intWeight)
  53. {
  54. intn=v1->m_Cost+Weight;
  55. if(n<v2->m_Cost)
  56. {
  57. v2->m_Cost=n;
  58. m_Ret.PathTree[v2]=v1;
  59. }
  60. }

  我的Dijkstra选出最小路径估计的顶点的方法,用的是列表遍历。要优化Dijkstra的话,可以用优先级队列,终极优化是斐波那契堆。


  计算出了最短路径,就可以用Sequene动作序列串联MoveTo动作把行走的动画表现出来了。


7.本文工程源代码下载


  由于实现代码比较多,我就不贴完了。直接发工程,大家自己去看吧。


  整个cocos2d-x的项目比较大,我只上传Classes和Resources 2个关键的文件夹。大家本地创建一个cocos2d-x的项目,然后覆盖掉这2个文件夹,应该就可以了。


  下载地址:http://download.csdn.net/detail/stevenkylelee/7723917



  有一些朋友说编译源代码不过。我的开发环境是:Cocos2d-x 3.2,VS2013。搭建为和我一样的环境试试。如果用VS2012编译,出现“error C2338: The C++ Standard doesn't provide a hash for this type. (..\Classes\Graph\GraphPathfinding.cpp)”错误的话,请 在Graph.h头文件加上一句:#include <string>

转自:http://blog.csdn.net/stevenkylelee/article/details/38408253

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


    本文实践自 RayWenderlich、Ali Hafizji 的文章《How To Create Dynamic Textures with CCRenderTexture in Cocos2D 2.X》,文中使用Cocos2D,我在这里使用Cocos2D-x 2.1.4进行学习和移植。在这篇文章,将会学习到如何创建实时纹理、如何用Gimp创建无缝拼接纹
Cocos-code-ide使用入门学习地点:杭州滨江邮箱:appdevzw@163.com微信公众号:HopToad 欢迎转载,转载标注出处:http://blog.csdn.netotbaron/article/details/424343991.  软件准备 下载地址:http://cn.cocos2d-x.org/download 2.  简介2.1         引用C
第一次開始用手游引擎挺激动!!!进入正题。下载资源1:从Cocos2D-x官网上下载,进入网页http://www.cocos2d-x.org/download,点击Cocos2d-x以下的Download  v3.0,保存到自定义的文件夹2:从python官网上下载。进入网页https://www.python.org/downloads/,我当前下载的是3.4.0(当前最新
    Cocos2d-x是一款强大的基于OpenGLES的跨平台游戏开发引擎,易学易用,支持多种智能移动平台。官网地址:http://cocos2d-x.org/当前版本:2.0    有很多的学习资料,在这里我只做为自己的笔记记录下来,错误之处还请指出。在VisualStudio2008平台的编译:1.下载当前稳
1.  来源 QuickV3sample项目中的2048样例游戏,以及最近《最强大脑》娱乐节目。将2048改造成一款挑战玩家对数字记忆的小游戏。邮箱:appdevzw@163.com微信公众号:HopToadAPK下载地址:http://download.csdn.net/detailotbaron/8446223源码下载地址:http://download.csdn.net/
   Cocos2d-x3.x已经支持使用CMake来进行构建了,这里尝试以QtCreatorIDE来进行CMake构建。Cocos2d-x3.X地址:https://github.com/cocos2d/cocos2d-x1.打开QtCreator,菜单栏→"打开文件或项目...",打开cocos2d-x目录下的CMakeLists.txt文件;2.弹出CMake向导,如下图所示:设置
 下载地址:链接:https://pan.baidu.com/s/1IkQsMU6NoERAAQLcCUMcXQ提取码:p1pb下载完成后,解压进入build目录使用vs2013打开工程设置平台工具集,打开设置界面设置: 点击开始编译等待编译结束编译成功在build文件下会出现一个新文件夹Debug.win32,里面就是编译
分享一下我老师大神的人工智能教程吧。零基础!通俗易懂!风趣幽默!还带黄段子!希望你也加入到我们人工智能的队伍中来!http://www.captainbed.net前言上次用象棋演示了cocos2dx的基本用法,但是对cocos2dx并没有作深入的讨论,这次以超级马里奥的源代码为线索,我们一起来学习超级马里奥的实
1. 圆形音量button事实上作者的本意应该是叫做“电位计button”。可是我觉得它和我们的圆形音量button非常像,所以就这么叫它吧~先看效果:好了,不多解释,本篇到此为止。(旁白: 噗。就这样结束了?)啊才怪~我们来看看代码:[cpp] viewplaincopyprint?CCContro
原文链接:http://www.cnblogs.com/physwf/archive/2013/04/26/3043912.html为了进一步深入学习贯彻Cocos2d,我们将自己写一个场景类,但我们不会走的太远,凡是都要循序渐进,哪怕只前进一点点,那也至少是前进了,总比贪多嚼不烂一头雾水的好。在上一节中我们建
2019独角兽企业重金招聘Python工程师标准>>>cocos2d2.0之后加入了一种九宫格的实现,主要作用是用来拉伸图片,这样的好处在于保留图片四个角不变形的同时,对图片中间部分进行拉伸,来满足一些控件的自适应(PS: 比如包括按钮,对话框,最直观的形象就是ios里的短信气泡了),这就要求图
原文链接:http://www.cnblogs.com/linji/p/3599478.html1.环境和工具准备Win7VS2010/2012,至于2008v2版本之后似乎就不支持了。 2.安装pythonv.2.0版本之前是用vs模板创建工程的,到vs2.2之后就改用python创建了。到python官网下载版本2.7.5的,然后
环境:ubuntu14.04adt-bundle-linux-x86_64android-ndk-r9d-linux-x86_64cocos2d-x-3.0正式版apache-ant1.9.3python2.7(ubuntu自带)加入环境变量exportANDROID_SDK_ROOT=/home/yangming/adt-bundle-linux/sdkexportPATH=${PATH}:/$ANDROID_SDK_ROOTools/export
1开发背景游戏程序设计涉及了学科中的各个方面,鉴于目的在于学习与进步,本游戏《FlappyBird》采用了两个不同的开发方式来开发本款游戏,一类直接采用win32底层API来实现,另一类采用当前火热的cocos2d-x游戏引擎来开发本游戏。2需求分析2.1数据分析本项目要开发的是一款游
原文链接:http://www.cnblogs.com/linji/p/3599912.html//纯色色块控件(锚点默认左下角)CCLayerColor*ccc=CCLayerColor::create(ccc4(255,0,0,128),200,100);//渐变色块控件CCLayerGradient*ccc=CCLayerGradient::create(ccc4(255,0,0,
原文链接:http://www.cnblogs.com/linji/p/3599488.html//载入一张图片CCSprite*leftDoor=CCSprite::create("loading/door.png");leftDoor->setAnchorPoint(ccp(1,0.5));//设置锚点为右边中心点leftDoor->setPosition(ccp(240,160));/
为了答谢广大学员对智捷课堂以及关老师的支持,现购买51CTO学院关老师的Cocos2d-x课程之一可以送智捷课堂编写图书一本(专题可以送3本)。一、Cocos2d-x课程列表:1、Cocos2d-x入门与提高视频教程__Part22、Cocos2d-x数据持久化与网络通信__Part33、Cocos2d-x架构设计与性能优化内存优
Spawn让多个action同时执行。Spawn有多种不同的create方法,最终都调用了createWithTwoActions(FiniteTimeAction*action1,FiniteTimeAction*action2)方法。createWithTwoActions调用initWithTwoActions方法:对两个action变量初始化:_one=action1;_two=action2;如果两个a
需要环境:php,luajit.昨天在cygwin上安装php和luajit环境,这真特么是一个坑。建议不要用虚拟环境安装打包环境,否则可能会出现各种莫名问题。折腾了一下午,最终将环境转向linux。其中,luajit的安装脚本已经在quick-cocos2d-x-develop/bin/中,直接luajit_install.sh即可。我的lin
v3.0相对v2.2来说,最引人注意的。应该是对触摸层级的优化。和lambda回调函数的引入(嗯嗯,不枉我改了那么多类名。话说,每次cocos2dx大更新。总要改掉一堆类名函数名)。这些特性应该有不少人研究了,所以今天说点跟图片有关的东西。v3.0在载入图片方面也有了非常大改变,仅仅只是