HTML5 Canvas實作Tiled地圖編輯器

HTML5 Canvas實作Tiled地圖編輯器

    運用Html5 Canvas、File API等實作的一個2D地圖編輯器。

概述

README.md

WebTiled 

======== 

Web地圖編輯器 

------------- 

HTML5 Canvas實作的網頁版地圖編輯器。 

基本功能 

-------- 

* 導入導出目前工程，及儲存成json地圖或圖檔。 

* 圖層分圖塊層、框域層兩種。前者繪圖塊、後者繪區域。 

* 工具欄主要提供圖塊層印刻、填充、連接配接三種繪制方式。 

* 添加圖塊，可以将多個圖檔一起拖進圖塊顯示域來添加。 

* 導入工程檔案也可拖進地圖顯示域，不過隻會讀取其中一個。 

* 應用在本地即可跑，即file://路徑。也沒放伺服器上試呢。 

注意項 

------ 

* 應用隻在Chrome20+上跑過... 

* 地圖與選取的圖塊寬高不一緻時，未多考慮。 

* 圖層建太大或過多，會有黑圖層或直接崩潰T^T。 

注：具體限制好像與PC性能相關。 

第三方 

* [jQuery](http://jquery.com/) 

* [Bootstrap](http://twitter.github.com/bootstrap/) 

* [工具欄圖示](http://www.defaulticon.com/) 

預覽 

---- 

截圖

<a href="http://blog.51cto.com/attachment/201209/131310778.png" target="_blank"></a>

     本文轉自winorlose2000 51CTO部落格，原文連結：http://blog.51cto.com/vaero/999452，如需轉載請自行聯系原作者