HTML5 Canvas實現Tiled地圖編輯器

HTML5 Canvas實現Tiled地圖編輯器

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

概述

    GitHub : https://github.com/joinAero/WebTiled

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/) 
  
 
  
預覽 
  
---- 
  
 
  
[Click here!](http://join-wt.jit.su/) 
 

650) this.width=650;" src="http://www.bkjia.com/uploads/allimg/131228/12441J033-0.png" border="0" alt="WebTiled.png" />

 

本文出自 “-_--___---_-” 部落格，請務必保留此出處http://vaero.blog.51cto.com/4350852/999452