Html2canvas: Невозможно нарисовать SVG на холсте HTML

Почти уверен, что SVG не поддерживается, мне пришлось использовать https://github.com/canvg/canvg, чтобы сначала преобразовать весь SVG в холст, а затем распечатать его.

Вы также можете взглянуть на этот пример. http://rahulgaba.com/front-end/2016/07/14/generating-pdf-using-jspdf-and-html2canvas.html

Хммм, я использую html2canvas вместе с svg. У меня с этим проблем нет.

@LanderBeeuwsaert

Не могли бы вы скопировать мне свой файл SVG? Как я описал, он работает в браузере Safari, но не работает в Chrome. Спасибо.

@LanderBeeuwsaert
Не могли бы вы поместить его в пример работы jsfiddle с комбинацией html2canvas и svg

@ мокей-жокей,

Эй, я не слишком знаком с jsfiddle, поэтому, если вы подготовите для меня зависимости в jsfiddle, а затем отправите мне ссылку, чтобы я мог завершить (нужно только заменить svg на мой svg), я был бы счастлив.

Я не могу это запечатлеть.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">...</svg>

Но я могу записать этот файл svg.

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">...</svg>

Я просто добавляю ширину и высоту.

Возникли аналогичные проблемы здесь. Встроенные SVG-файлы не отображаются на холсте.

В Safari все работает нормально, но только если все свойства включены в SVG. Поэтому, если вы добавляете свои размеры, заливку, обводку и т. Д. Через таблицу стилей CSS, они не будут отображаться, и это не сработает.

В Chrome и Firefox я вообще не могу заставить его отображать встроенные SVG. Странный.

Обновление: при включении ForeignObjectRendering в качестве опции Chrome теперь отображает SVG, но они находятся в неправильном месте, и по какой-то причине это также повлияло на принудительное использование текста в другом шрифте. В Firefox при включении этого возникает следующая ошибка:

Мой svg рендеринг, но немного смещен (около 150 пикселей)