1

有没有办法将 HTML 报告的大小指定为百分比，例如width = "90%"？或者以其他方式确保报表的宽度在导出为 HTML 时占用户屏幕的一定百分比？

我不介意创建一个额外的模板，或者只将图表导出为图像。

我正在使用 Jasper 报告版本 6.9.0。

4

1 回答 1

3

Jasper 报告导出旨在实现像素完美（可打印）输出，这就是为什么默认情况下，无论浏览器窗口的大小如何，大小都会以像素为单位与报告的实际宽度相对应。

为了实现这一点， Jasper 报告HTMLExporter创建了一个包含 3 列的表格，第一个为空列width="50%"，第二个列宽（以 px 为单位）作为报告的宽度，第三个空列再次为width="50%". 这将使结果居中，并且报告的宽度将等于 jrxml 中指示的宽度。

如果从 java 导出，则可以覆盖此行为并设置自己的 html 页眉和页脚。

例子

HtmlExporter exporter = new HtmlExporter();
exporter.setExporterInput(new SimpleExporterInput(jasperPrint));
exporter.setExporterOutput(new SimpleHtmlExporterOutput("html/my.html"));
SimpleHtmlExporterConfiguration configuration = new SimpleHtmlExporterConfiguration();
configuration.setHtmlHeader(
        "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\r\n" + 
        "<html>\r\n" + 
        "<head>\r\n" + 
        "  <title></title>\r\n" + 
        "  <meta http-equiv=\"Content-Type\" content=\"text/html; charset=UTF-8\"/>\r\n" + 
        "  <style type=\"text/css\">\r\n" + 
        "    a {text-decoration: none}\r\n" + 
        "   .jrPage {width:90% !important}\r\n" +
        "  </style>\r\n" + 
        "</head>\r\n" + 
        "<body text=\"#000000\" link=\"#000000\" alink=\"#000000\" vlink=\"#000000\">\r\n" + 
        "<table width=\"100%\" cellpadding=\"0\" cellspacing=\"0\" border=\"0\">\r\n" + 
        "<tr><td width=\"5%\">&nbsp;</td><td align=\"center\">\r\n");

configuration.setHtmlFooter(
        "</td><td width=\"5%\">&nbsp;</td></tr>\r\n" + 
        "</table>\r\n" + 
        "</body>\r\n" + 
        "</html>\r\n");
exporter.setConfiguration(configuration);
exporter.exportReport();

基本上，我对默认 html 页眉和页脚所做的更改是

  1. 添加.jrPage样式以覆盖像素宽度，改为更改为 90% 宽度。

  2. 将两侧列的百分比从更改50%为5%

这将创建一个动态大小的 html，该 html 居中并占据可用窗口大小的 90%。

示例在这种情况下如何自动缩放由图表生成的图像

考虑到这个问题中的 jrxml如何将报告导出到 PDF/A-1a、PDF/A-1b？

  1. 添加net.sf.jasperreports.export.html.class到图表元素

    <pieChart>
  <chart isShowLegend="false">
    <reportElement x="225" y="-670" width="320" height="140" uuid="23bd26a6-04a4-406f-8a1a-5e1b260cb75d">
      <property name="net.sf.jasperreports.export.html.class" value="pieChart"/>
    </reportElement>
....

  2. 在 HTML 标头中添加一些 CSS

     @media only screen and (min-width : 768px) {
     td.pieChart img {height:300px !important;}
 }
 @media only screen and (min-width :  1224px) {
     td.pieChart img {height:400px !important;}
 }

但是请注意，图像只是“重新缩放”，因此它将保持其原始分辨率。

于 2019-09-11T15:11:12.873 回答