How can I construct images using HTML markup?

Question

I need to display reports and things in HTML using Microsoft's HTMLDocument object.

Unfortunately, you can give the document HTML markup, but you cannot give it images. It is only able to display images you get from a URL, e.g.:

• http://
• file://
• res://

As a workaround I figured I could construct an image using HTML markup, pixel-by-colored pixel.

Has there been any work in this area? Should it be absolutely positioned 1x1 colored spans? A 350x200 table, with rows and columns both one-pixel in size?

Answer 1

People have, much to the horror of all, done some solid work in this area. The solution I link to uses tables with RLE compression, which seems smart enough to me.

Answer 2

The simplest way, in my opinion, is to use a base64 encoded image. It's efficient enough, and there are tools to automate generation: http://www.greywyvern.com/code/php/binary2base64.

Answer 3

I wrote a PHP class a few years ago to do this, but I wouldnt recommend using this in the real world as it takes a long time for a browser to render a table big enough for an image.

Unless I'm not understanding your question correctly, why can't you refer to the image using a full URL:

http://somewhere.com/myimage.jpg

Answer 4

First, a word of caution: this is an awful, terrible thing you are planning to do.

Now that we've got that out of the way, I happen to have done a good deal of this terrible thing. I can tell you that you're best bet is to use tables, not divs or spans. Even so, it's terribly inefficient and takes forever to load, as you can see from the samples I linked to. Just don't do it, other than as a perverse joke.

Answer 5

Can you just use the Data URI scheme?

IE8 supports this (as do most newer browsers); your images would look like this:

<img src="data:image/png;base64,A0123...==">

where the A0123... stuff is a base64 representation of an image file. Depending on the language you're using, you may be able to take advantage of Convert.ToBase64String() to do much of the work for you.

Answer 6

"reports and things"... could be a bit clearer here...

If what you ultimately want to do is display a report which happens to be dynamically generated, chances are you can automatically generate an image of the report. 'Export to PDF' is probably available in the report tool. Crude, but simpler and more efficient than where you seem to be headed now.