Geek Answers Handbook

Bar Graph in Email Block

Is it possible to draw a dynamic histogram in the body of the letter. (must be compatible with Outlook)

I need to draw a graph in an email sent through an oracle database and the dynamic value will be passed through the procedure.

+4
source share
4 answers

The best solution is to create a dynamic chart and then turn it into an image. You can simply use the print screen for this and import it into Photoshop or whatever and edit the image there.

HTML letters are, as you know, bad things, because they respond best to html code from 10 years ago.

Some basic recommendations:

  • Do not try to use HTML5 in your email.
  • Do not try to use fancy CSS or a link to an external stylesheet, or even use CSS styles in HEAD.
  • Do not try to use javascript as it won; t work

  • Do not try to use Flash, as it will not work.

  • Use inline CSS

  • Use HTML TABLES for layout
  • Use images, but try to keep the file size as small as possible.
+14
source

You can use something like Google charts to create a dynamic image (going through the desired datasets) that you paste into your html email address.

http://imagecharteditor.appspot.com/

http://www.jonwinstanley.com/charts/

+3
source

You cannot do anything with JavaScript, because email clients do not parse it.

But you can tell your server to set the header in the file to make it JPEG or GIF. The file extension should also be jpg or gif, because some email clients fade away when rendering an image that does not have an extension, or has an extension without an image. Not sure if you are using a server room, but most of them have some kind of dynamic library for creating images.

Alternatively, visualize the graph using tables.

<table> <tr> <td colspan="10" bgcolor="pink"></td> </tr> <tr> <td colspan="5" bgcolor="pink"></td> <td colspan="5" bgcolor="white"></td> </tr> </table>

You get the idea. Unfortunately, you need to write something to create the appropriate HTML.

+1
source

This should be done in the "old" html way. Value with tables and regular images.

Suppose you want to create a histogram with 5 elements. You create a table with all the cells that you need, and then you would have, say, 5 different images that you would scale dynamically vertically when sending personalized email. Each image is a solid block, say 10x10px in 5 different colors. You must resize the image to the block size for each sent message. Then you put the replacement template for your email application (i.e. %% variable %%) and use the correct values ​​for each email you send.

eg:

 <table border=0> <tr> <td align=bottom><img src=redblock.gif width=20 height=%%height1%%></td> <td align=bottom><img src=greenblock.gif width=20 height=%%height2%%></td> <td align=bottom><img src=yellowblock.gif width=20 height=%%height3%%></td> <td align=bottom><img src=blueblock.gif width=20 height=%%height4%%></td> <td align=bottom><img src=greyblock.gif width=20 height=%%height5%%></td> </tr> <tr> <td colspan=5 bgcolor=#000000 height=1><img src=singlepixel.gif width=1 height=1></td> </tr> <tr> <td>Spain</td> <td>France</td> <td>US</td> <td>UK</td> <td>Italy</td> </tr> </table>
+1
source

More articles:


All Articles