Highcharts：动态更新导出文件名答案

【问题标题】：Highcharts: Dynamically update export filenameHighcharts：动态更新导出文件名
【发布时间】：2022-01-23 20:37:10
【问题描述】：

我正在使用 highcharts 创建各种图表，并且我还有一个月份选择器，以便用户可以选择要在图表上显示数据的月份。每次用户选择不同的日期时，都会加载一个新图表。由于“导出：文件名”仅在图表初始化期间设置一次，因此每次用户使用导出为 CSV 选项时，下载的文件都具有在图表初始化期间设置的名称。

我在 'exporting: filename' 选项中添加了一个 var 来读取月份选择器的值，使用这个：

var Name = $("#date_picker").val();

exporting: {enabled: true,
            filename: "Monthly Report: - " + Name + ""
           }

但当用户选择与初始页面加载期间设置的月份不同的月份时，它不会更新文件名。

我也尝试添加一个按钮来运行 downloadCSV 脚本并以这种方式更新文件名：

var Name = $("#date_picker").val();
document.getElementById('button1').addEventListener('click', function () {
        highcharts.chart("report_chart").update({
                events: {
                    load: function () {
                        this.update({
                            exporting: {
                                filename: "Monthly Report - " + Name + ""
                            }
                        });
                    }
                }
             });
    });

但它并没有达到我想要的效果。

有没有办法动态更新导出的 CSV 文件名，使其包含用户在日期选择器中选择的月份？

【问题讨论】：

标签： javascript highcharts export-to-csv filenames

【解决方案1】：

你只需要更改chart.update中的文件名：

  chart.update({
    exporting: {
      filename: "Monthly Report: 2"
    }
  });

现场演示： http://jsfiddle.net/BlackLabel/1qyL0sej/

API 参考： https://api.highcharts.com/class-reference/Highcharts.Chart#update

【讨论】：