在本地保存d3js图

Question

我正在使用d3js创建图。 我还希望使用户能够在自己的计算机上本地保存该图。 因此，我使用此问题中提到的代码的稍有变化的版本来创建该图的可下载图片。

所以我有以下代码：

$("svg").attr({ version: '1.1' , xmlns:"http://www.w3.org/2000/svg"});

var svg = $("#chart-main").html();  var b64 = btoa(unescape(encodeURIComponent(svg)));//Base64.encode(svg); // or use btoa if supported

// Works in recent Webkit(Chrome)  
$("body").append($("<img src='data:image/svg+xml;base64,\n"+b64+"' alt='file.svg'/>"));


 // Works in Firefox 3.6 and Webit and possibly any browser which supports the data-uri
  $("body").append($("<a href-lang='image/svg+xml' href='data:image/svg+xml;base64,\n"+b64+"' title='file.svg'>Download</a>"));

但是，当我按下载链接时，出现以下错误：此页面包含以下错误：

第16行第6行出现错误
未定义实体“ nbsp”

链接就像data:image/svg+xml;base64,CgkJCQkJP....CgkJCQk=

我该如何解决？

Answer 1

问题是  是HTML实体。

一个独立的SVG文件（一种XML格式）仅支持五个预定义的XML实体： & ， " ， ' ， < 和> 。

但是，要表示任何其他unicode字符，您可以使用基于unicode值的字符引用。 不间断空格的代码是  。 使用它来替换  并且您的SVG文件应经过验证。

PS我发现FileFormat.info的字符搜索站点对于查找Unicode值很有用。