The lower version of Chartjs is supported to Wkhtmltopdf
Please add “–javascript-delay [1000|2000|3000|…]” into your command for delay the pdf generating.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
//Demo <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-polyfill/7.0.0/polyfill.min.js"></script> <style> .reportGraph {width:900px;height: 900px;} </style> </head> <body> <div class="reportGraph"> <canvas id="canvas"></canvas> </div> <script type="text/javascript"> \'use strict\'; (function(setLineDash) { CanvasRenderingContext2D.prototype.setLineDash = function() { if(!arguments[0].length){ arguments[0] = [0,0]; } return setLineDash.apply(this, arguments); }; })(CanvasRenderingContext2D.prototype.setLineDash); function drawGraphs() { new Chart( document.getElementById("canvas"), { "responsive": false, "type":"pie", "data":{ "labels":["January","February","March","April","May","June","July"], "datasets":[ { "label":"My First Dataset", "data":[65,59,80,81,56,55,40], backgroundColor: [ window.chartColors.red, window.chartColors.orange, window.chartColors.yellow, window.chartColors.green, window.chartColors.blue, window.chartColors.grey, window.chartColors.purple, ], "borderColor":"rgb(75, 192, 192)" } ] }, options: { animation: { duration: 0, // general animation time }, hover: { animationDuration: 0, // duration of animations when hovering an item }, responsiveAnimationDuration: 0, // animation duration after a resize } } ); } window.chartColors = { red: \'rgb(255, 99, 132)\', orange: \'rgb(255, 159, 64)\', yellow: \'rgb(255, 205, 86)\', green: \'rgb(75, 192, 192)\', blue: \'rgb(54, 162, 235)\', purple: \'rgb(153, 102, 255)\', grey: \'rgb(201, 203, 207)\' }; window.onload = function() { drawGraphs(); }; </script> </body> </html> |