методы синхронизации для нескольких элементов HTML5 Canvas на веб-странице - PullRequest
1 голос
/ 26 сентября 2011

Я нашел несколько статей об использовании фреймов анимации запроса для анимации элементов холста html5. http://paulirish.com/2011/requestanimationframe-for-smart-animating/

Если бы у меня было несколько элементов, нужно ли мне иметь систему синхронизации для каждого из них в отдельности (отдельный сценарий) или все они должны быть в одном цикле?

Это для концепции журнала, где каждая «страница» может иметь различную анимацию (одна серия строк, другая волна, возможно, другая, которая разрушает изображение на ваших глазах, когда вы читаете текст)

любая помощь всегда ценится.

Ответы [ 2 ]

1 голос
/ 27 сентября 2011

Я предполагаю, что вы будете разрабатывать каждую анимацию отдельно, и далее эти анимации не связаны друг с другом.В этом случае вам вообще не нужна синхронизация ... Если вы синхронизируете их в одном цикле, у вас возникнут следующие проблемы ...

  • Если анимация на одном холсте медленная, анимацияв другом холсте придется излишне ждать ...
  • requestAnimationFrame поможет вам создать интеллектуальный цикл, то есть если ваш холст скрыт или ваша вкладка не активна, обратный вызов для холста не произойдет.В случае синхронизации вы не сможете полностью оптимизировать.
    • Будет сложнее управлять всей анимацией в одном цикле, а не в отдельном цикле.
  • Во время отладки вы можете столкнуться с проблемами, вызванными другими анимациями встраница ...

Так что, если ваши анимации не связаны, я настоятельно рекомендую не синхронизировать анимации с одним циклом.Надеюсь, что это отвечает на ваши вопросы.

Следующая ссылка поможет вам узнать больше о Html5 Canvas ...

1 голос
/ 26 сентября 2011

Это полностью зависит от вас. Вы хотите, чтобы элементы работали синхронно друг с другом или нет? Или это не имеет значения?

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

Если их не нужно синхронизировать, то, конечно, у вас должно быть два таймера! Кроме того, если вы чувствуете, что в будущем может хотеть, чтобы разные детали работали с явно разными или изменяющимися скоростями, то вы можете рассмотреть два таймера.

...