Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   формула для вычисления координаты в canvas (https://javascript.ru/forum/misc/29576-formula-dlya-vychisleniya-koordinaty-v-canvas.html)

Hekumok 03.07.2012 22:19

формула для вычисления координаты в canvas
 
делаю мини-игру в canvasе, ну и там анимация задействована...в общем, нужно вычислить координаты точки, которая движется по параболе, а как это сделать не знаю(( по какой формуле это вычислить можно?

Hekumok 03.07.2012 22:23

да, и можно как-нибудь реализовать onclick() в canvasе?!

dmitriymar 03.07.2012 23:10

http://javascript.ru/tutorial/events/properties

Hekumok 04.07.2012 00:03

Цитата:

Сообщение от dmitriymar (Сообщение 186130)

Ээмм...а это вы к чему?

vadim5june 04.07.2012 00:05

Цитата:

Сообщение от Hekumok (Сообщение 186143)
Это вы ко 2-ому вопросу?

canvas как и любой dom-элемент поддерживает события мыши в том числе click-но если надо кликать на определенный элемент внутри канвы то это сложнее
по первому вопросу-может быть заменить параболу на кривую второго порядка или кривую Безье или просто на дугу которые реализованы в канвасе
quadraticCurveTo(cp1x, cp1y, x, y) - кривая второго порядка;
bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y) - кривая Безье;

Hekumok 04.07.2012 14:09

vadim5june,
1.можете, пожалуйста, дать ссылку на статью, где сказано как реализовать 'онклик' в canvasе, именно на определенную часть в нем?!
2.Я запускаю сетИнтервал, и мне нужно, чтобы вычислялась точка на этой параболе и затем рисовалась в canvasе, а не чтобы сразу рисовалась вся кривая

vadim5june 04.07.2012 15:59

Цитата:

Сообщение от Hekumok (Сообщение 186256)
vadim5june,
1.можете, пожалуйста, дать ссылку на статью, где сказано как реализовать 'онклик' в canvasе, именно на определенную часть в нем?!

вот на хабре есть одна ссылка- http://habrahabr.ru/post/119773/
хороших фрейемворков поддерживающих канвас не встречал-когда надо делал сам вычисляя координаты примерно так как в статье

dadli 04.07.2012 16:07

Цитата:

как реализовать 'онклик' в canvasе
Hekumok,
с помошчю paperjs можно так
function onMouseDown(event){
		  if(some_obj.bounds.contains(event.point)){
		        alert("click");
		  }
}

Hekumok 05.07.2012 17:39

vadim5june, dadli, спасибо...фреймворки для меня сложноваты, paper.js легче, предпочту этот вариант =)
А что по первому вопросу?))

vadim5june 05.07.2012 18:38

Цитата:

Сообщение от Hekumok (Сообщение 186541)
А что по первому вопросу?))

<center>
<canvas id="b" height="0" width="0" 

style="border: 2px dashed 

red"></canvas><button onclick=ff()

>start</button>
</center>
<br><br>
<div id=d></div>
<script type="text/javascript">
var canvas = document.getElementById

("b");
canvas.width=250; 
canvas.height=180; 
var context = canvas.getContext("2d");
function clearCanvas()

{context.clearRect

(0,0,canvas.width,canvas.height)};

//----------
var x=-20;var y=40;
function ff(){setInterval(ff1,1000)}
function ff1(){x+=1;
y=x*x/2;
context. fillStyle='red';
context.arc

(x*5+120,y,5,0,2*Math.PI,true);
context.fill();
};
</script>

у меня вот так парабола получается-проверял только в хроме


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