locked
Render HTML in tumbnail

    Question

  • I need to render a screenshot of a section of the DOM. 

    I looked into the popular HTML2Canvas library, but it's heavy reliance on Jquery made it not work, even with the Jquery modified for Windows 8. I also want to avoid Jquery in general because of the security issues. 

    I thought about rendering it by copying the DOM elements and drawing them much smaller, but this also does not seem like a ideal solution. 

    I originally was hoping I could pass the context or imageData to a web worker, but it does not work in IE10, so I assume that eliminates it from W8 Apps. 

    Does the WinJS library or anything else we have solve this for me? Thanks. 


    Zane C. Milakovic

    Tuesday, January 15, 2013 12:00 PM

All replies

  • Have you tried Feedback.js? http://experiments.hertzen.com/jsfeedback/


    Michael Palermo Microsoft Evangelist

    Tuesday, January 15, 2013 7:23 PM
  • If you look at the feedback.js page, it used HTML2Canvas, which uses Jquery and runs into the same problem as above. 

    Thanks for suggesting it, but it won't work. 

    I feel like a solution does need to exist for this, because I can see use cases for it. 


    Zane C. Milakovic

    Tuesday, January 15, 2013 7:26 PM
  • But have you tried it?

    Michael Palermo Microsoft Evangelist

    Tuesday, January 15, 2013 7:34 PM
  • Also check into this:

    http://msdn.microsoft.com/en-us/library/ie/ff975241(v=vs.85).aspx


    Michael Palermo Microsoft Evangelist

    Tuesday, January 15, 2013 7:37 PM
  • I have tried html2canvas which uses Jquery, and I tried that with Jquery and the fork of Jquery made for Windows 8 App.

    Feedback.js uses html2canvas as a dependency, so it won't work, because html2canvas won't work.

    While it does not appear feedback.js uses jquery, its code directly called html2canvas and requires it.


    Zane C. Milakovic


    • Edited by Khrome83 Tuesday, January 15, 2013 7:57 PM
    Tuesday, January 15, 2013 7:42 PM
  • I am aware of the toDataURL, this is used once the information has been stored into the context of a canvas. 

    The issue is getting HTML from a page into a Canvas. Thank you though.


    Zane C. Milakovic

    Tuesday, January 15, 2013 7:45 PM