HTML5帆布圖像剪輯

Question

就像我在畫布瓷磚圖像。 http://i947.photobucket.com/albums/ad320/kev1030_photos/btiles2032.png

如何做這樣的事情，如果我點擊第一個瓷磚返回0，如果在10瓦的回報9和......然後......

如何在HTML5畫布夾地形設置？

Answer 1

剪輯在這裏不是正確的詞。剪切是當你只畫一部分圖像或路徑到屏幕上。

你會稱之爲「點擊測試」或「對象選擇」或「細胞檢測」。

這只是簡單的數學。每個圖標是32 + 2黃色，這樣你就可以做到這一點，找出哪些細胞：

can.addEventListener('mousedown', function(e) { 
    var mouse = getMouse(e, can); 
    var x = Math.floor(mouse.x/34); 
    var y = Math.floor(mouse.y/34); 
    alert(x + (y*16)); // because there are 16 in a row 
}, false); 

這裏有一個工作示例：

http://jsfiddle.net/YH8b8/