我正在绘制一系列效率（百分比）随时间变化的图表。
我对图例有具体要求：

• 单击图例项会将系列保留在图表上，但会淡化线条、标记和图例项，使其显示为“非活动”状态
• 单击"非活动“图例项可撤消淡入淡出，因此线、标记和图例项显示为”活动“
• 为每个图例项添加复选框-取消选中和选中复选框的效果与单击关联图例项的效果相同
• 按类别标题对系列进行分组（在“结晶硅电池”中）-单击此标题或其相关复选框可使整个系列组“活动”或“不活动”

所有这一切都在一个fiddle -https://jsfiddle.net/slaws/0wjpcaqt/138/中进行，它使用styledMode和一个自定义图例，并动态设置图表和自定义图例元素的不透明度：

$('.highcharts-legend-item.highcharts-series-' + value).css('opacity', new_opacity);
      $('.highcharts-series.highcharts-series-' + value).css('opacity', new_opacity);
      $('.highcharts-markers.highcharts-series-' + value).css('opacity', new_opacity);

然而，我正在努力解决另一个关键要求，即将图表的当前状态导出到图像或PDF，所有系列都以其当前的“活动”或“非活动”状态导出。因此，如果系列褪色，则应将其导出为褪色图像或PDF。
以下截图可供说明：

• This is the display of chart in the browser with the Multichrystalline series inactive
• This is how that chart is exported to PNG-我希望Multichcrystaline系列导出后的外观与浏览器中的外观相同，其线条、标记和图例项变淡，使其显示为“非活动”

您对如何导出当前样式有效的图表有什么建议吗？
PS小提琴中的图例可能会在开始时错位，但重新运行它可以纠正这一点。