Convert and save image generated by javascript and css

[ttruong]

Hi,
I have a graph generated dynamically according to the data from a database using javascript and css and displayed inside a div of an html page. My question is is there anyway I can convert that graph to image in any of these jpg,png,gif... format. Thank you.

[Dormilich]

you can do that server side (with e.g. PHP). I'm not aware that JS can do that.

regards

[gits]

for mozilla/FF you could play with the <canvas> element and its special moz-additions ... for a start have a look here at the last section: 'Rendering Web Content Into A Canvas'

kind regards

[ttruong]

Hi gits, thank you for your reply. I tried to use the canvas with FF but it gave me an error 'getContext is not a function. Can I pass the output of the graph function directly to the draw() as the image source?
Could you give me some sample codes?
Thank you.

[gits]

hi ... there is a problem with the privileges ... so you need to request that for your code ... have a look at the following simple example that you could simply test in FF's Firebug-extension:

[code=javascript]
netscape.securi ty.PrivilegeMan ager.enablePriv ilege(
"UniversalXPCon nect");

var canvas = document.create Element('canvas ');

canvas.setAttri bute('width', 600);

canvas.setAttri bute('height', 600);

var ctx = canvas.getConte xt("2d");

ctx.drawWindow( window, 0, 0, 600, 600, "rgb(0,0,0) ");

document.lastCh ild.appendChild (canvas);
[/code]
this will just add a canvas-node with a 600x600px screenshot to a document that is loaded in FF actually when you run it with firebug. note that this code is not really usable for public webapps but for intranet-apps or a personal app you may create easy screenshots this way.

kind regards