Question

通过在线查看许多示例，这似乎很简单，但是我无法包装我的专栏（换行符）。由于代码最终会出现一些内部冲突，因此我无法更改版本。我做错了什么？我曾经做过一个对象，并将其作为参数传递给doc.autotable（），但这似乎并没有呈现给pdf，所以我在参数中进行样式“内联”，如下例所示。我想将名称和国家/地区换行到下一行，就像在常规表格中那样。这些数据全部来自后端，因此，我想在出现问题之前进行检查。

现在看起来像这样

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>

    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.2.60/jspdf.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/2.0.15/jspdf.plugin.autotable.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/2.0.15/jspdf.plugin.autotable.src.js"></script>
</head>

<body>
    <button onclick="generatePdf()">Generate pdf</button>


    <script>
        function generatePdf() {

            var columns = [{
                title: "ID",
                dataKey: "id"
            },
            {
                title: "Name",
                dataKey: "name"
            },
            {
                title: "Country",
                dataKey: "country"
            },
            ];
            var rows = [{
                "id": 1,
                "name": "ShawNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "TanzaniaNelsonNelsonNelsonNelsonNelson"
            },
            {
                "id": 2,
                "name": "NelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "KazakhstanNelsonNelsonNelsonNelsonNelsonNelsonNelson"
            },
            {
                "id": 3,
                "name": "GarciaNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "MadagascarNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson"
            },
            ];


            var doc = new jsPDF('p', 'pt');

            var header = function (data) {
                doc.setFontSize(18);
                doc.setTextColor(40);
                doc.setFontStyle('normal');
                doc.text("Testing Report", data.settings.margin.left, 50);
            };

            doc.autoTable(columns, rows, {styles: {
                overflow: 'linebreak',
                columnWidth: 'wrap'
            },
                columnStyles: {
                    2: { columnWidth: 'auto' }
                }
                
            });

            doc.save("table.pdf");
        }
    </script>
</body>

</html>

Answer 1

将其更改为以下内容，

library(dplyr)

cities <- c('Boston', 'Chicago', 'Denver', 'HOuston', 'LosAngeles', 'Miami', 'NewYork', 'WashingtonDC')
years <- as.numeric(2014:2018)
df <- expand.grid(Year=years, City=cities, TestA=0, TestB=0, TestC=0,  stringsAsFactors = F)
df[with(df, order(Year, City)),]

dfUpdate <- data.frame(Year=c(2016, 2015), City=c('Boston', 'Chicago'), 
                   TestA=c(12.23, 16.01), TestB=c('Joe', 'Sally'), TestC=c(1000, 1500), stringsAsFactors = F )

# Check which columns are not compatible you will see that there is an issue with TestB
# class(df$City) == class(dfUpdate$City)
# class(df$Year) == class(dfUpdate$Year)
# class(df$TestA) == class(dfUpdate$TestA)
# class(df$TestB) == class(dfUpdate$TestB)
# class(df$TestC) == class(dfUpdate$TestC)

# Correct incomptible class
df$TestB = as.character(df$TestB)

library(dplyr)
result = anti_join(df, dfUpdate, by=c("Year","City"))

result = merge(result, dfUpdate, all = T)
result = result[order(result$City),]
> result
   Year         City TestA TestB TestC
1  2014       Boston  0.00     0     0
9  2015       Boston  0.00     0     0
17 2016       Boston 12.23   Joe  1000
25 2017       Boston  0.00     0     0
33 2018       Boston  0.00     0     0
2  2014      Chicago  0.00     0     0
10 2015      Chicago 16.01 Sally  1500
18 2016      Chicago  0.00     0     0
26 2017      Chicago  0.00     0     0
34 2018      Chicago  0.00     0     0
3  2014       Denver  0.00     0     0
11 2015       Denver  0.00     0     0
19 2016       Denver  0.00     0     0
27 2017       Denver  0.00     0     0
35 2018       Denver  0.00     0     0
4  2014      HOuston  0.00     0     0
12 2015      HOuston  0.00     0     0
20 2016      HOuston  0.00     0     0
28 2017      HOuston  0.00     0     0
36 2018      HOuston  0.00     0     0
5  2014   LosAngeles  0.00     0     0
13 2015   LosAngeles  0.00     0     0
21 2016   LosAngeles  0.00     0     0
29 2017   LosAngeles  0.00     0     0
37 2018   LosAngeles  0.00     0     0
6  2014        Miami  0.00     0     0
14 2015        Miami  0.00     0     0
22 2016        Miami  0.00     0     0
30 2017        Miami  0.00     0     0
38 2018        Miami  0.00     0     0
7  2014      NewYork  0.00     0     0
15 2015      NewYork  0.00     0     0
23 2016      NewYork  0.00     0     0
31 2017      NewYork  0.00     0     0
39 2018      NewYork  0.00     0     0
8  2014 WashingtonDC  0.00     0     0
16 2015 WashingtonDC  0.00     0     0
24 2016 WashingtonDC  0.00     0     0
32 2017 WashingtonDC  0.00     0     0
40 2018 WashingtonDC  0.00     0     0

名称和国家/地区列将起作用

Answer 2

你可以测试：

      <script>
          function generatePdf() {
            const doc = new jsPDF('p', 'pt');
      
            const columns = [{
              title: "ID",
              dataKey: "id"
            },
              {
                title: "Name",
                dataKey: "name"
              },
              {
                title: "Country",
                dataKey: "country"
              },
            ];
            const rows = [
              {
                "id": 1,
                "name": "ShawNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "TanzaniaNelsonNelsonNelsonNelsonNelson"
              },
              {
                "id": 2,
                "name": "NelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "KazakhstanNelsonNelsonNelsonNelsonNelsonNelsonNelson"
              },
              {
                "id": 3,
                "name": "GarciaNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson",
                "country": "MadagascarNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelsonNelson"
              }
            ];
            const header = function (data) {
              doc.setFontSize(18);
              doc.setTextColor(40);
              doc.text("Testing Report", data.settings.margin.left, 20);
            };
            doc.autoTable({
              body: [...rows],
              columns: [...columns],
              startY: 40,
              styles: {
                fontWeight: 'normal',
                overflow: 'linebreak',
                columnWidth: 'auto'
              },
              columnStyles: {
                country: {columnWidth: 'wrap'}
              },
              didDrawPage: header
            });
            doc.save('Test.pdf');
          }
      </script>

列包装jsPDF自动表不起作用？

2 个答案: