Solution 1 :

I am also facing similar issue with chartjs radar chart in pdfkit = 1.0.0 to generate PDFs,
as of my understanding pdfkit is using wkhtmltopdf engine in background. wkhtmltopdf uses css2 which has lot of incompatibility issue with chartjs or newly developed chart libs.

Solution 2 :

Experienced the same issue with another pdf tool (hiqpdf) it seems the engine these tools use support JavaScript/jquery versions the same as Internet explorer 11 does. When you check your page in IE11 you probably see syntax errors related to chart.js because chart.js doesn’t support ie11 anymore they seemed to have used syntax that can’t be used in pdf render tools.. I struggled with this the whole week and finally chose to use the 2.9 version of chart.js using the v3 migration guid backwards… with 2.9 everything seems to work fine in combination with pdf generation tools, so probably the fastest solution for you?

Problem :

I am trying to generate PDF using wkhtmltopdf , where there has chart js. Chart js version 3.4.x

I have written below html to generate chart

Hello

Js code :

<script type="text/javascript">

const labels = [
  'January',
  'February',
  'March',
  'April',
  'May',
  'June',
];
const data = {
  labels: labels,
  datasets: [{
    label: 'My First dataset',
    backgroundColor: 'rgb(255, 99, 132)',
    borderColor: 'rgb(255, 99, 132)',
    data: [0, 10, 5, 2, 20, 30, 45],
  }]
};

const config = {
  type: 'bar',
  data,
  options: {
     animation: false,
        scales: {
            x: {
                grid: {
                tickColor: 'red'
                },
                ticks: {
                color: 'blue',
                }
            }
        }
  }
};

var myChart = new Chart(
    document.getElementById('myChart').getContext('2d'),
    config
);

</script>

Chart is working fine in html

enter image description here

After give the command

wkhtmltopdf –javascript-delay 1000
http://localhost/pdf_test/index.html testpdf101

I got the paragraph but not chart. Same procedure I have tested for version chart js 2.9.4 where it’s working fine. Why it’s not working in version 3 ? How can I generate pdf for chart js version 3.4.x ?

Comments

Comment posted by Chart js docs

Try to do it with any canvas and check if the canvas renders in the pdf. Maybe wktmltopdf doesnt support canvas. If so, try to convert the chartJS to image, maybe using Chart.toBase64Image() as specified in

Comment posted by Ask Question

This does not really answer the question. If you have a different question, you can ask it by clicking

Comment posted by AlexanderGriffin

This seems more like a stream of thought than a real answer – you should provide some examples here. Perhaps mention that ‘polyfills’ exist for bridging support for older browsers and provide a link. If you used 2.9 successfully, including some additional information about how to backport to this version would be more helpful.

By