TiledMapEngine master READ ONLY 0
  • explorer
  • search
a [App]
a CG.TiledMapEngine
a README.md
a app.ts
a [Test]
a test
  • README.md

TiledMapEngine 方塊地圖遊戲引擎

如果大家有玩過光暈戰記/Minecraft,那一定方塊地圖十分了解:

方塊地圖是指地圖由一格一格組成。

這個引擎可以讓大家輕鬆做出方塊地圖,並在地圖上設計遊戲。
不過使用這個引擎之前,你必須在我們提供的地圖編輯器設計你的地圖。
有關地圖編輯器的說明,可以在該專案查看。

我不懂那些函式怎用,怎麼辨?

你可以點入本專案程式碼查看說明,一切程式碼都是開源的。
你也可以在本專案建立討論串,說明你的問題。

How to use

本專案大多使用asynchronous function,
換而言之,在使用本專案之前,你可能需要學習一些語法,比如:

this.gameMap.renderMap()
.then(() => {
    //write your code in here
});

這個程式是要this.gameMap去加載地圖,由於加載地圖需要時間,
不使用asynchronous function的話,你的程式會卡著一段時間。
現在,在使用asynchronous function的設計後,你只要把加載地圖之後的程式寫在then中,就可以避免卡著的情況。

在完成地圖設計之後,你會得一個JSON檔案,這個檔案儲存了一切有關那個的資料。
然後,你須在你的專案加入本模組,並把JSON檔案上載至你的專案(你也可以修改左方CG.TiledMapEngine中的tiled_map.json)。
接下來,請參考加載地圖示範:

CG.Base.pixi.initialize(500, 600); //格式化PIXI
CG.Base.resourceManager.addAppResource('TiledMapEngine.mapResource') //加載你的地圖圖片
CG.Base.resourceManager.load(() => {
    //step 1: 加載JSON
    $.getJSON(CG.Base.getAppSourceUrl('CG.TiledMapEngine/tiled_map.json'), (data) => { //請把那個url改成你json檔案位置,如果你是直接修改tiled_map.json,這邊可以不用改
    //step 2:建立地圖,並把地圖資料,即JSON傳入
    this.gameMap = new CG.TiledMapEngine.Map(data , true); //建立一張新地圖,在建立時,會把json資料傳入, true代表有視野限制
    //step 3:把地圖素材包加到地圖中
    this.gameMap.importUsedMapTexture() //把地圖格子資料加到地圖
        .then(() => {
            //step 4:生成地圖
            this.gameMap.renderMap() //生成地圖
                .then(() => {
                    CG.Base.pixi.root.addChild(this.gameMap); //把地圖加到PIXI中
            });
        });
    })
});

這樣,你就會得一個this.gameMap,而這就是你的地圖。
在CG中,實作無限地圖十分簡單,
在光暈,我們只有一個地圖,即是只有一個this.gameMap,
但在CG,你可以使用上面的方法,建立多個地圖。

API

CG.TiledMapEngine.camera

Method

set(map: Map, x: number, y: number): void
根據輸入的地圖和位置,移動視角。

Parameter Type Description Optional
map Map 要移動視角的地圖。 No
x number 位置的x軸座標。 No
y number 位置的y軸座標。 No

Author

gamtable

READ ONLY
  • problem
  • console
No problems have been detected so far.
Ln 1, Col 1, Sel 0
Markdown