Highcharts - 在导出时隐藏副标题

时间:2012-10-18 11:01:50

标签: javascript highcharts

我有一张包含时间序列和缩放的图表。如果字幕(“在绘图区域中单击并拖动以放大”)这将是更好的,这当然非常有用,以便在图表导出为pdf或图像时不会出现如何缩放。

所以我想知道是否有办法隐藏它。

2 个答案:

答案 0 :(得分:5)

这是关于如何做你要求的example。字幕操作的部分是:

exporting: {
   buttons: {
      exportButton: {
         menuItems: null,
         onclick: function() {
            chart.exportChart(null, {subtitle: {text:''}});
         }  
      },
      printButton: {
         onclick: function() {
            chart.setTitle(null, { text: ' ' });
            chart.print();
            chart.setTitle(null, { text: 'Click and drag in the plot area to zoom in' });
         }
      }
   }
},

修改

Sedondary选项

您可以删除Highcharts生成的打印和导出按钮。然后创建自己的打印和导出按钮以及下拉列表以选择导出类型。然后,如果单击导出按钮,请检查类型并导出为类型且不带子标题。这是一个example。以下是处理导出和打印按钮点击的代码:

$('#buttonExport').click(function() {
    var e = document.getElementById("ExportOption");
    var ExportAs = e.options[e.selectedIndex].value;   

    if(ExportAs == 'PNG')
    {
        chart.exportChart({type: 'image/png', filename: 'my-png'}, {subtitle: {text:''}});
    }
    if(ExportAs == 'JPEG')
    {
        chart.exportChart({type: 'image/jpeg', filename: 'my-jpg'}, {subtitle: {text:''}});
    }
    if(ExportAs == 'PDF')
    {
        chart.exportChart({type: 'application/pdf', filename: 'my-pdf'}, {subtitle: {text:''}});
    }
    if(ExportAs == 'SVG')
    {
        chart.exportChart({type: 'image/svg+xml', filename: 'my-svg'}, {subtitle: {text:''}});
    }
}); 

$('#buttonPrint').click(function() {
     chart.setTitle(null, { text: ' ' });
     chart.print();
     chart.setTitle(null, { text: 'Click and drag in the plot area to zoom in' });
});

答案 1 :(得分:1)

如果有人在他们的页面上有翻译并且想要打印图表,我还是保留了字幕。只需在@Linger答案上添加一个变量:

var subtitle = this.options.subtitle.text;
chart.setTitle(null, { text: ' ' });
        chart.print();
        chart.setTitle(null, { text: subtitle });                        

此处的示例代码: http://jsfiddle.net/pb6tbx7u/