Как проверить, находится ли координата в алмазной области? - PullRequest
Новая
       2

Как проверить, находится ли координата в алмазной области?

1 голос
/ 22 июня 2010

код ссылки: http://jsbin.com/ozoma3/edit

коды (можно скопировать / вставить в файл .html и запустить его): 

<HTML>
<HEAD>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<style>
*{margin:0;}
#main{
    background-image:url('http://clip2net.com/clip/m10494/1277192389-c-811b.png');
    width:660px;
    height:320px;
}
</style>
</HEAD>
<BODY><div id="main"></div></BODY>
</HTML>
<script>
var CELL_WIDTH=66;  //diamond area width
var CELL_HEIGHT=32; //diamond area height
var activeCell=$("<img src=http://clip2net.com/clip/m10494/1277193046-block-698b.png>")
    .appendTo("#main")
    .css({"position": "absolute"});

//active diamond area
function overCell(x,y){
    var xC=parseInt(x/(CELL_WIDTH/2));
    var yC=parseInt(y/(CELL_HEIGHT/2));
    var xO=(xC%2==1);
    var yO=(yC%2==0);
    if((xO&&yO) || (!xO&&!yO)){
        //skip
    }else{
        activeCell.css({
            "left":(xC*(CELL_WIDTH/2))+"px",
            "top" :(yC*(CELL_HEIGHT/2))+"px"
        });
    }
}
$(function(){
    $("#main").mousemove(function(e){
        overCell(e.pageX,e.pageY);
   });  
});
</script>

Я хочу, чтобы при наведении курсора мыши на область алмаза показывал activeCell.

но сейчас это нехорошо, потому что мышь переместится в область алмаза внизу справа, она будет активна в следующей области, не очень точно.

горячо оптимизировать эти коды? (думаю, мне нужна лучшая арифметика)

спасибо всем! :)

1 Ответ

3 голосов
/ 23 июня 2010

Эта функция должна помочь: 

function overCell(x,y)
{ 
    //top left
    var f1 = -CELL_HEIGHT/CELL_WIDTH * (x%CELL_WIDTH) + CELL_HEIGHT/2;
    //bottom left
    var f2 =  CELL_HEIGHT/CELL_WIDTH * (x%CELL_WIDTH) + CELL_HEIGHT/2;
    //top right
    var f3 =  CELL_HEIGHT/CELL_WIDTH * (x%CELL_WIDTH) - CELL_HEIGHT/2;
    //bottom right
    var f4 = -CELL_HEIGHT/CELL_WIDTH * (x%CELL_WIDTH) + 3*CELL_HEIGHT/2;

    if (f1 > 0 && f1 < CELL_HEIGHT/2 && y%CELL_HEIGHT <= f1)
    {
        activeCell.css({ 
            "left":(x-x%CELL_WIDTH - CELL_WIDTH/2)+"px", 
            "top" :(y-y%CELL_HEIGHT - CELL_HEIGHT/2)+"px" 
        }); 
    }
    else if (f2 > CELL_HEIGHT/2 && f2 < CELL_HEIGHT && y%CELL_HEIGHT >= f2)
    {
        activeCell.css({ 
            "left":(x-x%CELL_WIDTH - CELL_WIDTH/2)+"px", 
            "top" :(y-y%CELL_HEIGHT + CELL_HEIGHT/2)+"px" 
        }); 
    }
    else if (f3 > 0 && f3 < CELL_HEIGHT/2 && y%CELL_HEIGHT <= f3)
    {
        activeCell.css({ 
            "left":(x-x%CELL_WIDTH + CELL_WIDTH/2)+"px", 
            "top" :(y-y%CELL_HEIGHT - CELL_HEIGHT/2)+"px" 
        }); 
    }
    else if (f4 < CELL_WIDTH/2 && f4 > CELL_WIDTH/4 && y%CELL_HEIGHT >= f4)
    {
        activeCell.css({ 
            "left":(x-x%CELL_WIDTH + CELL_WIDTH/2)+"px", 
            "top" :(y-y%CELL_HEIGHT + CELL_HEIGHT/2)+"px" 
        }); 
    }
    else
    {
        activeCell.css({ 
            "left":(x-x%CELL_WIDTH)+"px", 
            "top" :(y-y%CELL_HEIGHT)+"px" 
        });
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...