从 vega 图表获取图表 SVG

【问题标题】：Get chart SVG from vega chart从 vega 图表获取图表 SVG
【发布时间】：2020-08-19 12:14:53
【问题描述】：

我正在从 vega 2.x 迁移到 5.13.0 版本。我正在尝试生成图表 SVG，所以我可以根据我的要求使用。为此，我正在使用 toSVG()。在使用 success 或 catch 方法时，两者都不会触发。


      var view = new vega.View(vega.parse(chartJson), {renderer: 'none'});
      view.toSVG().then(function (svg) {
        console.log(svg)
      }).catch(function(err){
        console.log(err)
      });

【问题讨论】：

标签： javascript svg char vega

【解决方案1】：

您可以执行以下操作：

var _v = new vega.View(vega.parse(spec))...

_v.toSVG()
  .then(svgString => {
      const filename = 'chart.svg';
      const url = 'data:image/svg+xml,' + encodeURIComponent(svgString);
      const link = document.createElement('a');
      link.setAttribute('href', url);
      link.setAttribute('target', '_blank');
      link.setAttribute('download', filename);
      link.dispatchEvent(new MouseEvent('click'));
    })

这将下载 SVG。改编自不同的stackoverflow answer（用于mime 类型）和Vega test cases（用于处理toSVG() 承诺）。

【讨论】：