2015-07-14 2 views
7

У меня есть HTML-страницу, которая содержит несколько частей текста, которые вращались с помощью следующей кусок CSS:Rendering повернуты текст в формате PDF в PhantomJS

.rotate { 
    transform: rotate(90deg); 
    transform-origin: 50% 50%; 
} 

Когда я вырывать страницы прямо в браузере этого как и ожидалось. Когда я делаю страницу через PhantomJS, она, кажется, игнорирует поворот.

Я обновился до Phantom 2.0.0, но все тот же вопрос.

Есть ли способ сделать эту работу?

+0

Вы попробовали -webkit-transform? – Ello

ответ

12

Я тестировал его с помощью PhantomJS 1.9.18 в приложении узла.

С -webkit-transform и -webkit-transform-origin текст сгенерированного PDF повернут. Withouth -webkit префиксы его только повернуты, когда я просматриваю его с помощью браузера, а не отображается в pdf.

Таким образом, вы должны изменить CSS для

.rotate { 
    -webkit-transform: rotate(90deg); 
    transform: rotate(90deg); 
    -webkit-transform-origin: 50% 50%; 
    transform-origin: 50% 50%; 
} 
0

Phantom JS основан на Webkit. Вы должны использовать префикс -webkit- для несовместимых правил CSS.

.rotate { 
    -webkit-transform: rotate(90deg); 
    -webkit-transform-origin: 50% 50%; 
} 
Смежные вопросы