Highcharts - 导出打印选项以匹配导出到 png

Question

如何让打印的导出选项与 png、jpg 等的导出选项完全匹配？ 基本上，我有一个带有缩放功能的图表，我想在用户选择打印时删除 rangeSelector、导航器和滚动条。 我已经设置了如下的导出选项，但它似乎只适用于不涉及打印的导出选项。

exporting: {
    chartOptions: {
        rangeSelector: {
            selected: 4,
            inputEnabled: false,
            buttonTheme: {
                visibility: 'hidden'
            },
            labelStyle: {
                visibility: 'hidden'
            }
        },
        navigator: {
            enabled: false
        },
        scrollbar: {
            enabled: false
        }
    },
    scale: 3,
    fallbackToExportServer: false
}

Answer 1

您可以使用beforePrint 事件并使用新选项更新图表来实现它。之后使用afterPrintevent 使用旧选项更新图表。

代码：

  chart: {
    events: {
      beforePrint: function() {
        var chart = this;

        chart.update({
          rangeSelector: {
            selected: 4,
            inputEnabled: false,
            buttonTheme: {
              visibility: 'hidden'
            },
            labelStyle: {
              visibility: 'hidden'
            }
          },
          navigator: {
            enabled: false
          },
          scrollbar: {
            enabled: false
          }
        }, true, false, false);
      },
      afterPrint: function() {
        var chart = this;

        chart.update({
          rangeSelector: {
            selected: 1,
            inputEnabled: true,
            buttonTheme: {
              visibility: 'visible'
            },
            labelStyle: {
              visibility: 'visible'
            }
          },
          navigator: {
            enabled: true
          },
          scrollbar: {
            enabled: true
          }
        }, true, false, true);
      }
    }
  }

演示：
https://jsfiddle.net/fs80h3qg/

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