等距屏幕映射

Question

我正在试图找出当我有"斜坡"和+1高度的瓷砖时,如何在鼠标下方获得正确的"活动"瓷砖(见下图).

当我的世界平坦时,一切都没有问题.一旦我添加了一个高度为+1的瓷砖,以及一个回到+0的斜坡,我的屏幕 - >地图例程仍然看起来好像一切都是"平坦的".

在上面的图片中,绿色的"渐变"是我要渲染的真实图块并计算鼠标 - >地图,但是您在"下方"看到的蓝色图块是计算出来的区域.因此,如果您将鼠标移动到任何深绿色区域,它会认为您正在使用另一个磁贴.

这是我的地图渲染(非常简单)

canvas.width = canvas.width; // cheap clear in firefox 3.6, does not work in other browsers
for(i=0;i<map_y;i++){
    for(j=0;j<map_x;j++){
        var xpos = (i-j)*tile_h + current_x;
        var ypos = (i+j)*tile_h/2+ current_y;

      context.beginPath();
      context.moveTo(xpos, ypos+(tile_h/2));
      context.lineTo(xpos+(tile_w/2), ypos);
      context.lineTo(xpos+(tile_w), ypos+(tile_h/2));
      context.lineTo(xpos+(tile_w/2), ypos+(tile_h));
      context.fill();

    }
}    

这是我的鼠标 - >地图例程:

ymouse=( (2*(ev.pageY-canvas.offsetTop-current_y)-ev.pageX+canvas.offsetLeft+current_x)/2 );
xmouse=( ev.pageX+ymouse-current_x-(tile_w/2)-canvas.offsetLeft );
ymouse=Math.round(ymouse/tile_h);
xmouse=Math.round(xmouse/(tile_w/2));

current_tile=[xmouse,ymouse];

我有一种感觉,我将不得不重新开始并实现一个基于世界的地图系统,而不是一个简单的屏幕 - >地图例程.

谢谢.

Answer 1

你的假设是正确的。为了根据世界几何形状“挑选”，您的例程需要了解世界（而不仅仅是基础级别的图块配置）。也就是说，如果没有任何关于当前选取的图块附近的图块高度（通过您当前的算法）的概念，则无法确定是否应将相邻图块（或更远的图块，取决于允许的高度）被拾取射线拦截。

您已经获得了拾取射线的最终可能点。剩下的就是在世界空间中定义光线的其余部分，并检查该光线与世界几何体的相交。