一、編輯器版本
TileMap編輯器，建議下載1.2版本的娇澎。https://github.com/mapeditor/tiled/releases/tag/v1.2.0
剛開始我下載了1.7版本紊册，cocos會提示：
cocos2d: TMXFormat: Unsupported TMX version: 1.5
至于為什么是1.2锦庸，參考官方文檔https://docs.cocos.com/creator/manual/zh/asset-workflow/tiledmap.html
瓦片圖資源是由 TiledMap 所導出的數(shù)據(jù)格式（Creator v2.1 及以下支持 TiledMap v1.0.0肋乍，Creator v2.2.0 及以上支持 TiledMap v1.2.0）绳慎。
另外可參考官方文檔：TiledMap 組件參考
https://docs.cocos.com/creator/manual/zh/components/tiledmap.html
二兵怯、尋路
參考官方示例改 TiledMap 瓦片地圖+尋路降铸，這個帖子提供了正常角度的地圖坐標轉換。我現(xiàn)在想做斜45度的地圖摇零，需要修改坐標轉換算法推掸。
三、坐標
參考
筆記：TileMap坐標轉換
45度角地圖坐標計算
瓦片地圖-坐標轉換
1.地圖類型
- 所有地圖類型的坐標都是格子數(shù)驻仅，X軸向右增加谅畅，Y軸向下增加
- 正常/45度交錯/六角交錯地圖左上角第一個格子為起始點：(0,0)
- 45度地圖上方頂點第一個格子為起始點：(0,0)
2.坐標系
- TileMap坐標：以地圖左上角為原點(0,0)，X軸向右增加噪服，Y軸向下增加
- OpenGL坐標：以地圖左下角為原點(0,0)毡泻，X軸向右增加，Y軸向上增加
- Creator坐標：以節(jié)點中心點為原點(0,0)粘优，X軸向右增加仇味，向左減少，Y軸向上增加雹顺，向下減少
3.引擎提供tiled格式轉圖層坐標
let Orientation = cc.Enum({
/**
* !#en Orthogonal orientation.
* !#zh 直角鳥瞰地圖（90°地圖）丹墨。
* @property ORTHO
* @type {Number}
* @static
*/
ORTHO: 0,
/**
* !#en Hexagonal orientation.
* !#zh 六邊形地圖
* @property HEX
* @type {Number}
* @static
*/
HEX: 1,
/**
* Isometric orientation.
* 等距斜視地圖（斜45°地圖）。
* @property ISO
* @type {Number}
* @static
*/
ISO: 2
});
/**
* !#en Returns the position in pixels of a given tile coordinate.
* !#zh 獲取指定 tile 的像素坐標嬉愧。
* @method getPositionAt
* @param {Vec2|Number} pos position or x
* @param {Number} [y]
* @return {Vec2}
* @example
* let pos = tiledLayer.getPositionAt(cc.v2(0, 0));
* cc.log("Pos: " + pos);
* let pos = tiledLayer.getPositionAt(0, 0);
* cc.log("Pos: " + pos);
*/
getPositionAt (pos, y) {
let x;
if (y !== undefined) {
x = Math.floor(pos);
y = Math.floor(y);
}
else {
x = Math.floor(pos.x);
y = Math.floor(pos.y);
}
let ret;
switch (this._layerOrientation) {
case cc.TiledMap.Orientation.ORTHO:
ret = this._positionForOrthoAt(x, y);
break;
case cc.TiledMap.Orientation.ISO:
ret = this._positionForIsoAt(x, y);
break;
case cc.TiledMap.Orientation.HEX:
ret = this._positionForHexAt(x, y);
break;
}
return ret;
},
四贩挣、有做大型RPG或SLG游戲需求的朋友請進，有在線地圖編輯器
作者QQ583051842
以下為評論區(qū)精選：
1.人物移動使用插值
從a點走到b的過程中突然又點擊了c點，a到b點的行走被打斷王财，改為當前位置到c點行走卵迂，用tween不好控制，而且tween性能消耗大绒净。而插值可以輕松每時每刻的屏幕平滑移動见咒。還有一種情況，arpg游戲挂疆，a點走到b點的過程中论颅，角色中了一個暈眩技能，被迫停下囱嫩，用tween就不好處理了恃疯。
2.想問下 如果想在地圖上添加NPC 怪物等等 這個可以添加么 然后如何觸發(fā)事件
在地圖上添加怪物和npc可以在cocoscreator里編輯。新建一個場景墨闲，把地圖底圖拉到場景里今妄，然后把怪物和npc根據(jù)底圖的位置拖放，在把這些怪物和npc一起生成一個預制體鸳碧。運行游戲時盾鳞，加載地圖的同時順便把這個預制體加載進來放置在底圖上就可以了。
點擊事件可以在怪物和npc的節(jié)點上添加事件監(jiān)聽
3.點擊不能尋路的地方瞻离，現(xiàn)在是不會移動腾仅，可以改為跑到離這個點，最近的可移動的地方
修復了源代碼項目用2.20以上的版本打開套利，角色動畫不能播放的問題推励，并且添加了點擊障礙點也可以行走到最靠近目標點最近的地方的功能
尋路算法添加了可以選擇是否優(yōu)化尋路路徑的選項修改一下A*尋路腳本里的optimize屬性，true為優(yōu)化肉迫，會把路徑里多余的路點清理掉验辞，false為不優(yōu)化，返回尋路的完整路徑
4.大佬 喊衫，地圖圖片太大了會不會加載慢跌造？
很大的地圖， 最好先photoshop把大地圖導出一張很小的地圖族购，提前加載到游戲里壳贪，并且縮放大小和原始地圖一樣大小，這樣就能作為馬賽克地圖寝杖。然后再用photoshop可以分片切割大圖片成很多小圖片（如每張256 * 256）违施，玩家走到哪里就加載哪里的小圖塊，這樣就不會影響加載速度了朝墩，就算是微信小游戲也能跑醉拓。以前網(wǎng)頁游戲就是這種做法的
在線編輯器里新增了針對大地圖的裁圖工具伟姐，需要下載使用
5.筆刷
更新了功能收苏，按住shitf拖動鼠標可以加大筆刷范圍亿卤，按住鼠標“中鍵”或者“space + 鼠標左鍵”可以拖曳底圖，
6.如果用tilemap那種像素風類型的,似乎不大適用
tilemap是以地磚的方式重復利用資源鹿霸，優(yōu)點節(jié)省資源大小排吴，缺點畫面太單一。我這種是傳統(tǒng)的rpg地圖原畫懦鼠，優(yōu)點地圖由美術原畫自由發(fā)揮钻哩，畫面比較精美。缺點是資源相對地磚地圖大很多肛冶，不過可以通過切割地圖街氢，按視野分塊加載地圖片，效率不會受影響很多睦袖。如果tilemap需要做尋路珊肃，我的項目里自帶的尋路系統(tǒng)是可以用的。
7.小地圖尋路
游戲中點擊顯示縮略圖（一般右上角顯示小地圖）需顯示兩點間虛線路線馅笙，并自動尋路過去(尋路過程中伦乔，縮略圖虛線路線逐漸縮短且頭像逐漸移動),請問樓主能否指點一下思路
縮略圖可以自己用ps按比例縮小出一張小的地圖，放在右上角董习，點擊縮略圖時烈和，根據(jù)點擊縮略圖的位置按比例轉化到場景地圖的位置，并尋路到該位置皿淋，尋路會得到一條尋路路徑招刹，用繪圖工具如graphic組件根據(jù)玩家行走的位置，再連接剩下沒走完的路徑窝趣，實時繪制就得到你要的結果了
8.請問大佬打開地圖時讀取本機文件并上傳是如何做到的蔗喂？有相關文檔嗎？
js配合html標簽就可以做得到
