TypeError:无法在ChildScope中读取未定义的属性“capture”。$ scope.exportReport

时间:2017-06-12 13:43:39

标签: javascript angularjs pdf amcharts pdfmake

我正在使用pdfMake将一些html内容和amCharts图表导出为pdf。 我使用了这个amCharts demo,这对我来说很完美,它提供了我需要的代码。 好吧,我完全复制了代码,我只在函数中添加了$ scope 现在我已经

$scope.exportReport = function() {
  //the same code existing in the codepen.io   
}

我收到了这个错误:

TypeError: Cannot read property 'capture' of undefined
at ChildScope.$scope.exportReport (reporting.controller.js:416)
at fn (eval at compile (angular.js:15126), <anonymous>:4:227)
at expensiveCheckFn (angular.js:16213)
at callback (angular.js:26592)
at ChildScope.$eval (angular.js:17994)
at ChildScope.$apply (angular.js:18094)
at HTMLInputElement.<anonymous> (angular.js:26597)
at HTMLInputElement.dispatch (jquery.min.js:3)
at HTMLInputElement.q.handle (jquery.min.js:3)

所以代码不起作用,因为图表[“export”]未定义,我不知道为什么!

 chart["export"].capture({}, function() {
                    this.toJPG({}, function(data) {

                        // Save chart data into chart object itself
                        this.setup.chart.exportedImage = data;

                        // Reduce the remaining counter
                        charts_remaining--;

                        // Check if we got all of the charts
                        if (charts_remaining == 0) {
                            // Yup, we got all of them
                            // Let's proceed to putting PDF together
                            generatePDF();
                        }

                    });
                });

我安装了所有必要的库和文件! 我的代码:

$scope.exportReport = function() {

        // So that we know export was started
        console.log("Starting export...");

        // Define IDs of the charts we want to include in the report
        var ids = ["chartdiv1", "chartdiv2"];

        // Collect actual chart objects out of the AmCharts.charts array
        var charts = {},
            charts_remaining = ids.length;
        for (var i = 0; i < ids.length; i++) {
            for (var x = 0; x < AmCharts.charts.length; x++) {
                if (AmCharts.charts[x].div.id == ids[i])
                    charts[ids[i]] = AmCharts.charts[x];
            }
        }

        // Trigger export of each chart
        for (var x in charts) {
            if (charts.hasOwnProperty(x)) {
                var chart = charts[x];
                chart["export"].capture({}, function() {
                    this.toJPG({}, function(data) {

                        // Save chart data into chart object itself
                        this.setup.chart.exportedImage = data;

                        // Reduce the remaining counter
                        charts_remaining--;

                        // Check if we got all of the charts
                        if (charts_remaining == 0) {
                            // Yup, we got all of them
                            // Let's proceed to putting PDF together
                            generatePDF();
                        }

                    });
                });
            }
        }

        function generatePDF() {

            // Log
            console.log("Generating PDF...");

            // Initiliaze a PDF layout
            var layout = {
                "content": [],
                "styles": {
                    "header": {
                        "fontSize": 18,
                        "bold": true,
                        "background": 'pink'
                    }
                }
            };

            layout.content.push({
                "columns": [{
                    "width": "33.33%",
                    "image": document.getElementById("logo").innerHTML,
                    "fit": [250, 300]
                }, {
                    "width": "*",
                    "image": charts["chartdiv1"].exportedImage,
                    "fit": [250, 300]
                }],
                "columnGap": 10
            });


            // Trigger the generation and download of the PDF
            // We will use the first chart as a base to execute Export on
            chart["export"].toPDF(layout, function (data) {
                this.download(data, "application/pdf", "reporting.pdf");
            });
        }}

1 个答案:

答案 0 :(得分:0)

我必须添加

        "export": {
            "enabled": true
        }

到我的所有图表!