0

円を描いて移動するドラッグ可能オブジェクトを作成しました:

var wskaznik = document.getElementById("wskaznik");
var pozycja_kamery_pole = document.getElementById("pozycja_kamery");
var pozycja_kamery = {
szerokosc: pozycja_kamery_pole.offsetWidth,
wysokosc: pozycja_kamery_pole.offsetHeight,
gora: pozycja_kamery_pole.offsetTop,
lewo: pozycja_kamery_pole.offsetLeft
};
pozycja_kamery.srodek = [pozycja_kamery.lewo + pozycja_kamery.szerokosc / 2,     pozycja_kamery.gora + pozycja_kamery.wysokosc / 2];
pozycja_kamery.promien = (pozycja_kamery.szerokosc / 2) -10;

function kolo(x, y) {
var odst = odstep([x, y], [65,65]);
if (odst <= pozycja_kamery.promien) {
    return {x: x, y: y};
} 
else {
    x = x - 65;
    y = y - 65;
    var radians = Math.atan2(y, x)
       return {
           x: Math.cos(radians) * canvas.radius + 65,
           y: Math.sin(radians) * canvas.radius + 65
       }
    } 
}
function odstep(pkt1, pkt2) {
var x1 = pkt1[0],
    y1 = pkt1[1],
    x2 = pkt2[0],
    y2 = pkt2[1];
return Math.sqrt(Math.pow(x1 - x2, 2) + Math.pow(y1 - y2, 2));
}

しかし、それはスムーズな動きではありません。修正方法は？これが私のコードです: http://jsfiddle.net/draqo/DAyrH/

私はこれに従いました： http://jsfiddle.net/7Asn6/

4

3 に答える 3

0

カーソルが円内にある限り問題ないように見えます...おそらく、マウスの追跡が必要な場合があります-たとえば、Javascriptで現在のマウス座標を取得することは可能ですか?

于 2013-11-07T19:12:47.997 に答える