Question

我通过一个小帮手包使用d3：https://www.npmjs.com/package/d3-node

我使用d3-node创建了我的svg文件，这里是代码。

const D3Node = require('d3-node')

var d3n = new D3Node()
var svg = d3n.createSVG()
    .style("width","1920px")
    .style("height","1080px") 
    .attr("preserveAspectRatio","true")
.html(firstTemplate)
.append("myCustomTag")

此后，我不知道如何保存输出。主要问题在myCustomTag。

console.log(d3n.d3Element.select("svg").node().innerHTML)

这一行应该输出我的svg，除了myCustomTag变成mycustomtag并且我的svg被破坏之外，它确实会输出。

我尝试了select("svg").node().outerHTML，select("svg").html()，innerText，我无法找到任何内容。

在这种情况下我不能使用innerHTML，有没有办法直接从d3变量存储svg文件？

Answer 1

您可以使用xmlserializer，因为SVG是XML而XML是区分大小写的。这样的事情works for me：

const D3Node = require('d3-node');
const xmlserializer = require('xmlserializer');

const d3n = new D3Node();
var svg = d3n.createSVG()
    .style("width","1920px")
    .style("height","1080px")
    .attr("preserveAspectRatio","true");

svg.append("myCustomTag");

console.log(xmlserializer.serializeToString(svg.node()));

HTML不区分大小写，因此当您尝试使用HTML方法序列化某些内容时，您不一定会获得所需内容。

如何使用nodejs将svg节点保存到文件？

1 个答案: