2017-01-12 2 views
0
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
<script src="http://cdn.zingchart.com/zingchart.min.js"></script> 
<script src="http://cdn.zingchart.com/angular/zingchart-angularjs.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script> 
<style> 
#chart-1-top > div { 
    display: none; 
} 


</style> 
<body ng-app="myApp"> 
    <div ng-controller="MainController" id="content"> 
    <input type="hidden" id="value" value="3"> 
    <div zingchart id="chart-11" zc-json="myJson" zc-width="100%" zc-height="568px"></div> 
    </div> 
    <button id="submit">Export to PDF</button> 
</body> 


<script> 


var app = angular.module('myApp',['zingchart-angularjs']); 

app.controller('MainController', function($scope){ 
var a=5; 
var b=4; 
var c=angular.element($('#value')).val(); 
var d=16; 
var e=2; 
    $scope.myJson = { 
     type : 'line', 
     series : [ 
     { values : [a,b,c,d,e] }, 

     ] 
    }; 
}); 


</script> 
<script> 

var doc = new jsPDF(); 
var specialElementHandlers = { 
    '#editor': function (element, renderer) { 
     return true; 
    } 
}; 
$('#submit').click(function() { 
    doc.fromHTML($('#content').html(), 15, 15, { 
     'width': 190, 
      'elementHandlers': specialElementHandlers 
    }); 
    doc.save('sample-page.pdf'); 
}); 



</script> 

Привет, это код, в котором мы пытались создать диаграмму с использованием угловых js. , но когда мы нажимаем кнопку генерации pdf, диаграмма не отображается в pdf. pdf показан без диаграммы. я хочу, чтобы показать диаграмму на PDFСоздать pdf-код не показан Диаграмма

ответ

0

Я считаю, fromHTML асинхронный поэтому попробуйте вместо этого:

doc.fromHTML($('#content').html(), 15, 15, { 
    'width': 190, 
     'elementHandlers': specialElementHandlers 
}, function() { 
    doc.save('sample-page.pdf'); 
});