Email a chartjs graph in laravel

I also ran into this problem where I wanted to Chart.js charts as an image. I built a web service that takes a Chart.js config and returns a PNG image.

The service is called QuickChart and it’s open source.

Take a Chart.js config like this:

{
  type: 'bar',
  data: {
    labels: ['January', 'February', 'March', 'April', 'May'],
    datasets: [{
      label: 'Dogs',
      data: [ 50, 60, 70, 180, 190 ]
    }, {
      label: 'Cats',
      data: [ 100, 200, 300, 400, 500 ]
    }]
  }
}

And put it into a URL:

https://quickchart.io/chart?c={type:’bar’,data:{labels:[‘January’,’February’,’March’,’April’,’May’],datasets:[{label:’Dogs’,data:[50,60,70,180,190]},{label:’Cats’,data:[100,200,300,400,500]}]}}

The /chart endpoint returns this PNG:

Don’t forget to URL encode the chart config. To use this in PHP, use the urlencode function to encode the chart definition:

$chart = "{
  type: 'bar',
  data: {
    labels: ['January', 'February', 'March', 'April', 'May'],
    datasets: [{
      label: 'Dogs',
      data: [ 50, 60, 70, 180, 190 ]
    }, {
      label: 'Cats',
      data: [ 100, 200, 300, 400, 500 ]
    }]
  }
}";

$encoded = urlencode($chart);
$imageUrl = "https://quickchart.io/chart?c=" . $encoded;

// Embed $imageUrl in your email