javascript - 有没有办法将 JSON 转换为 SVG 对象？

Question

我正在开发一个签名捕获小程序，其中一个要求是它将签名存储为 SVG 以供将来使用。我目前正在使用 Signature Pad捕获签名，但它将其存储为 JSON。无论如何都可以使用 JSON 生成 SVG 对象，还是我以错误的方式解决这个问题？

Answer 1

谢天谢地，Signature Pad 以 super 可读的方式对 JSON 数据进行了编码。因为 SVG 只是一个文本文档，我们可以很容易地以编程方式生成一个 SVG 图像给定编码的 JSON 签名。

作为概念验证，取 this regenerated signature来自 Pad 文档。我们只需要从每个对象生成 SVG 路径。看着 source对于它是如何为 Canvas 完成的(搜索 drawSignature)，您可以用您选择的任何语言制作一个简单的示例。

Here's a jsfiddle for it in JavaScript.

function generate_svg(paths) {
  var svg = '';
  svg += '<svg width="198px" height="55px" version="1.1" xmlns="http://www.w3.org/2000/svg">\n';

  for(var i in paths) {
    var path = '';
    path += 'M' + paths[i].mx + ' ' + paths[i].my;   // moveTo
    path += ' L ' + paths[i].lx + ' ' + paths[i].ly; // lineTo
    path += ' Z';                                    // closePath
    svg += '<path d="' + path + '"stroke="blue" stroke-width="2"/>\n';
  }

  svg += '</svg>\n';
  return svg;
}