javascript - 在 sapui5 中点击下载 d3 图表

Question

我在 Sapui5 中使用 d3 创建了一个维恩图。注意:我在标签内创建了圆圈，并在标签内创建了圆圈样式。

现在我有一个按钮，当我单击按钮时，可以下载并查看 svg。

未显示样式。

我正在这样做 onclick

    d3.select("#save").on("click", function(){
  var html = d3.select("svg")
        .attr("version", 1.1)
        .attr("xmlns", "http://www.w3.org/2000/svg")
        .node().parentNode.innerHTML;

  console.log(html);
  //var imgsrc = 'data:image/svg+xml;base64,'+ btoa(html);
  //var img = '<img src="'+imgsrc+'">'; 
  //d3.select("#svgdataurl").html(img);

});

谁能帮我解决这个问题。

Answer 1

样式未显示，因为它们未包含在您的 SVG 文档中。您可以拥有<style> SVG 中的标签(请参阅 MDN )。

对于您的具体情况，我会在一个单独的文件中指定该图表的 CSS 规则，您可以在保存时(再次)获取该文件并将其包含到 SVG 中，然后再提供下载。