Как лучше всего нарисовать движущуюся линию / кривую?

Question

Я хотел бы рисовать «движущиеся» линии, используя JavaScript и Canvas.По сути, у меня есть кривая Безье, которую я хотел бы нарисовать, но вместо рисования кривой сразу, я хотел бы рисовать части кривой с течением времени, чтобы она выглядела так, как будто она растет.Лучшее объяснение может быть следующим: я бы хотел, чтобы линия начиналась с начала координат, а затем со временем переместилась бы к точке назначения.Каков наилучший способ добиться этого?

Answer 1

Я создал плагин jQuery под названием jCurvy , который позволяет размещать элементы вдоль кривой Безье. Вы можете использовать jCurvy вместе с методом fadeIn и обратным вызовом, чтобы сделать то, о чем вы говорите. Посмотрите на пример, который я настроил здесь:

http://jsfiddle.net/pFZss/2/

Если вы в конечном итоге пойдете по этому маршруту и ​​у вас возникнут какие-либо проблемы, пожалуйста, дайте мне знать. Я уверен, что вы будете одним из первых, кто воспользуется плагином, поэтому я хотел бы получить отзыв.

Answer 2

Я искал способ сделать то же самое и нашел плагины jQuery Tween и jQuery Curve , описанные и продемонстрированные здесь: http://heygrady.com/blog/2011/07/20/animating-with-curves-in-jquery/

Answer 3

Используйте setTimeout или setInterval. Вы также можете использовать функцию анимации