I have a div in which the user creates a simple diagram by dragging and dropping other divs into it, i’ve accomplished this by using javascript.
I am looking for a way to save this div to an image and save it as a file on my server (IIS/ASP.NET).
I’ve seen countless of methods but i am confused on which method will work.
It has to work in the following browsers : IE7+, Chrome,Safari, Firefox.
That’s why i’m thinking of doing it server side, but i have no idea how i can accomplish something like that. I’ve found different ways to make a screenshot from an URL in ASP.NET. But it’s not just an URL , its the current page on which the user is. And it depends on logindata etc.
tldr:
Would it be possible to create an image from a div in Javascript? if so, will this method work in IE7+? if not, Is something like that possible serverside (asp.net) ?
What you’re creating isn’t an “image” – it’s just a collection of HTML elements (presumably styled with CSS) that exist in a visually-recognisable pattern.
To generate a binary image from this you’ll need to serialize this collection of elements (i.e. a view-graph), pass that to the server, then the server interprets the serialized view-graph as a series of drawing commands into a new bitmap, then returns the bitmap to the user.
The actual implementation of this is an exercise left up to the reader. I cannot be more precise because you’ve provided almost zero technical details (such as how your Javascript-based drawing tool actully works).