Можно ли улучшить скриншот html2canvas? - PullRequest
0 голосов
/ 27 марта 2019

Я пытаюсь получить скриншот сложной веб-страницы. Единственное разумное решение, которое мне удалось найти, это html2canvas, но оно не делает страницу полностью нормальной.

Это настоящий скриншот: enter image description here И это вывод html2canvas: enter image description here

html2canvas(document.body, {
  allowTaint: true,
  width: window.innerWidth,
  height: window.innerHeight,
  scrollX: window.pageXOffset,
  scrollY: window.pageYOffset,
  x: window.pageXOffset,
  y: window.pageYOffset
}).then(function(canvas) {
  var img = canvas.toDataURL("image/png");
  document.write('<img src="' + img + '"/>');
});

Я использую версию 0.5. Этот исходный код был взят непосредственно с главной страницы html2canvas.

Можно ли как-то улучшить его или есть лучшая альтернатива? Мне действительно безразличны сюжеты, левая часть страницы касается меня.

P.S. Вариант использования - добавить кнопку в наше веб-приложение, которая позволит пользователям сообщать об ошибке с прикрепленным снимком экрана.

1 Ответ

0 голосов
/ 27 марта 2019

Шаг: 1

Используйте тайм-аут для наложения цвета и получения изображения. Время обеспечит функционирование внутри.

html2canvas(document.body, {
  allowTaint: true,
  width: window.innerWidth,
  height: window.innerHeight,
  scrollX: window.pageXOffset,
  scrollY: window.pageYOffset,
  x: window.pageXOffset,
  y: window.pageYOffset
}).then(function(canvas) { // timeout function
  var img = canvas.toDataURL("image/png");
  document.write('<img src="' + img + '"/>');
});

Шаг: 2

Да, у меня есть решения.Вы можете использовать фантомный безголовый браузер или хромированный безголовый браузер.

В вашем случае, цвет диаграммы не применяется для данных графика и причины цветовой печати в плагине html2canvas.

Фантом js вы можете использовать верхний и нижний колонтитулы и все настройки.

...