#image #html #canvas
#изображение #HTML #canvas
Вопрос:
Есть ли способ отобразить Canvas за кадром в элемент HTML-изображения?
Ответ №1:
img.src = canvas.toDataURL();
где img и canvas являются соответствующим объектом element (из document.getElementByElement(...) ).
Комментарии:
1. Спасибо. Могу ли я задать другой способ без преобразования?
2. Что вы подразумеваете под «без преобразования»?
3. Canvas отобразит изображение в виде растрового изображения в памяти, а метод look закодирует его в PNG. Итак, если я использую метод, я должен декодировать его из PNG. Это значительно снизит производительность. Я хочу избежать затрат на кодирование / декодирование, потому что я хочу отображать анимацию, отображаемую в реальном времени между элементами HTML.
4. Тогда почему вы не отображаете
<canvas>элемент напрямую? Это был бы самый быстрый способ, потому что в некоторых браузерах, которые поставляются с ускорением hw, вы, по сути, получаете доступ к pixel на GPU напрямую. Многие из вас также рассматривают возможность использования двух<canvas>файлов, одного экранного, другого закадрового, и копирования пикселей между ними с помощьюdrawImage().5. Поскольку ни один элемент не может быть отображен на <canvas>, нет способа отобразить <video> в <canvas> . Это приемлемый медленный пользовательский интерфейс на медленной машине. Я могу остановить эффекты анимации на медленных машинах. Но мое приложение должно отображать видео внутри области отображения <canvas>.