Diagramm aus chart.js pdf

Ich habe gesehen, dass viele Beiträge die beschreiben, wie Sie verwenden können chart.js erstellen Sie ein Diagramm mit canvas und speichern Sie dann die canvas png und importieren Sie es in ein pdf. Das ist in Ordnung, aber was, wenn Sie die bypass-on-screen-Teil, und gehen Sie direkt zu einem pdf-Dokument und schließen Sie das Bild?

Zum Beispiel, ich kann zwei Tasten, eine, öffnet sich das Diagramm auf dem Bildschirm mit canvas. Diese Seite könnte dann behandeln Sie das Diagramm speichern und importieren in die pdf-Datei ohne ein problem. Der andere button öffnet das pdf direkt. Ist es möglich das Diagramm in diesem Dokument entweder speichern Sie es auf dem server irgendwie oder nicht?

Ich vermute, ich könnte gesagt werden, um den übergang zu d3, aber ich wurde gerade gefragt, ob es möglich ist, in chart.js?

Diagramm aus chart.js pdf

InformationsquelleAutor RGriffiths | 2016-05-12
  1. 3

    Dies ist doch was feines wenn Sie die bypass-on-screen-Teil, und gehen Sie direkt zu einem pdf-Dokument und schließen Sie das Bild

    Können Sie immer noch verwenden chart.js exportieren als PDF mit PhantomJs (ein headless browser, öffnen Sie eine html-Seite mit deinen charts, und speichern Sie es per PDF). Wenn Sie arbeiten mit nodejs gibt es eine gute Bibliothek, die abstracts PhantomJs und die PDF-Datei einfach: https://github.com/sindresorhus/pageres. Es scheint wie ein workaround, aber in der Regel sind diese canvas-Bereich, um PDF-Datei nicht wiedergegeben wird gut, speziell charts!

    Yeah, Sie noch brauchen zu erstellen eine html-Seite und drucken Sie Ihre PDF, allerdings haben Sie 2 Möglichkeiten:

    • Ah ... genial. Wäre dies als die richtige Herangehensweise, oder ist das ein workaround?
    • PhantomJS ist der beste Weg, um das Rendern einer HTML-Seite als PDF, speziell charts. Diese Leinwand zu PDF-Zeug nicht Rendern genau so, wie wir sehen, auf browser -.
    • OK, aber ich bin nicht wollen, die machen die ganze html-Seite, noch drehen Sie einfach das Bild in einem pdf-Dokument gibt es jede Menge andere Sachen in der pdf von anderen Orten. Verstehe ich Sie richtig, dass ich verwenden kann, phantom js zum öffnen der html-Seite erzeugt, dass der Leinwand, dann speichert es auf dem server, und dann öffnet sich das pdf-Dokument, das importiert die gespeicherten Bild?
    • Ja genau. Wie könnten Sie es auch auf server in einer anderen Art und Weise? Auch das sieht seltsam aus, das ist der einzige Weg, um das Rendern der charts als PDF genau so, wie Sie Aussehen auf dem browser. Ein anderer Ansatz ist die Nutzung von einigen Bibliothek, die dies tun, in Ihrem server - /backend -, aber es wird nicht so Aussehen, als d3 oder chart.js wie diese Diagramme sind für das front-end.
    • Toll - danke für die Hilfe. Ich werde auf Sie zu bekommen!
    InformationsquelleAutor Wagner Leonardi
  2. 0

    Während diese Antwort auf die Frage nicht direkt, da ich nicht bekommen konnte chart.js zu tun, was ich wollte wird der client-Seite, fand ich eine gute Lösung mit pChart. Wie das pdf generiert wird, das Diagramm ist erstellt und wird vorübergehend auf dem server gespeichert, bis das pdf fertig ist. Das Diagramm eingefügt wird in die pdf-Datei und löscht dann die Tabelle aus dem server. Es ist ein bisschen manipulation, um richtig Größe der Bild.

    $myPicture->render("path/imagename.png");

if (file_exists("path/imagename.png")) {
    $ycurrent = $pdf->GetY();
    list($width, $height) = getimagesize("path/imagename.png");
    $imageWidth = 160;
    $ratio = $imageWidth/$width;
    $xpos = 25;
    $pdf->Image("path/imagename.png", $xpos, $ycurrent, $width * $ratio, $height * $ratio, "png", '');
    unlink ("path/imagename.png");
}
    InformationsquelleAutor RGriffiths
Schreibe einen Kommentar