我在我的项目中使用Highcharts(localhost),我想将我的图表(饼图和条形图)导出为PDF 离线。
作为给定的highcharts image,条形图看起来不错,但饼图显示不正确。我试图导出SVG& PNG,两者都很好,只有PDF让我陷入困境。
有关如何解决此问题的任何想法?以下是示例http://jsfiddle.net/3d406av3/20/
$(function () {
Highcharts.chart('container', {
chart: {marginLeft: 400},
title: {
text: 'Monthly Chart',
x: 50,
y: 130,
margin: 150
}, plotOptions: {
column: {
stacking: 'normal',
dataLabels: {
enabled: true,
formatter: function() {
var val = this.y;
if (val < 1) {
return '';
}
return val;
},
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'
}
}
}, xAxis: {
categories: ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30']
},
labels: {
items: [{
style: {
left: '50px',
top: '18px',
color: (Highcharts.theme && Highcharts.theme.textColor) || 'black'
}
}]
},
series: [{
type: 'column',
name: 'Jane',
data: [3, 2, 1, 3, 4, 3, 2, 1, 3, 4, 3, 2, 1, 3, 4, 3, 2, 1, 3, 4, 3, 2, 1, 3, 4, 3, 2, 1, 3, 4]
}, {
type: 'column',
name: 'John',
data: [2, 3, 5, 7, 6, 2, 3, 5, 7, 6, 2, 3, 5, 7, 6, 2, 3, 5, 7, 6, 2, 3, 5, 7, 6, 2, 3, 5, 7, 6],
center: [0, 100],
}, {
type: 'pie',
name: 'Total',
data: [{
name: 'Jane',
y: 13,
color: Highcharts.getOptions().colors[0] // Jane's color
}, {
name: 'John',
y: 23,
color: Highcharts.getOptions().colors[1] // John's color
}],
center: [-250, 250],
size: 150,
showInLegend: false,
dataLabels: {
enabled: true
}
}]
}, function (chart) {
chart.renderer.text('Pie Chart', 120, 320)
.css({
color: '#4572A7',
fontSize: '16px'
})
.add();
});
});