Send mail with chart

Question

I'm wanting to send email with charts in the email body in php, but I'm not getting.

I have tested some ways, for example image charts google (deprecated), google charts, jqgraph but without success.

Answer 1

One solution would be to create a static image generated on the server and to send that image in your email. The javascript charting library ZingChart provides a special build to work with the headless server-side browser PhantomJS, allowing you to create png images of the charts. http://www.zingchart.com/docs/features/phantomjs/

I'm a part of the ZingChart development team, so let me know if you have any questions.

Answer 2

The easiest way is probably to use a static image chart generator. There are a number of different services available online. For this purpose I created QuickChart, an open-source rendering service for Chart.js charts.

Since you tagged your post pie-chart, let's make a Chart.js pie chart config (see Chart.js pie chart reference):

{
  "type": "pie",
  "data": {
    "datasets": [
      {
        "data": [84, 28] 
      } 
    ],
    "labels": ["Data1", "Data2"] 
  } 
}

You can put this config into a PHP variable:

$chartConfig = '{
  "type": "pie",
  "data": {
    "datasets": [
      {
        "data": [84, 28] 
      } 
    ],
    "labels": ["Data1", "Data2"] 
  } 
}';

URL encode it for the https://quickchart.io/chart endpoint:

$chartUrl = 'https://quickchart.io/chart?c=' . urlencode($chartConfig);

Then, embed this URL directly in an email using a standard HTML <img> tag:

$email_body = "Please see my chart: <img src=\"$chartUrl\" />";

It displays the image below!

Alternative approaches include:

• wkhtmltoimage, a command-line utility for rendering pages
• Headless renderers like Puppeteer (PhantomJS is ok too, but it's no longer supported)
• Self-host your own QuickChart instance