我已经为highcharts动态插入了系列,我一直试图将图表导出为PDF,如下所示。
小提琴示例: http://jsfiddle.net/jq0zbffb/
更新的代码:
// getMyChart() starts
function getMyChart() {
var myChart;
Highcharts.setOptions({
lang: {
thousandsSep: ',',
numericSymbols: ['M']
}
});
var options = {
chart : {
renderTo : 'container',
type : 'area'
},
xAxis : {
lineWidth: 0,
categories : []
},
yAxis : [ {
title : {
text : 'Averages',
},
lineWidth: 0,
} ,
{
title : {
text : 'Values',
},
opposite: true,
lineWidth: 0,
}],
series : []
};
// jQuery
$.get(url, function(xml) {
var $xml = $(xml);
$xml.find('categories Date').each(
function(i, category) {
options.xAxis.categories.push($(category).text());
});
$xml.find('type Series').each(
function(i, series) {
var seriesOptions = {
name : $(series).find('name').text(),
data : []
};
$(series).find('data point').each(
function(i, point) {
seriesOptions.data.push(parseInt($(point).text()));
});
options.series.push(seriesOptions);
});
myChart = new Highcharts.Chart(options);
});
//jquery ends
// .getSVG function
Highcharts.getSVG = function(charts) {
var svgArr = [],
top = 0,
width = 0;
$.each(charts, function(i, chart) {
var svg = chart.getSVG();
svg = svg.replace('<svg', '<svg transform="translate(0,' + top + ')" ');
svg = svg.replace('</svg>', '</svg>');
top += chart.chartHeight;
width = Math.max(width, chart.chartWidth);
svgArr.push(svg);
});
console.log(svgArr);
return '<svg height="'+ top +'" width="' + width + '" version="1.1" xmlns="http://www.w3.org/2000/svg">' + svgArr.join('') + '</svg>';
};
Highcharts.exportCharts = function(charts, options) {
options = Highcharts.merge(Highcharts.getOptions().exporting, options);
Highcharts.post(options.url, {
filename: options.filename || 'Pulse_Chart',
type: options.type,
width: options.width,
svg: Highcharts.getSVG(charts)
});
};
$('#export').click(function() {
Highcharts.exportCharts([myChart], {type: 'application/pdf'});
});
} // getMyCharts ends
HTML:
<div id="container" class="myChart" style="width: 100%; height: 500px; margin: 0 auto"></div>
<button id="export">Export all</button>
问题:
SCRIPT5009: 'chart' is undefined
我使用jQuery动态插入系列。
是否有可能导出这样的图表?任何人都可以指出我哪里出错了? 感谢您的时间和帮助。