CODEWITHSUNDEEP
javascripthighcharts
user1755999
user1755999

Reputation: 1

Highcharts - Hide subtitle on exporting

I have a chart with time series and zoom. It will be better if the subtitle ("Click and drag in the plot area to zoom in") which is certainly very usefull in order to understand how to zoom don't appears when the chart is exported to pdf or image.

So I wonder if there is a way to hide it.

Upvotes: 0

Views: 2446

Answers (2)

Vashete
Vashete

Reputation: 11

I did another example keeping the subtitle if anyone have translations on their pages and want to print the chart. Just simply add a variable on the @Linger answer: 

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

Example code here: http://jsfiddle.net/pb6tbx7u/

Upvotes: 1

Linger
Linger

Reputation: 15048

Here is a example on how to do what you are asking. The part does the subtitle manipulation is:

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' });
         }
      }
   }
},

EDIT:

Sedondary option

You could remove the Highcharts generated print and export buttons. Then create your own print and export buttons along with a drop down for selecting the export type. Then if the export button is clicked, check the type and export as the type and without the sub title. Here is an example. Here is the code that handles the export and print button clicks:

$('#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' });
});

Upvotes: 5

Related Questions