Search code examples
javascripthighcharts

When highchart has pagination can we export multiple pages of highchart

I have chart which has pagination and data is coming from server side. I am export the one image of highchart using SVG it is working fine for one page but problem, is it possible to export multiple pages when chart has pagination.

Is it possible to download the chart without render chart? I have options data from API.

I am using this script

$("body").on('click','.download-chart-btn', function() {
        html2canvas($(this).closest('.grid-stack-item-content').find('.dashboad_chart_render')[0]).then(function(canvas) {
                var imageUrl = canvas.toDataURL();
                var link = document.createElement('a');
                link.href = imageUrl;
                link.download = 'chart-image.png';
                link.click();
        });
    });

Please can you guide me.

enter image description here

Thanks

Solution

  • Yes, it is possible to directly create SVG without rendering an additional chart. Please check the getSVG chart's method with its chartOptions optional parameter:

    Additional chart options for the generated SVG representation. For collections like xAxis, yAxis or series, the additional options is either merged in to the original item of the same id, or to the first item if a common id is not found.

    const chart = Highcharts.chart('container', {
  series: [{
    data: [...]
  }],
  ...
});

const svg = chart.getSVG({
  series: [{
    data: [...]
  }],
  ...
});

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

    API Reference: https://api.highcharts.com/class-reference/Highcharts.Chart#getSVG