save div as png - html2canvas - blurry quality - Отличная библиотека

Использование html2canvas Я пытаюсь захватить div и сохранить его как .png-файл, и он работает!save div as png - html2canvas - blurry quality

(только с помощью window.open в примере для упрощения его - те же проблемы качества)

Однако четкость изображения/качество изображения внутри целевой DIV является довольно плохо. Я не совсем уверен, как улучшить качество изображения/резкость. Какие-либо предложения ?

функция saveAsPNG:

saveAsPNG = function(id) { 
var target = document.getElementById(id); 

    html2canvas(target, { 
    onrendered: function(canvas) { 
     var data = canvas.toDataURL("image/png", 1); 
     window.open(data);  
    } 
    }); 
};

источник

2016-03-23 Anders Pedersen

Прежде всего, 'image/png' бесполезен, поскольку это значение по умолчанию для' toDataURL'. И «encoderOptions» (второй параметр) используется только для «image/jpeg» и «image/webp». Это не решает проблему, но она «исправляет» код. –

Я добавил эту строку 'document.body.appendChild (canvas);' перед включением с 'toDataURL'. И рендеринг холста тоже размыт. Таким образом, это происходит из html2canvas, и в этом нет возможности улучшить качество. –

Кроме того, я нашел этот ответ: http://stackoverflow.com/a/31726736/5119765 –

Что html2canvas не "на самом деле" принимая скриншот, но делает представление. Поэтому он создает скриншот на основе информации, доступной на странице.

Возможно, вариант не использовать размытые изображения - использовать его.

https://github.com/ivoviz/feedback

Это плагин JQuery на основе html2canvas, которая позволяет делать скриншоты к определенной части страницы. Попробуйте :)

источник

2016-03-23 13:09:41

спасибо, я проверю это :)! –

save div as png - html2canvas - blurry quality

ответ

Смежные вопросы