Html2canvas: повернутый текст с помощью CSS не может быть захвачен html2canvas

css преобразования пока не поддерживаются

Спасибо за ответ. Затем мне нужно найти другой способ отобразить этот вертикальный текст или вместо этого отобразить его по горизонтали.

Есть идеи, когда это будет поддержано. Мне это очень нужно (в частности, css3 matrix3d)

Попробуйте добавить текстовое содержимое в диапазон. У меня это сработало. Все еще не знаю, почему ...

@MaitreyJukar переносить текстовый контент в диапазон не работает для меня, грустно

Кто-нибудь находит решение для скриншота повернутых div?

обходной путь:
http://www.jjoe64.com/2015/10/html2canvas-and-css-transform-rotate.html

@ jjoe64 https://github.com/niklasvh/html2canvas/issues/209#issuecomment -152904727

Я показываю инфографику, содержащую изображения, диаграммы и текст. Поскольку вертикальный текст в диаграммах не работает, я использую canvg для преобразования каждой из этих диаграмм (которые находятся в c3 SVG) в холст, или даже иду на один шаг дальше, чтобы преобразовать упомянутый холст в изображение. Это можно сделать рекурсивно для любой группы SVG в DOM.

Как я могу сохранить div с помощью CSS-преобразования: перспектива?

Как я могу сохранить div с помощью CSS -webkit-mask-box-image: url (http://kz-c2.qiniudn.com/a.svg); ?

@ zk7035 Поскольку для поддержки каждое свойство CSS необходимо создавать вручную, существует ряд свойств, которые еще не поддерживаются. (https://github.com/niklasvh/html2canvas#browser-compatibility)

Подробности: https://github.com/niklasvh/html2canvas/issues/246

Поворот работал у меня, но с диапазоном я использовал один из ответов выше. Вот что я сделал в своем стиле я поставил класс

.vertical {
позиция: абсолютная;
слева: -50px;
верх: 0px;
ширина: 120 пикселей;
высота: 20 пикселей;
размер шрифта: 12 пикселей;
цвет: # 333;
преобразовать: повернуть (270 градусов);
}

в моем элементе позиция div в строчном стиле соответствует относительному, а внутри div - диапазону с классом vertical.

<div style="width:100%;float:left;text-align:left;height: 80px;margin-left:25px;border-left:1px solid #000;/*writing-mode: tb-rl;transform: rotate(-180deg);*/height: 100px;font-size:12px;position:relative;"><span class="vertical" style="top:20px;">Articulo No.</span></div>

Надеюсь, это кому-то поможет, салюдо