HTML5画布ScreenToIso

我尝试在HTML5 Canvas中创建等轴测图，但不知道如何将HTML5 Canvas Screen坐标转换为等距坐标。现在我的代码是：HTML5画布ScreenToIso

 

    var mouseX = 0; 
    var mouseY = 0; 
    function mouseCheck(event) { 
     mouseX = event.pageX; 
     mouseY = event.pageY; 
    }

我也得到画布坐标。但如何将这个坐标转换成等距坐标？如果我喜欢使用16x16瓷砖。

感谢大家回覆此问题，并对我的英文语言感到抱歉。

2011-07-29 ovhqe

如果你想翻译标准COORDS等距 - 你应该使用这样的公式（COS（30）= 0.866 &罪（30）= 0.5的因素，使用30度等角投影）

xi = (y + x) * 0.866; 
yi = (y - x) * 0.5;

所以，如果你想回去翻译 - 我们可以找到我们的公式：

y = yi + xi/(0.866 * 2); 
x = y - 2 * yi;

EG我们有COORDS [3, 1]，并希望找到等距COORDS，所以它是方便：

xi = (1 + 3) * 0.866 = 3.464; 
yi = (1 - 3) * 0.5 = -1;

因此，鉴于这种细胞的坐标为[3.464，-1]

E.G用户点击了[5.2, 1]。这是缓解算新的价值：通过LibCanvas

y = 1 + 5.2/1.732 = 4; 
x = 4 - 2 * 1 = 2;

因此，点击卖的是[4, 2]

2011-07-29 21:52:17 Shock

回答