Abo
  • IT-Karriere:

html2canvas

Browser macht aus Webseiten Bilder

Niklas von Hertzen hat mit html2canvas ein Script geschrieben, mit dem ein Browser Abbilder einer Website erstellen kann. Dazu wird die HTML-Seite in ein Canvas-Element gerendert.

Artikel veröffentlicht am ,
html2canvas: Browser macht aus Webseiten Bilder
(Bild: html2canvas)

Html2canvas erstellt im Browser eine Art "Screenshot" von einer Website. Allerdings handelt es sich dabei nicht um einen tatsächlichen Screenshot, da nicht die Ausgabe des Browsers erfasst wird. Vielmehr rendert das Script die Website in ein Canvas-Element, so dass es bei der Darstellung zu Abweichungen kommen kann.

Stellenmarkt
  1. Techniker Krankenkasse, Hamburg
  2. akf bank GmbH & Co KG, Wuppertal

Dazu liest das Script das DOM und die darauf angewendeten CSS-Regeln aus und malt die Elemente in das HTML5-Tag Canvas. Das funktioniert, ohne dass Teile durch den Server berechnet werden müssen. Dabei werden allerdings nicht alle Elemente unterstützt, was beispielsweise für Frame- und Object-Elemente und einige CSS-Eigenschaften gilt. Es wird keine CSS3-Eigenschaft unterstützt. Auch Javascript wird nicht interpretiert und vom Browser erzeugte Elemente wie Radio-Buttons und Checkboxen kann html2canvas ebenfalls nicht darstellen.

Derzeit benötigt html2canvas jQuery, das will von Hertzen aber demnächst ändern. Der Code von html2canvas ist bei Github zu finden. Unter html2canvas.hertzen.com/screenshots.html stellt der Entwickler einen Javascript-Screenhot-Creator zum Testen bereit.



Anzeige
Hardware-Angebote
  1. ab 369€ + Versand
  2. 127,99€ (Bestpreis!)
  3. 114,99€ (Release am 5. Dezember)

format 29. Jul 2011

Damit meinte ich natürlich Neotiger, die Antwort von developer klingt einleuchtend, danke!

Himmerlarschund... 28. Jul 2011

Yay, wir browsen jetzt direkt in der Cloud! :-)


Folgen Sie uns
       


Akku-Recycling bei Duesenfeld

Das Unternehmen Duesenfeld aus Peine hat ein Verfahren für das Recycling von Elektroauto-Akkus entwickelt.

Akku-Recycling bei Duesenfeld Video aufrufen
Raumfahrt: Galileo-Satellitennavigation ist vollständig ausgefallen
Raumfahrt
Galileo-Satellitennavigation ist vollständig ausgefallen

Seit Donnerstag senden die Satelliten des Galileo-Systems keine Daten mehr an die Navigationssysteme. SAR-Notfallbenachrichtigungen sollen aber noch funktionieren. Offenbar ist ein Systemfehler in einer Bodenstation die Ursache. Nach fünf Tagen wurde die Störung behoben.


    Radeon RX 5700 (XT) im Test: AMDs günstige Navi-Karten sind auch super
    Radeon RX 5700 (XT) im Test
    AMDs günstige Navi-Karten sind auch super

    Die Radeon RX 5700 (XT) liefern nach einer Preissenkung vor dem Launch eine gute Leistung ab: Wer auf Hardware-Raytracing verzichten kann, erhält zwei empfehlenswerte Navi-Grafikkarten. Bei der Energie-Effizienz hapert es aber trotz moderner 7-nm-Technik immer noch etwas.
    Ein Test von Marc Sauter

    1. Navi 14 Radeon RX 5600 (XT) könnte 1.536 Shader haben
    2. Radeon RX 5700 (XT) AMD senkt Navi-Preise noch vor Launch
    3. AMD Freier Navi-Treiber in Mesa eingepflegt

    Erasure Coding: Das Ende von Raid kommt durch Mathematik
    Erasure Coding
    Das Ende von Raid kommt durch Mathematik

    In vielen Anwendungsszenarien sind Raid-Systeme mittlerweile nicht mehr die optimale Lösung. Zu langsam und starr sind sie. Abhilfe schaffen können mathematische Verfahren wie Erasure Coding. Noch existieren für beide Techniken Anwendungsgebiete. Am Ende wird Raid aber wohl verschwinden.
    Eine Analyse von Oliver Nickel

    1. Agentur für Cybersicherheit Cyberwaffen-Entwicklung zieht in den Osten Deutschlands
    2. Yahoo Richterin lässt Vergleich zu Datenleck platzen

      •  /