Изометрический экран на карту

Я пытаюсь понять, как я могу получить правильную «активную» плитку под мышкой, когда у меня есть плитки «рампа» и +1 к высоте (см. Рисунок ниже).


Example Isometric Image

Когда мой мир ровная, все работает без проблем. Как только я добавляю плитку с высотой, скажем +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];

У меня такое чувство, что мне придется начать заново и реализовать систему карт на основе мира, а не простой экран -> процедуру карты.

Спасибо.

5
задан Deozaan 8 March 2011 в 10:44
поделиться