Phantomjs 幻影不捕捉<;rect>;屏幕截图上的SVG元素
我正在尝试使用PhantomJS捕获各种SVG/HTML文档的屏幕截图。我遇到了一个问题,屏幕截图没有捕获SVG的元素 以下是包含SVG代码的HTML,该代码不起作用。请注意,此时会显示SVG的文本元素。在这个文档中,这些元素给出了框的蓝色边框,而这些元素没有显示在屏幕截图上 以下是我认为有问题的代码:Phantomjs 幻影不捕捉<;rect>;屏幕截图上的SVG元素,phantomjs,Phantomjs,我正在尝试使用PhantomJS捕获各种SVG/HTML文档的屏幕截图。我遇到了一个问题,屏幕截图没有捕获SVG的元素 以下是包含SVG代码的HTML,该代码不起作用。请注意,此时会显示SVG的文本元素。在这个文档中,这些元素给出了框的蓝色边框,而这些元素没有显示在屏幕截图上 以下是我认为有问题的代码: <rect stroke-dasharray="0" stroke-width="2" ry="2" rx="2" height="60" width="100" stroke="#077
<rect stroke-dasharray="0" stroke-width="2" ry="2" rx="2" height="60" width="100" stroke="#077bbe" fill="transparent" id="v-36"></rect>
我已经在PhantomJS版本1.8、1.9、2.0、2.1上尝试过了,但仍然存在同样的问题 你能把你的PhantomJS脚本、PhantomJS制作的截图和普通浏览器制作的截图添加到问题中吗?@Vaviloff当然!刚刚更新。你能把你的PhantomJS脚本、PhantomJS截图和普通浏览器截图添加到问题中吗?@Vaviloff当然!刚刚更新过。
var page = require('webpage').create(),
system = require('system'),
url, output, width, height;
page.onResourceReceived = function(response) {
valid = [200, 201, 301, 302]
if(response.id == 1 && valid.indexOf(response.status) == -1 ){
console.log('Received a non-200 OK response, got: ', response.status);
phantom.exit(1);
}
}
address = system.args[1];
output = system.args[2];
width = system.args[3];
height = system.args[4];
timeout = system.args[5];
console.log("Args: ", system.args);
console.log("Screenshotting: ", address, ", to: ", output);
page.viewportSize = { width: parseInt(width), height: parseInt(height) };
console.log("Viewport: ", JSON.stringify(page.viewportSize));
page.open(address, function (status) {
if (status !== 'success') {
console.log('Unable to load the address!');
phantom.exit();
} else {
// Scroll to bottom of page, so all resources are triggered for downloading
window.setInterval(function() {
page.evaluate(function() {
console.log('scrolling', window.document.body.scrollTop);
window.document.body.scrollTop = window.document.body.scrollTop + 1024;
});
}, 255);
// scroll back to top for consistency, right in time (sometimes)
// logo's dissapear when scrolling down
window.setTimeout(function() {
page.evaluate(function() {
window.document.body.scrollTop = 0;
});
}, timeout - 5);
// after the timeout, save the screenbuffer to file
window.setTimeout(function() {
page.render(output);
phantom.exit();
}, timeout);
}
});