Учитывая URL-адрес данных, вы можете создать изображение (либо на странице, либо только в JS), установив src
для изображения URL-адрес данных. Например:
var img = new Image;
img.src = strDataURI;
drawImage()
Метод в HTML5 Canvas Контекст позволяет копировать все или часть изображения (или холст, или видео) на холсте.
Вы можете использовать это так:
var myCanvas = document.getElementById('my_canvas_id');
var ctx = myCanvas.getContext('2d');
var img = new Image;
img.onload = function(){
ctx.drawImage(img,0,0); // Or at whatever offset you like
};
img.src = strDataURI;
Изменить : я ранее предлагал в этом пространстве, что, возможно, нет необходимости использовать onload
обработчик, когда задействован URI данных. Судя по экспериментальным тестам по этому вопросу , это небезопасно. Вышеупомянутая последовательность - создайте изображение, установите onload
для использования нового изображения, а затем установите src
- необходимо для некоторых браузеров, чтобы обязательно использовать результаты.