Есть ли способ анимации контекста в холсте 2-го HTML5?HTML5 canvas: Как оживить контекст?
Я хотел бы создать огромный контекст, но показывать только небольшую его часть на экране. Затем я хотел бы применить анимацию translate, чтобы прокрутить контекст, чтобы показать другие части контекста.
Как мне это сделать?
Создайте один холст с контекстом, который содержит всю вещь, которую вы хотите отобразить, вы можете сделать это, сделав ее на экране, если вам нужно, чтобы вы могли видеть, как она выглядит.
Затем возьмите то, что у вас есть, для этого и приложите его к какой-либо функции или к закрытию. Затем используйте document.createElement ('canvas') и используйте его контекст для кода, созданного для контекста отображения.
Затем вы можете использовать .drawImage() в основном контексте вашего видимого холста, рисовать другой контекст на экране и анимировать его вверх в цикле анимации.
Хотелось бы, чтобы я понял, что это немного легче понять, это легче понять, показав пример.
Внеуровневая визуализация - это то, что я пытаюсь объяснить.
анимация достигается путем периодической перерисовки холста. если у вас есть конкретный вопрос о том, как это сделать, я был бы рад помочь. – akonsu
Итак, если я правильно понимаю, тогда нет способа это сделать. Мне нужно сделать базовую анимацию, где весь «образ» медленно перемещается. Изображение будет в основном состоять из прямоугольников (построенных по требованию). Анимация должна быть очень гладкой и очень точной по времени. Я искал CSS3, canvas2D и webgl, но я понятия не имею, какой из них выбрать. –
есть способ сделать это, конечно. насколько велик весь образ? вы можете создать оффлайновый холст, который будет содержать весь образ, и еще один холст, который вы присоедините к DOM, который отобразит только часть большого холста. затем нарисуйте часть большого в маленький, используя drawImage API. – akonsu