Rendering xoay văn bản sang PDF trong PhantomJS

Question

Tôi có một trang HTML, trong đó có nhiều đoạn văn bản đó được luân chuyển bằng cách sử dụng mảnh sau của CSS:

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

Khi tôi kéo lên trang trực tiếp trong trình duyệt này hiển thị như mong đợi. Khi tôi hiển thị trang thông qua PhantomJS, dường như nó bỏ qua vòng xoay.

Tôi đã nâng cấp lên Phantom 2.0.0 nhưng vẫn là vấn đề tương tự.

Có cách nào để thực hiện công việc này không?

Answer 1

Tôi đã thử nghiệm nó bằng PhantomJS 1.9.18 trong ứng dụng nút.

Với -webkit-transform và -webkit-transform-origin văn bản trên PDF được tạo sẽ được xoay. Withouth the -webkit tiền tố của nó chỉ xoay khi tôi xem nó với một trình duyệt, không được hiển thị trong pdf.

Vì vậy, bạn nên thay đổi CSS của bạn để

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

Answer 2

Phantom JS được dựa trên Webkit. Bạn cần sử dụng tiền tố -webkit- cho các quy tắc css không tương thích.

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