如何对 svg 图层进行编码，使其出现在 Inkscape 图层下拉菜单中？答案

【问题标题】：How to code svg layers so they appear in Inkscape layers drop down menu?如何对 svg 图层进行编码，使其出现在 Inkscape 图层下拉菜单中？
【发布时间】：2015-02-10 02:05:01
【问题描述】：

我正在为以后的 Inkscape 后期编辑编写一些 svg。另外，我想让组在下拉菜单中显示为图层。但目前，当我点击时，我只看到(root)，仅此而已，而我实际上有 12 层，应该会产生 12 行起球。

我目前有：

svg.append("g")
    .attr("groupmode","layer")
    .attr({'id':'L1_borders','label':'L1_borders'})

但它不起作用（see & download）。

如何对 svg 图层进行编码，使其出现在 Inkscape 图层下拉菜单中？

【问题讨论】：

标签： svg d3.js inkscape

【解决方案1】：

打开 Inkscape GUI，创建一个新层，检查它显示，由于某些原因，Inkscape 在几个属性键之前添加了命名空间“inkscape:”，例如：

所以反映这种行为的 D3 代码应该是：

svg.append("g")
    .attr("inkscape:groupmode","layer")
    .attr({'id':'L1_borders','inkscape:label':'L1_borders'})

这让我很恼火，因为它不太可能是标准的。烦人。

实际上，即使是那个添加，也被 D3js 清理了，我完全支持这个大胆的举动！

然而，我需要这些。我最终做了一个小技巧：

svg.append("g")
    .attr(":inkscape:groupmode","layer")
    .attr({'id':'L1_borders',':inkscape:label':'L1_borders'})

D3js 清理了第一个 ...: 并留下了 inkscape:label。然后它工作。通过前。在 L0 和 L1 上完成时：

现在可以在下拉式 GUI 图层菜单中以可点击行的形式访问图层。

哦，丑陋的调皮非标准hack~~~

【讨论】：

SVG 没有“层”的概念。这就是 Inkscape 使用自己的命名空间将这些信息存储在属性中的原因。
您可能还应该将命名空间声明 xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" 添加到您的根 <svg> 元素中。
为了正确添加 d3 命名空间，您可以在此处使用 d3.ns.prefix 对象来注册您自己的命名空间。