iText7结合html2pdf生成带饼图PDF时tlx-chart渲染异常问题求助

我们使用iText的核心原因是公司已持有其正版授权。

需求说明 #

• 需生成包含饼图的报表，UX团队已提供对应HTML文件，使用html2pdf插件完成HTML转PDF操作
• 为简化代码选用tlx-chart组件实现饼图绘制

遇到的问题 #

• 转换生成的PDF无法正常渲染显示饼图，日志未输出任何错误信息
• 原始HTML可正常在浏览器中加载，但iText转换效果欠佳
• 按照iText官方知识库提供的方案使用chromedriver加载HTML时，会出现2个饼图重叠的问题，官方方案无法解决当前问题

额外约束 #

• 生产服务器无法持续更新chromedriver、selenium版本
• 需实现松耦合的PDF生成链路（层级为操作系统>PDF生成>饼图渲染）

相关代码片段 #

HtmlConverter.convertToPdf(reportHtml, pdfWriter, new ConverterProperties());

<tlx-chart id="mychart" chart-type="PieChart" chart-editable="true" chart-columns="${['Element','Percentage']}" chart-data="${${pieData}}" </tlx-chart>

方案1：饼图预生成静态图片嵌入HTML（改造成本最低，完全符合约束） #

tlx-chart组件大多基于ECharts封装，你可以在生成最终的reportHTML之前，先通过服务端无浏览器的ECharts渲染工具（如Java生态的echarts-java、JFreeChart等）解析pieData生成饼图，输出为base64编码的PNG图片，再将HTML中原有的标签替换为普通的<img>标签，src属性填入生成的base64图片内容。
该方案完全不需要修改现有iText转换逻辑，也不需要依赖chromedriver、selenium，同时饼图渲染和PDF生成两个环节完全解耦，符合松耦合的链路要求，iText可以直接识别img标签完成渲染，不会出现图表异常问题。

方案2：自定义iText html2pdf标签处理器 #

iText的html2pdf模块支持自定义元素渲染规则，你可以编写针对标签的专属处理器，在转换过程中直接解析标签内的chart-data属性拿到饼图数据，调用iText原生的2D绘图API直接在PDF对应位置绘制饼图。
该方案不需要修改前端HTML模板，也不需要额外的浏览器相关依赖，处理逻辑完全嵌入iText转换流程，同样符合约束要求。

内容的提问来源于stack exchange，提问作者SatyaRajC