javascript движение точки по окружности
Писал скриптик для портфолио недавно и там, в одной из задач, было необходимо реализовать движение точки по окружности. Провозившись пол часа написал универсальную функцию для реализации данной задачи.
Входящие параметры функции:
alfa — начальный угол
beta — на какой угол повернуть
dalfa — шаг угловой
ro — направление вращения 0 по часовой 1 против часовой
x — координаты точки по оси х
y — координаты точки по оси у
centrX — координата центра по оси х
centrY — координата центра по оси у
Radius — радиус
obid — id объекта
timeout — временной интервал
Для решения поставленной задачи нам необходимо вспомнить школьный курс математики 
а именно перевод градусов в радианы, вспомнить, что такое период, синусы и косинусы
если вы этого всего не помните то переписать под себя вы врятли сможете скрипт.
Вот пример моего решения
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 | <html> <head> <script type="text/javascript"> var x,y,obj,corner; var pi=Math.PI; // считаем число пи function init_move_round(alfa,dalfa,beta,ro,centrX,centrY,Radius,obid,timeout) { var obj=document.getElementById(obid); x=obj.offsetLeft; y=obj.offsetTop; moveR(alfa,dalfa,beta,ro,x,y,centrX,centrY,Radius,obid,timeout); } function moveR(alfa,dalfa,beta,ro,x,y,centrX,centrY,Radius,obid,timeout){ /* alfa - начальный угол beta - на какой угол повернуть dalfa - шаг угловой ro - направление вращения 0 по часовой 1 против часовой x - координаты точки по оси х y - координаты точки по оси у centrX - координата центра по оси х centrY - координата центра по оси у Radius - радиус obid - id объекта timeout - временной интервал */ if(alfa==360||alfa==-360) alfa=0; obj=document.getElementById(obid); obj.style.left=x+"px"; obj.style.top=y+"px"; corner=2*pi-alfa/180*pi; // переводим градусы в радианы с учетом периода в 2 пи x = parseInt(Radius*Math.cos(corner) + centrX); // считаем новые координаты точки по оси х y = parseInt(Radius*Math.sin(corner) + centrY); // считаем новые координаты по оси у if(ro==1) alfa+=dalfa; else alfa-=dalfa; // определяем куда нам откладывать угол beta-=dalfa; if(beta>0) setTimeout("moveR("+alfa+","+dalfa+","+beta+","+ro+","+x+","+y+","+centrX+","+centrY+","+Radius+",'"+o |
Нет комментариев на "javascript движение точки по окружности"
Нет комментариев.
Вы можете продолжить обсуждение этой статьи на форуме