Create a table and convert it to PDF

Negar_mg

I am new in Qt.
I have to prepare a report, the report has to have a table and a chart below and then convert it to a PDF.

1.How can I create a table like this?
2.How do I convert my table to PDF?
Any tips can be helpful, thank you.
I am using Windows10, QT5, C++.

beecksche

Hi,
Have a look at this example: https://wiki.qt.io/Exporting_a_document_to_PDF

You can set your table as html template and insert the values before creating the pdf.

Negar_mg

Thanks, I'll try it

Negar_mg

Is there a way to write such a table with qpainter and QPdfWriter and change it to pdf ?

SGaist

Hi,

Yes you can but it's more complex, you can create a QImage of the adequate size and then paint your table and text on it.

You might want to consider using QTextDocument which provides a simple way to build tables.

Negar_mg

@SGaist
Thanks alot, what should I do to convert QTextDocument Class to pdf?

mrjj

@Negar_mg
Hi
Like anything else. you print the doc

QTextDocument doc;
...fill the doc...
QPrinter printer(QPrinter::HighResolution);
printer.setOutputFormat(QPrinter::PdfFormat);
printer.setOutputFileName(filename); // where pdf will be stored
doc.print(&printer);

Negar_mg

@mrjj
thanks alot, you are the best:)

Negar_mg

hi,
I wanted to know is it possible to create a chart with html code, as I created the table?
I wrote the following code but it does not create any chart.
Would you please guide me in this regard as well?
//..........................................................................................................................
// Your HTML code

QString html;
html = "<html>"
        "<body>"
        "<canvas id='myChart' style='width:100%;max-width:600px'></canvas>"
        "<script>"
        "var xValues = [50,60,70,80,90,100,110,120,130,140,150];"
        "var yValues = [7,8,8,9,9,9,10,11,14,14,15];"
 "new Chart('myChart', {type: 'line',data: {labels: xValues,datasets: [{fill: false,lineTension: 0,backgroundColor: 'rgba(0,0,255,1.0)',borderColor: 'rgba(0,0,255,0.1)',data: yValues }]},"
         " options: {legend: {display: false},scales: { yAxes: [{ticks: {min: 6, max:16}}],}}});"
        "</script>"
        "</body>"
        "</html>";

QTextDocument doc ;
QTextCursor cursor(&doc);
cursor.insertHtml(html);
QTextDocumentWriter writer("htmlchart.odt", "ODF");
writer.write(&doc);
QPrinter printer(QPrinter::HighResolution);
printer.setOutputFormat(QPrinter::PdfFormat);
printer.setOutputFileName("htmlchart.pdf");
doc.print(&printer);

//..............................................................................................................................................
I also used the "append" command but no graph was drawn.

html.append("<html>");
html.append("<body>");
html.append("<canvas id='myChart' style='width:100%;max-width:600px'></canvas>");
html.append("<script>");
html.append("var xValues = [50,60,70,80,90,100,110,120,130,140,150];");
html.append("var yValues = [7,8,8,9,9,9,10,11,14,14,15];");
html.append("new Chart('myChart', {type: 'line',data: {labels: xValues,datasets: [{fill: false,lineTension: 0,backgroundColor: 'rgba(0,0,255,1.0)',borderColor: 'rgba(0,0,255,0.1)',data: yValues }]}");
html.append(",options: {legend: {display: false},scales: { yAxes: [{ticks: {min: 6, max:16}}],}}});");
html.append("</script>");
html.append("</body>");
html.append("</html>");

mrjj

Hi
I don't think it can work that way a normally graphs are drawn by javascript or similar.

What kind of graph do you need ? bar or what type?

Im asking as to get a ok graph, i think the easiest is to use QtChart or QCustomplot and render it to an image
and print that too.
However, if you just need simply bar one, we could just hand paint it.

eyllanesc

@Negar_mg QTextDocument only renders static HTML4, in your code you are using chart.js that executes js. One possible solution is to use QWebEngineView:

#include <QApplication>
#include <QWebEnginePage>
#include <QWebEngineView>


int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    QString html = R"HTML(<html>
  <body>
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <canvas id="myChart" style="width: 100%; max-width: 600px"></canvas>
    <script>
      var xValues = [50, 60, 70, 80, 90, 100, 110, 120, 130, 140, 150];
      var yValues = [7, 8, 8, 9, 9, 9, 10, 11, 14, 14, 15];

      new Chart("myChart", {
        type: "line",
        data: {
          labels: xValues,
          datasets: [
            {
              fill: false,
              lineTension: 0,
              backgroundColor: "rgba(0,0,255,1.0)",
            borderColor: "rgba(0,0,255,0.1)",
        data: yValues,
},
        ],
},
        options: {
            legend: { display: false },
            scales: { yAxes: [{ ticks: { min: 6, max: 16 } }] },
},
});
    </script>
            </body>
            </html>)HTML";

    QWebEngineView view;
    view.resize(640, 480);
    view.setAttribute(Qt::WA_DontShowOnScreen, true);
    view.show();

    QObject::connect(view.page(), &QWebEnginePage::pdfPrintingFinished, &QCoreApplication::quit);
    QObject::connect(view.page(), &QWebEnginePage::loadFinished, [&view](bool ok){
        qDebug() << ok;
        if(ok)
            view.page()->printToPdf(QString("htmlchart.pdf"));
        else
            QCoreApplication::exit(-1);
    });
    view.setHtml(html);
    return a.exec();
}

eyllanesc

@Negar_mg Note: It is recommended that if you have other problems with printing that no longer know the tables or the chart, then you create a new post.

Negar_mg

thanks,
I want to prepare a report that includes text, table, photo and chart.
With what was said here, I was able to create text, image, and table using
<QTextCursor>
<QTextDocument>
<QTextTableFormat>
<QTextDocumentWriter>
<QPrinter>
and Convert the created file to pdf.
Now I have to add the chart to that doc, do you have any suggestions for adding the chart to it?

eyllanesc

@Negar_mg Why don't you create an html that has the text, table, photo and chart in the position you want and print it using QWebEngineView? This way you will no longer need QTextDocument.

Negar_mg

@eyllanesc
thank you,i will try it.