javascript – Displaying Graphs in an HTML Email

Question:

There is a newsletter to users once a week with information. Only this information will look more clearly in the form of a graph. Question: how to display charts in HTML email?

Iframe, JavaScript falls out of inimitability in email clients.

There is an idea to render a picture, a working example from the site https://woody.aviasales.ru/graph.png?last_prices=14328,18610&average_price=14950

They render the image by GET parameters.

How to do it?

Are there easier alternatives?

Answer:

Such graphs are usually drawn in php using the GD library http://php.net/manual/en/book.image.php . We are accessing the script at the specified address, however, at the output it gives not an html document, but an image generated on the fly based on get parameters.

The default script looks like this:

header("Content-type: image/png"); //сообщаем браузеру, что посылается картинка
$string = $_GET['text'];
$im     = imagecreatefrompng("images/button1.png");//создаем картинку
$orange = imagecolorallocate($im, 220, 210, 60); //что-то рисуем
$px     = (imagesx($im) - 7.5 * strlen($string)) / 2;
imagestring($im, 3, $px, 9, $string, $orange);
imagepng($im);//выводим изображение в буфер вывода
imagedestroy($im);//особождаем память

There are the simplest methods – drawing lines, arcs, ellipses, fills, etc. Generally paint.

However, there are libraries, add-ons to GD, such as pchart or jpgraph , which make it easier to work with graphs, you may need to try them for your task.

Scroll to Top