2013-02-01 32 views
19

PhantomJS đang thực hiện một công việc tuyệt vời là chụp các trang web vào các tệp hình ảnh cho tôi. Tôi đang sử dụng một tập lệnh dựa trên rasterize.js.Cắt ảnh chụp màn hình PhantomJS có kích thước thành nội dung

Tuy nhiên, đối với một số yếu tố web nhất định có kích thước cố định, tôi cần hình ảnh kết quả phù hợp với kích thước của phần tử web.

ví dụ: Tôi có một trang như sau:

<html> 
<body> 
    <div id="wrapper" style="width:600px; height:400px;"> 
     Content goes here... 
    </div> 
</body> 
</html> 

Trong ví dụ này, tôi cần nó để tạo ra hình ảnh có kích thước 600x400. Đó có phải là một cách để có được kích thước khung nhìn động dựa trên một yếu tố web trong trang tôi đang rasterizing.

Tôi biết điều này không dễ dàng ... Ý tưởng?

Cảm ơn

Trả lời

23

Wow. Không phải là khó khăn sau khi tất cả. Chỉ cần đặt chế độ xem thực sự lớn và sử dụng chức năng cropRect. Thật là một công cụ tuyệt vời!

Mods để rasterize.js:

page.open(address, function (status) { 
    if (status !== 'success') { 
     console.log('Unable to load the address!'); 
    } else { 
     var height = page.evaluate(function(){ 
      return document.getElementById('wrapper').offsetHeight; 
     }); 
     var width = page.evaluate(function(){ 
      return document.getElementById('wrapper').offsetWidth; 
     }); 
     console.log('Crop to: '+width+"x"+height); 

     page.clipRect = { top: 0, left: 0, width: width, height: height }; 
     window.setTimeout(function() { 
      page.render(output); 
      phantom.exit(); 
     }, 200); 
    } 
}); 
+2

Để ai đó tìm thấy con đường của họ ở đây trên một quest cho PDF hoàn hảo - clipRect là cho hình ảnh chỉ ngay bây giờ (mặc dù nó không rõ ràng nói rằng trong tài liệu). Đã xảy ra lỗi. – Chords

+3

tại sao bạn sử dụng window.settimeout để hiển thị? – user20358

+2

Nếu trang hiển thị nội dung có hình động, v.v. thời gian chờ là cần thiết để đảm bảo tất cả các thành phần đều hiển thị. – Mika

Các vấn đề liên quan