Highchart总是下载PNG图像?

时间:2018-01-19 11:00:18

标签: javascript highcharts

我将两个图表组合在一起以导出两个图表。

<script defer="true"><![CDATA[
     (function(){
        var exportChart = function() {
            Highcharts.getSVG = function(charts) {
                var svgArr = [], top = 0, width = 0;

                jq.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);
                });

                return '<svg height="' + top + '" width="' + width
                        + '" version="1.1" xmlns="http://www.w3.org/2000/svg">'
                        + svgArr.join('') + '</svg>';
            };

            Highcharts.exportCharts = function() {
                var charts = [];
                jq(".test-timeline-chart .highcharts-container")
                        .each(
                                function(i, e) {
                                    charts
                                            .push(Highcharts.charts[jq(e).parent()
                                                    .data().highchartsChart]);
                                });
                var form;
                svg = Highcharts.getSVG(charts);

                // merge the options
                var options = Highcharts.merge(Highcharts.getOptions().exporting, {});

                // create the form
                form = Highcharts.createElement('form', {
                    method : 'post',
                    action : options.url
                }, {
                    display : 'none'
                }, document.body);

                // add the values
                Highcharts.each([ 'filename', 'type', 'width', 'svg' ], function(name) {
                    Highcharts.createElement('input', {
                        type : 'hidden',
                        name : name,
                        value : {
                            filename : options.filename || 'chart',
                            type : options.type,
                            width : options.width,
                            svg : svg
                        }[name]
                    }, null, form);
                });
                // submit
                form.submit();

                // clean up
                form.parentNode.removeChild(form);
            };

            // printing all the charts in single page.
            function printAll() {

                var origDisplay = [], origParent = [], body = document.body, childNodes = body.childNodes;

                // hide all body content
                Highcharts.each(childNodes, function(node, i) {
                    if (node.nodeType === 1) {
                        origDisplay[i] = node.style.display;
                        node.style.display = "none";
                    }
                });

                var charts = [];
                jq(".test-timeline-chart .highcharts-container")
                        .each(
                                function(i, e) {
                                    charts
                                            .push(Highcharts.charts[jq(e).parent()
                                                    .data().highchartsChart]);
                                });
                // put the charts back in
                jq.each(charts, function(i, chart) {
                    origParent[i] = chart.container.parentNode;
                    body.appendChild(chart.container);
                });

                // print
                window.print();

                // allow the browser to prepare before reverting
                setTimeout(function() {
                    // put the chart back in
                    jq.each(charts, function(i, chart) {
                        origParent[i].appendChild(chart.container);
                    });

                    // restore all body content
                    Highcharts.each(childNodes, function(node, i) {
                        if (node.nodeType === 1) {
                            node.style.display = origDisplay[i];
                        }
                    });
                }, 500);
            }

             if(jq(".test-timeline-chart").length > 0) {
                var index = jq(".test-timeline-chart .highcharts-container:first").parent().data().highchartsChart; 
                var instanceChart = Highcharts.charts[index+1];
                instanceChart.exportChart = Highcharts.exportCharts;
                instanceChart.options.exporting.buttons.contextButton.menuItems[0].onclick = function() {
                    printAll();
                };
             };
        };
        exportChart();  
      })();

     ]]>
     </script>

var options = Highcharts.merge(Highcharts.getOptions().exporting, {});始终保留PNG图像,导出图表选项始终下载PNG图像。我怎么解决这个问题?

我找到了一种方法来收听高图表上下文菜单项的onclick事件。有没有办法获得选定的项目?

0 个答案:

没有答案