PhantomJS在为我捕获网页到图像文件方面做得非常出色.我正在使用基于rasterize.js的脚本.
但是,对于某些固定大小的Web元素,我需要生成的图像与Web元素的大小相匹配.
我有一个这样的页面:
<html>
<body>
<div id="wrapper" style="width:600px; height:400px;">
Content goes here...
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
在这个例子中,我需要它来生成一个600x400的图像.是一种基于我正在栅格化的页面中的web元素动态获取视口大小的方法.
我知道这个不是一个简单的...想法?
谢谢
Pre*_*ete 23
哇.毕竟不是那么难.只需将视口设置得非常大并使用cropRect函数即可.多棒的工具啊!
对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);
}
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
9666 次 |
| 最近记录: |