Javascript 剑道UI绘图API导出PDF过早拆分html表,在页面上生成无用的空白

Javascript 剑道UI绘图API导出PDF过早拆分html表,在页面上生成无用的空白,javascript,pdf,dom,kendo-ui,export-to-pdf,Javascript,Pdf,Dom,Kendo Ui,Export To Pdf,我正在使用剑道UI绘图API将一个简单的html表格导出为PDF 由于默认字体大小很大,我根据官方的剑道UI文档(见kendoui.io/Kendo UI/framework/drawing/drawing dom#自定义外观)对整个容器div及其子容器应用新的字体大小 问题是,减小字体大小会将我的表格导出到错误的高度,从而导致不必要的空白,如您在此处所见: 你们知道为什么会这样吗?我已经试过了: 不同的边距大小 不同的forcePageBreak值 不同的纸张尺寸(尽管我需要使用A4尺

我正在使用剑道UI绘图API将一个简单的html表格导出为PDF

由于默认字体大小很大,我根据官方的剑道UI文档(见kendoui.io/Kendo UI/framework/drawing/drawing dom#自定义外观)对整个容器div及其子容器应用新的字体大小

问题是,减小字体大小会将我的表格导出到错误的高度,从而导致不必要的空白,如您在此处所见:

你们知道为什么会这样吗?我已经试过了:

  • 不同的边距大小
  • 不同的forcePageBreak值
  • 不同的纸张尺寸(尽管我需要使用A4尺寸)
  • 谢谢你的关注。我希望你能在这个问题上帮助我

    我已经包含了一个非常基本的JS、CSS和HTML代码片段,以备您需要查看:

    函数getPDF(选择器、nro、dateC){ 剑道( $(选择器), { forcePageBreak:“-”, 纸张尺寸:“A4”, 边距:“0厘米”, 多页:正确 }).then(功能(组){ //将结果呈现为PDF文件 返回kendo.drawing.exportPDF(组); }).done(函数(数据){ //保存PDF文件 剑道({ dataURI:data, 文件名:“fileName.pdf” }); }); }
    .k-pdf-export*{
    字号:6pt;
    字体系列:Arial,无衬线;
    }
    .k-pdf-出口h5{
    边界:无;
    垫底:0px;
    字体大小:粗体;
    边缘底部:5px;
    }
    .k-pdf-export.配置摘要.报价总td{
    字体大小:粗体;
    }
    .k-pdf-export strong{
    宽度:100px;
    }
    
    
      标题
      问询处 坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum

      细节 坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum
      坐卧多洛Lorem Ipsum


      桌子 领域 字段2 字段3 字段4 三色吊牌 三色吊牌 Lorem ipsum dolor sit amet,是一位杰出的献身者。这是我的生命,我的生命。 1. 494 三色吊牌 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 25.25 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 125.88 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 297.88 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 563.73 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 238.36 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 63.32 三色吊牌 献祭精英。塞德维塔萨吉提斯。 1. 1,013.56 值999.99
      好的,经过一些测试,我设法克服了这个问题。这是我在代码中修改的内容:

      • 将要导出的元素的宽度和高度设置为A4纸的当量,单位为英寸(意思是设置
        宽度:7英寸
        高度:9.25英寸
        )。这是一个改变,使一切都适合
      • 在绘图函数中设置
        “横向:假”
      • 为某些包含div的分区设置
        “border:none”
        “overflow:initial”
      • 更改要导出的目标元素(因此,它将查找通用容器div,而不是带有类和已定义css的div)
      我不太清楚