4

ファントムjsを使用してページのスクリーンショットを撮っています

http://code.google.com/p/phantomjs/wiki/QuickStart#Rendering

それはclipRectと呼ばれる機能を持っています

http://code.google.com/p/phantomjs/wiki/Interface#clipRect_(オブジェクト)

次のコードをclipRectに変更して、全体ではなく部分的なスクリーンショットのみを取得する方法を誰かに教えてもらえますか?

if (phantom.state.length === 0) {
if (phantom.args.length !== 2) {
    console.log('Usage: rasterize.js URL filename');
    phantom.exit();
} else {
    var address = phantom.args[0];
    phantom.state = 'rasterize';
    phantom.viewportSize = { width: 600, height: 600 };
    phantom.open(address);
}
} else {
    var output = phantom.args[1];
    phantom.sleep(200);
    phantom.render(output);
    phantom.exit();
}
4

3 に答える 3

4

特定の要素のスクリーンショットを取得しようとしている場合は、この記事の下部clipRectから必要な情報を取得できます。getBoundingClientRect

page.clipRect = page.evaluate(function() {
    return document.getElementById(THE_ELEMENT_YOU_WANT).getBoundingClientRect(); 
});
于 2013-04-19T01:41:00.117 に答える
2

細かいマニュアルから：

clipRect (オブジェクト)

このプロパティは、render() が呼び出されたときにラスタライズされる Web ページの長方形の領域を定義します。クリッピング四角形が設定されていない場合、render() は Web ページ全体を処理します。

例：phantom.clipRect = { top: 14, left: 3, width: 400, height: 300 }

だからclipRectあなたが呼び出す直前に設定してみてくださいrender：

var output = phantom.args[1];
phantom.sleep(200);
phantom.clipRect = { top: 14, left: 3, width: 400, height: 300 }
phantom.render(output);
phantom.exit();

左上隅 (topおよび) の位置と、クリッピング四角形をleftどのくらいの大きさ (widthおよび) にするかを把握する必要があります。height

おそらく呼び出されるclipRect前にいつでも設定できますがrender()、それから始めて何が起こるかを見てください。

于 2011-06-22T04:13:10.423 に答える
0

何が起こっていたのかというと、私はbrewを使用していて、v 1.0.0が最も古いバージョンであるため、clipRectと他のほとんどすべての機能がサポートされていないv1.0.0をインストールしていました。

次の手順に従う場合：http ：//code.google.com/p/phantomjs/wiki/BuildInstructions#Mac_OS_X

次に、コンパイルされたファイルを右クリックし、[コンテンツの表示/表示]（Macの場合）をクリックして、実行可能ファイルbin / phantomjs.app / Contents / MacOS/phantomjsをPATHのディレクトリにコピーします。

ここに投稿してください。私はこれを監視しており、必要に応じてお手伝いできます。

于 2011-07-01T02:35:24.743 に答える