All Collections
PDF Code Examples
Code Example: <canvas> Element
Code Example: <canvas> Element
James Paden avatar
Written by James Paden
Updated over a week ago

<canvas>  elements created by JavaScript are not passed to our PDF rendering engine. This is because the graphical data in a <canvas>  is not stored in the HTML,. A workaround is to extract the canvas data into raw image data before the PDF rendering.

Here is some example code that will likely require some minor modification to work for your document:

  <script>
  docraptorJavaScriptFinished = function() {
    var chartCanvas = document.getElementById("canvas");

    // do not do anything unless the chart is finished rendering
    if(chartCanvas == null || chartCanvas.style.length < 1)
    {
      return false;
    }

    // dump the canvas to an img tag
    var imageElement = document.createElement("img");
    imageElement.style = "width: 100%;";
    imageElement.src = chartCanvas.toDataURL("image/png");
    chartCanvas.remove();
 
    document.body.appendChild(imageElement);
    return true;
  }
  </script>
Did this answer your question?