Use Case: I run speed tests daily, and every week I'd like a report showing my speed results
Problem: Javascript just doesn't work for email. You can make a website look great with a number of JS libraries that won't work once you email it.
Solution. I found 2 services, Image-charts.com, and quickchart.io that could relieve this problem by using a dynamically generated chart image
Email is a finicky thing. With email you can insert all sorts of HTML, however, pending your client, Javascript just doesn't work for email. I learned this while attempting to add a graph to an email I generate using NodeRed. I have a Speed test that occurs on the hour. I like to know that I am getting what I pay for as far as bandwidth is concerned. That said, the furthest I got on it was being able to take the CSV file and generate a table and shoot it in an email. I decided then to play around with Google Chart API. It was easy to get set up and looked great in my browser, but when I would inject it into the body of my email, and send it, well, Gmail did not like my graph. So after doing some digging, I found some very unfortunate news, don't expect ANY javascript to properly work in an email client. At this point, I was just going to accept defeat and deal with tables, but then I decided to spend some time and research it. I can't be the only person who had this problem. Turns out, I'm not. I found a fix, Well, 2 solutions. These solutions are image-charts.com and quickchart.io. Both services offer APIs to generate images of the data you provide to them. I played around with both of them, and they both have their ups and downs, but would both work for my solution. Rather than having a JSON object embedded on your page to generate an image, you instead pass the data into the query of the URL. You are essentially embedding a dynamically driven image on your page. Both clients have a Get and Post method, with the post method returning a shorter image URL. In my case, I have just enough data to keep it in the get command. One thing you do have to watch out for if using a Git command is the number of characters you pass, as there are limits on how much data you can send to these APIs using get. I did reach the limit on image-charts.com's API and am going with quickchart.io to generate my chart for me.
Top comments (0)