如何在Highcharts导出菜单中显示分隔线？

Question

Highcharts导出工具的"打印图表"条目下方有一条直线.我想生成其中的一个或两个,以便将图像与数据格式分开,以及在添加其他链接之前.

我怎样才能生成这条线？我尝试使用DIV,但这似乎不是解决方案(过多的调整和欺骗),也不是<hr>.那么最好的选择是什么？

谢谢你的任何提示!

Answer 1

使用Highcharts API,在定义菜单时,您只需将以下代码添加为exporting.buttons.contextButton.menuItems数组中的元素:

{ separator: true }

以下代码将直接添加到图表选项中,并显示如何分隔每个项目(请参阅JSFiddle):

exporting: {
    buttons: {
        contextButton: {
            menuItems: [{
                textKey: 'printChart',
                onclick: function () {
                    this.print();
                }
            }, {
                separator: true
            }, {
                textKey: 'downloadPNG',
                onclick: function () {
                    this.exportChart();
                }
            }, {
                separator: true
            }, {
                textKey: 'downloadJPEG',
                onclick: function () {
                    this.exportChart({
                        type: 'image/jpeg'
                    });
                }
            }, {
                separator: true
            }, {
                textKey: 'downloadPDF',
                onclick: function () {
                    this.exportChart({
                        type: 'application/pdf'
                    });
                }
            }, {
                separator: true
            }, {
                textKey: 'downloadSVG',
                onclick: function () {
                    this.exportChart({
                        type: 'image/svg+xml'
                    });
                }
            }]
        }
    }
}