时间戳

首页 > 解决方案 > html2pdf 3.0.4 可以转换复杂的html文件吗？

itext - html2pdf 3.0.4 可以转换复杂的html文件吗？

问题描述

我有一个 html 文件通过画布绘制圆环图，如下所示（尚未完成），我想将其转换为 pdf：

<!DOCTYPE html>
<html>

<head>
  <title>Blayn-report</title>
  <style>

  </style>

</head>

<body>
  <canvas id="chart" width="500" height="500" style="background-color:white"> </canvas>


  <script>
    var canvas = document.getElementById("chart");
    var chart = canvas.getContext("2d");

    function drawdountChart(canvas) {

      this.x, this.y, this.radius, this.lineWidth, this.strockStyle, this.from, this.to = null;
      this.set = function (x, y, radius, from, to, lineWidth, strockStyle) {
        this.x = x;
        this.y = y;
        this.radius = radius;
        this.from = from;
        this.to = to;
        this.lineWidth = lineWidth;
        this.strockStyle = strockStyle;
      }

      this.draw = function (data) {
        canvas.beginPath();
        canvas.lineWidth = this.lineWidth;
        canvas.strokeStyle = this.strockStyle;
        canvas.arc(this.x, this.y, this.radius, this.from, this.to);
        canvas.stroke();
        var numberOfParts = data.numberOfParts;
        var parts = data.parts.pt;
        var colors = data.colors.cs;
        var df = Math.PI * 1.5;
        for (var i = 0; i < numberOfParts; i++) {
          canvas.beginPath();
          canvas.strokeStyle = colors[i];
          canvas.arc(this.x, this.y, this.radius, df, df + (Math.PI * 2) * (parts[i] / 100));
          canvas.stroke();
          df += (Math.PI * 2) * (parts[i] / 100);
        }
      }
    }

    var data =
    {
      numberOfParts: 2,
      parts: { "pt": [45, 55] },//percentage of each parts 
      colors: { "cs": ["green", "yellow"] }//color of each part
    };

    var drawDount = new drawdountChart(chart);
    drawDount.set(150, 150, 100, 0, Math.PI * 2, 30, "#fff");
    drawDount.draw(data);



  </script>
</body>

</html>

当我尝试使用 html2pdf 3.0.4 转换它时，输出文件为空。但是当我将 html 文件更改为只有文本而没有 js 的简单文件时，它工作正常。

所以我的问题是：

提前致谢！！！

标签： itextjava-7pdfhtml

解决方案

推荐阅读