2017-06-12 75 views
0

我正在使用pdfMake將一些html內容和amCharts圖導出爲pdf。 我用這個amCharts demo這對我來說很完美,它提供了我需要的代碼。 嗯,我複製完全相同的代碼,我只加$範圍功能 現在我已經

$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) 

這樣的代碼不會因爲圖[工作「出口」]是不確定的,我不知道爲什麼!

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

你能提供筆\小提琴\ plunkerof你的代碼? – anoop

+0

@anoop我編輯了這個問題:)! – Nourp

回答

0

好吧,我不得不

 "export": { 
      "enabled": true 
     } 

添加到我的所有圖表!

相關問題