使用数据导出 SVG 的 Highcharts pre-selected

Question

我正在尝试将 Highcharts sankey 图导出为 SVG，我希望有几个不同的矢量文件，其中突出显示了图表的不同部分（单击），因此我可以在它们之间淡入淡出 pre-recorded 介绍。我想不出任何方法让导出模块导出一个通过单击突出显示的 SVG——它只导出“普通”图形。有人可以帮忙吗？

我附上了我想要的截图，因为我不知道如何将它们导出为矢量文件。无论如何，数据总是像第一张图一样导出：

但我也希望它导出为以下两个图表，其中选择了数据的各个部分：

Answer 1

这是我的想法，如何使用 exporting.menuItemDefinition 功能实现它。

为每个节点创建全局标志，如customSVGExport1、

创建具有将标志更改为 true 并触发 SVG 下载（并再次呈现图表）的功能的自定义导出菜单按钮，

onclick: function() {
  customSVGExport1 = true;
  this.exportChart({
    type: 'image/svg+xml'
  });
},

以下函数将被触发：

 chart: {
   events: {
     render() {
       let chart = this;

       if (customSVGExport1) {
        // Trigger point hover event
        chart.series[0].nodes[0].onMouseOver();
        // Hide tooltip for export
        chart.tooltip.label.hide();
        // Set flag back to false;
        customSVGExport = false;
      } else if (customSVGExport2) {
         chart.series[0].nodes[1].onMouseOver();
         chart.tooltip.label.hide();
         customSVGExport = false;
      }
    }
  }
},

演示：https://jsfiddle.net/BlackLabel/x67jwsmo/

API: https://api.highcharts.com/highcharts/exporting.menuItemDefinitions

API: https://api.highcharts.com/highcharts/chart.events.render

使用数据导出 SVG 的 Highcharts pre-selected

Highcharts exporting SVG with data pre-selected

javascript

charts

svg

vector-graphics

highcharts