Phantom JS - clipRect - Javascript Справка

Question

Я использую Phantom JS для скриншота страницы

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

имеет функцию clipRect

http://code.google.com/p/phantomjs/wiki/Interface#clipRect_(object)

Может кто-нибудь показать мне, как я могу изменить следующий код для нас 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();
}    

Answer 1

Если вы пытаетесь получить скриншот определенного элемента, вы можете получить необходимую информацию для clipRect из getBoundingClientRect согласно нижней части этой статьи :

page.clipRect = page.evaluate(function() {
    return document.getElementById(THE_ELEMENT_YOU_WANT).getBoundingClientRect(); 
});

Answer 2

Из тонкой инструкции :

clipRect (объект)

Это свойство определяет прямоугольную область веб-страницы, которая будет растеризована при вызове render (). Если прямоугольник отсечения не установлен, render () будет обрабатывать всю веб-страницу.

Пример: 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(), но начните с этого и посмотрите, что произойдет.

Answer 3

Происходило то, что я использовал brew, и он устанавливал v 1.0.0, где clipRect и почти все остальные функции не поддерживались, поскольку v 1.0.0 является самой старой версией.

Если вы следуете этим инструкциям: http://code.google.com/p/phantomjs/wiki/BuildInstructions#Mac_OS_X

, затем щелкните правой кнопкой мыши на соответствующем файле и выберите Показать / просмотреть содержимое (на Mac), а затем скопируйте исполняемый файл bin / phantomjs.app / Contents / MacOS / phantomjs в какой-либо каталог в вашем PATH.

Не стесняйтесь писать здесь, я отслеживаю это и могу помочь, если это необходимо.