1

I'm trying to find a way to convert a part of a webpage in an image: I have a dynamically created page, and I would like to "save" a part of it, in an image format.

I know that turning html to image is quite complicated, and could be done by server-side computation with tools like phantom js or other webkit render engine. But I'm trying to find a way to achieve this in client side.

I imagine something like putting the dom elements in a svg (with foreignObject), then rendering the svg in a canvas, and then turning the canvas to base64 string url. But I tried, and I didn't manage to do it.

What do you think about this idea? does it sound possible? I think I first have a way to compute the dom elements css styles in an html string, but that seems very complicated. I guess I need some advice here.

7
  • 2
    Have you seen html2canvas yet? Commented Sep 17, 2013 at 16:45
  • In phase 2 "then rendering the svg in a canvas" exactly what HTML rendering engine would be involved? Commented Sep 17, 2013 at 16:47
  • github.com/ariya/phantomjs/wiki Commented Sep 17, 2013 at 16:51
  • @ComFreek: No I've never seen that, it seems very interesting, thanks a lot! Commented Sep 17, 2013 at 17:04
  • @Daniel: I thought PhantomJS was only server-side. I'll read more the wiki to see if I can use it on client-side Commented Sep 17, 2013 at 17:06

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.