CODEWITHSUNDEEP
javascripthighcharts
harish kumar
harish kumar

Reputation: 1759

Hide Scrollbar when Printing highchart from export menu

Is there any way to hide scrollbar when printing chart while exporting. I am able to hide scrollbar when exporting image & pdf but not able to hide it while choosing print chart option.

I have tried exporting.chartOptions configuration like below

      chart_options.exporting.chartOptions = {
        xAxis : [{
          categories: timeline,
          min: 0,
          minRange: timeline.length-1,
          max: timeline.length-1
        }],
        scrollbar:{
          enabled: false
      }

It is working fine with other exporting options but not in print chart option.

https://jsfiddle.net/harishk3499/gdv7oz9w/

Please help!

Upvotes: 1

Views: 473

Answers (2)

User863
User863

Reputation: 20039

Using CSS Printing - @media Rule

@media print {
  .highcharts-scrollbar {
    display: none;
  }
}

UPDATE

By dynamically changing the max property of xAxis 

chart.xAxis[0].setExtremes(null, null);    
chart.xAxis[0].options.max = undefined;
chart.render();

Working demo

Upvotes: 1

ppotaczek
ppotaczek

Reputation: 39139

You can use beforePrint and afterPrint events to change a chart:

chart: {
    events: {
        beforePrint: function() {
            this.update({
                scrollbar: {
                    enabled: false
                }
            });
        },
        afterPrint: function() {
            this.update({
                scrollbar: {
                    enabled: true
                }
            });
        }
    }
}

Live demo: http://jsfiddle.net/BlackLabel/ae905yfx/

API Reference:

https://api.highcharts.com/highcharts/chart.events.afterPrint

https://api.highcharts.com/highcharts/chart.events.beforePrint

Upvotes: 1

Related Questions