phantomjs对页面的某个div截图

      昨天写了一篇《对网页进行截图》，今天在家想了想，在项目中，我们为了导出hightcharts做的图在报告中用，我们更好的方式是对某个div进行截图，所以趁着周天，边查资料边改造，把昨天的那个项目改成了截取某个div的截图，到此刻，搞完了。记录一下，以备不时之需。

     相比于昨天的我们需要给批处理文件多传一个参数也就是那个div的id，对我对那个js修改为如下：

system = require('system')  
address = system.args[1]; //获取传递进来的参数1


var path=ids+".png";
var page = require('webpage').create(),ids;
ids= system.args[2];
var width = 1349;  
var height = 1883;  


page.viewportSize = {width: width, height: height};


page.open(address, function () {
console.log("ids2---"+ids);
    var length= page.evaluate(function (s) {  
           var div = document.getElementById(s); //要截图的div的id  
            var bc = div.getBoundingClientRect();  
            var top = bc.top;  
            var left = bc.left;  
            var width = bc.width;  
            var height = bc.height;  
            window.scrollTo(0, 10000);//滚动到底部  
            return [top, left, width, height];  
        },ids);  // page.evaluate(fn, [param]) 那个param就可以把外面的参数传进去了
        console.log(length);  
        page.clipRect = { //截图的偏移和宽高  
            top: length[0],  
            left: length[1],  
            width: length[2],  
            height: length[3]  
        };  
page.render(ids+".png");  
        phantom.exit();  
});

然后对批处理文件的执行phantomjs多加一个参数，如下：

d:
phantomjs.exe dome1.js %1 %2
exit 

    这样就搞定了，开始在Java中执行。如下：

Runtime.getRuntime().exec("cmd /c start D:/dome1.bat http://127.0.0.1:8020/ha/index.html containerType5");

    就这样截图成功。再也不用担心图表后台程序导出了。