英文:
When highchart has pagination can we export multiple pages of highchart
问题
我有图表，有分页功能，数据来自服务器端。我正在导出一个Highchart图表的图像，使用SVG，对于单页，它可以正常工作，但问题是，当图表有分页时，是否可以导出多页。
是否可以在渲染图表之前下载图表？我有来自API的选项数据。
我正在使用这个脚本
$("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();
});
});
请您指导我。
英文:
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.
Thanks
答案1
得分: 0
是的，可以直接创建SVG而无需渲染额外的图表。请检查getSVG图表方法以及其可选参数chartOptions：
const chart = Highcharts.chart('container', {
series: [{
data: [...]
}],
...
});
const svg = chart.getSVG({
series: [{
data: [...]
}],
...
});
在线演示: http://jsfiddle.net/BlackLabel/qk1t6wpj/
API 参考: https://api.highcharts.com/class-reference/Highcharts.Chart#getSVG
英文:
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
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论