Question

我有我的highcharts代码，我想使用 IE9 将highcharts导出为PDF。

在我的代码中，图表svg正在渲染，但在此之后什么也没做，我得到了console.log输出，直到代码LOG 2 : return back中的这一行，然后页面变为静止。

我无法理解导入的js或代码是否有任何问题。任何人都可以帮我解决问题。

我的代码：

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <meta http-equiv="X-UA-Compatible" content="IE=9;FF=3;OtherUA=4" />
    <title>MyChart></title>

<!-- Dependencies -->   
<script src="//a----.github.io/highcharts-export-clientside/bower_components/jquery/dist/jquery.min.js"></script>
<script src="//a----.github.io/highcharts-export-clientside/bower_components/highcharts/highcharts.js"></script>

<script src="//a----.github.io/highcharts-export-clientside/bower_components/highcharts/modules/exporting.js"></script>

  <script type="text/javascript">

            $(document).ready(function()
             {
                getData();
            });

            function getData() {

                var options = {
                    chart : {
                        renderTo : 'container',
                        type:'area'
                    },
                    xAxis : {
                        categories : []
                    },

                    yAxis : [ {
                        title : {
                            text : 'Values'
                            }
                        }],

                    exporting: {
                        enabled : true,
                         type: 'application/pdf'
                            },
                    series : []
                };

                //jquery to populate the series
                $.get(url, function(xml) {
                    var $xml = $(xml);
                    $xml.find('category dates').each(
                            function(i, category) {
                                options.xAxis.categories.push($(category).text());
                            });
                    $xml.find('types Series').each(
                            function(i,series){
                                var seriesOptions = {
                                        name : $(series).find('name').text(),
                                        data : [],
                                        type : 'area',
                                    };
                                $(series).find('date point').each(
                                    function(i,point){
                                        seriesOptions.data.push(parseInt($(point).text()));
                                    });
                                    options.series.push(seriesOptions);
                            });
                    myChart = new Highcharts.Chart(options);
                });

                // PDF starts
                Highcharts.getSVG = function(charts) {
                    var svgArr = [],
                    top = 0,
                    width = 0;

                $.each(charts, function(i, chart) {
                    var svg = chart.getSVG();
                    svg = svg.replace('<svg', '<g transform="translate(0,' + top + ')" ');
                    svg = svg.replace('</svg>', '</g>');

                    top += chart.chartHeight;
                    width = Math.max(width, chart.chartWidth);

                    svgArr.push(svg);
                });

                console.log(" LOG 1 : "+'<svg height="'+ top +'" width="' + width + '" version="1.1" xmlns="http://www.w3.org/2000/svg">' + svgArr.join('') + '</svg>');
                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)
                });
                console.log("LOG 2 : return back");
            };

            $('#export').click(function() {
                Highcharts.exportCharts([myChart], {type: 'application/pdf'});
            });

            }
    </script>

    </head>
    <body>

    <img src="pdf.bmp" id="export"/>
    <div id="container" class="myChart" style="width: 100%; height: 500px; margin: 0 auto"></div>

   </body>
   </html>

日志：

将Highcharts导出为PDF - IE9

0 个答案: