Export Highcharts, um eine PDF-Datei (mit javascript und den lokalen server ohne internet-Verbindung)
Ich bin mit Highcharts in meiner Anwendung (ohne internet Verbindung)
Ich habe mehrere Diagramme auf einer html-Seite, und ich möchte das generieren eines PDF-Berichts mit allen charts von dieser Seite.
Wie kann ich dies tun ohne das senden der Daten an beliebige server im internet ?
Ich dankbar für jede Hilfe oder jedes Beispiel, das Sie geben kann.
Danke im Voraus 🙂
InformationsquelleAutor Leon | 2014-09-02
Du musst angemeldet sein, um einen Kommentar abzugeben.
Ja, das ist möglich, aber beinhaltet ein paar verschiedene Bibliotheken zu bekommen arbeiten. Die erste Bibliothek ist jsPDF, die ermöglicht die Erstellung von PDF im browser. Die zweite ist canvg die es erlaubt, die für die Darstellung und das Parsen von SVG ist, das bit, das ist wirklich cool, obwohl es machen kann eine svg-auf-canvas-element. Schließlich ist Highcharts-export-Modul die es uns ermöglichen, senden Sie dem svg die canvg in eine data-URL, die dann gegeben werden, jsPDF, um Links in Ihrer pdf-Datei.
Hier ist ein Beispiel http://fiddle.jshell.net/leighking2/dct9tfvn/ Sie können auch sehen, es in source-Dateien, die Sie brauchen, um in Ihrem Projekt.
Damit zu beginnen highcharts bietet ein Beispiel für die Verwendung canvg mit exportieren speichern Sie ein Diagramm als png. weil Sie wollen, dass alle die iamges in den pdf-diese wurde leicht verändert, für unseren Zweck nur die Daten zurück, die url
Dann für das Beispiel, das ich eingerichtet haben, exportieren Sie auf eine Schaltfläche klicken. Dies sieht für alle Elemente einer bestimmten Klasse (so wählen Sie ein, um hinzufügen, um alle Diagramm-Elemente) und rufen Sie dann Ihre highcharts.createCanvas Funktion.
wichtig, hier zu beachten, dass, wenn Sie viele Diagramme, die Sie benötigen, zu behandeln, indem Sie auf eine neue Seite. Die Dokumentation für jsPDF sieht wirklich veraltet, Sie haben eine gute demos, die Seite aber gerade nicht viel zu erklären, alle Optionen möglich), es ist ein addPage () - Funktion und dann kann man nur spielen, mit breiten und Höhen, bis Sie etwas finden, die funktioniert.
der Letzte Teil ist, einfach das setup der Grafiken mit einer extra-option nicht angezeigt, die Taste "exportieren" auf jedes Diagramm, das normalerweise angezeigt.
Das Ergebnis ist nicht allzu schlecht, ich bin beeindruckt von der Qualität der Grafiken, da ich nicht viel erwartet von dieser, mit einigen spielen der pdf-Größen und-Positionen könnte wirklich gut Aussehen.
Hier ist ein Screenshot zeigt die Netzwerk-Anforderungen vor und nach dem export, wenn der export erfolgt keine Anfragen gemacht werden http://i.imgur.com/ppML6Gk.jpg
hier ist ein Beispiel, was die pdf sieht aus wie http://i.imgur.com/6fQxLZf.png (sieht besser aus, wenn die Ansicht als eigentliche pdf)
kurzes Beispiel versucht werden, auf lokalen https://github.com/leighquince/HighChartLocalExport
Nein, ich habe nur das export-Modul, um die SVG-Daten, die ich beobachtete die Registerkarte Netzwerk, und es werden keine Daten gesendet wurde
Die Umwandlung geschieht im browser, das ist auch der Grund, warum ich haben sich die export-Schaltfläche aus auf jedem Graphen
Hinzugefügt-Screenshot von Anfragen über das Netzwerk auf die Frage, zeigen keine Anfragen geschickt wurden, um hohe chart
Hallo Quitte, nochmals vielen Dank, aber ich brauche, es zu tun auf meinem lokalen server. Können Sie führen Sie das Beispiel auf Ihrem lokalen server ohne internet-Verbindung ?
InformationsquelleAutor Quince
Müssen Sie setup Ihre eigenen Export-server, lokal wie in der Artikel
InformationsquelleAutor Sebastian Bochan
Hier ist ein Beispiel für die Verwendung der Bibliothek pdfmake:
html:
javascript:
voll funktionierenden code:
https://jsfiddle.net/dimitrisscript/f6sbdsps/
Es ist text innerhalb der pdf-Datei. "Hallo Welt".
Dies ist eine großartige Lösung. Ich Frage mich jedoch, ob dies möglich ist, ohne die Verwendung von jQuery.
InformationsquelleAutor Dimitris Siakavelis
Vielleicht dieser link kann dir helfen.
http://bit.ly/1IYJIyF
Versuchen beziehen sich auf das exportieren von Eigenschaften (fallbackToExportServer: false) und die notwendige Datei werden müssen, umfassen (offline-exporting.js).
In der Erwägung, dass für den export alle auf einmal Teil, momentan habe ich mich auch noch versuchen. Update hier, wenn überhaupt.
InformationsquelleAutor William Kheng
Diese Frage ist ein bisschen alt, aber war etwas, an dem ich arbeitete mich vor kurzem und hatte einige Probleme mit ihm.
Benutzte ich die jsPDF Bibliothek: https://github.com/MrRio/jsPDF
Fragen, die ich lief in beteiligt jsPDF nicht die Unterstützung der SVG-Format exportiert, von der hohen Grafik + Bilder werden unscharf und schlechte Qualität.
Unten ist die Lösung, die ich verwendet, um zwei Diagramme in einem pdf-Dokument:
scripts um:
InformationsquelleAutor Ryan Gavin