Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Скорость объекта при движении к координатам (https://javascript.ru/forum/events/50598-skorost-obekta-pri-dvizhenii-k-koordinatam.html)

slava1992 03.10.2014 16:21

Скорость объекта при движении к координатам
 
Добрый день. Искал в интернете решение, но либо куда-то не туда смотрел, либо нет информации( Ткните носом, если где-то есть. Или помогите.

Задача у меня такая. Есть канвас. Есть объект, который перемещается после нажатия кнопки мыши по координатам. Но перемещается мгновенно. Как задать скорость перемещения? Чтобы объект передвигался к координатам постепенно?

Куски кода:
...
var mouseX;
var mouseY;

function init() 

...

document.addEventListener("mousemove", mouseMove, false);
document.addEventListener("click", mouseClick, false);

}

function mouseMove(e) 
{
mouseX = e.pageX;
mouseY = e.pageY;
document.getElementById("gameName").innerHTML = "X: "+mouseX+" Y: "+mouseY;
}



function mouseClick(e) 
{
player.drawX = mouseX;  
player.drawY = mouseY; 
document.getElementById("gameName").innerHTML = "Clicked";	
}

//--- object

function Player() 
{ 
	this.srcX = 0;
	this.srcY = 0;
	this.drawX = 0;
	this.drawY = 0;
	this.width = 400;
	this.height = 200;
	this.speed = 5;	
}

...

MallSerg 03.10.2014 20:31

http://learn.javascript.ru/js-animation
http://javascript.ru/forum/misc/4962...tml#post326928

kostyanet 04.10.2014 20:26

Канвас это не transition в CSS, там надо все перерисовывать каждый кадр. То есть придется рассчитать траекторию, тайминг или делать это в процессе относительно нормальных значений. Геморрой короче, шопесец. Лучше скачайте готовую библиотеку.


Часовой пояс GMT +3, время: 12:34.