gpt4 book ai didi

javascript - 使用 PhantomJS 保存 SVG

转载 作者:行者123 更新时间:2023-11-27 22:30:04 27 4
gpt4 key购买 nike

我有一个带有 SVG 标签的示例测试页,我正在尝试使用 PhantomJS 将其保存为 SVG 文件。我可以使用 PhantomJS 进入测试页面,但我不知道如何查找和保存 svg。以下是我尝试做的方法以及我陷入困境的地方。

  1. 导航至网页
  2. 尝试使用 document.getElementsByTagName('svg') 查找 svg 标签
  3. 从这里该做什么?我可以看到 phantom 返回一个巨大的对象,但在他们的网站上找不到任何关于如何处理它的信息。如何将此对象转换为 svg 文件?

测试页面如下所示:

<HTML>

This is a Testpage. You like it, don't you?

<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">

<defs>
<linearGradient id="myLinearGradient1"
x1="0%" y1="0%"
x2="0%" y2="100%"
spreadMethod="pad">
<stop offset="0%" stop-color="#00cc00" stop-opacity="1"/>
<stop offset="100%" stop-color="#006600" stop-opacity="1"/>
</linearGradient>
</defs>

<rect x="10" y="10" width="75" height="100" rx="10" ry="10"
style="fill:url(#myLinearGradient1);
stroke: #005000;
stroke-width: 3;" />

</svg>

</HTML>

和 PhantomJS 脚本

var page = require('webpage').create();

console.log('The default user agent is ' + page.settings.userAgent);

function getSVG(link, callback) {
page.open(link, function(status) {
if (status !== 'success') {
console.log('Unable to access network');
} else {
var ua = page.evaluate(function() {
return document.getElementsByTagName('svg');
});
// Don't know what to do here
}
phantom.exit();
callback();
});
}

getSVG('testpage', function () {
console.log('done');
});

最佳答案

var svg = page.evaluate(function(){
return document.querySelector("svg").outerHTML;
});

var fs = require("fs");
fs.write("file.svg", svg);

应该可以帮助您入门,但这可能还不够,因为可以使用 CSS 操作 SVG。

关于javascript - 使用 PhantomJS 保存 SVG,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39678439/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com