UNPKG

dom-to-vector-pdf

Version:

Convert DOM elements to vector PDFs using jsPDF, dom-to-svg and svg2pdf.js

118 lines (90 loc) 2.82 kB
# dom-to-vector-pdf 一个使用 jsPDF、dom-to-svg 和 svg2pdf.js 将 DOM 元素转换为矢量 PDF 的工具。 ## 安装 ```bash npm install dom-to-vector-pdf ``` ## 配置选项 ### 导出选项 | 选项 | 类型 | 默认值 | 说明 | |------|------|--------|------| | id | string | 必填 | 要导出的DOM元素ID | | filename | string | 必填 | 导出的PDF文件名 | | orientation | 'portrait' \| 'landscape' | 'portrait' | PDF方向 | | unit | 'px' | 测量单位(只支持px) | | beforeSvgConvert | (svgElement: SVGElement) => void | - | SVG元素处理钩子 | | beforePdfSave | (pdf: jsPDF) => void | - | PDF文档处理钩子 | ### 字体选项 | 选项 | 类型 | 默认值 | 说明 | |------|------|--------|------| | font | string | 必填 | 字体文件路径或URL | | fontId | string | 必填 | 字体ID | | fontStyle | 'normal' \| 'italic' | 'normal' | 字体样式 | | fontWeight | string \| number | - | 字体粗细(100-900) | ### 生命周期钩子 | 钩子 | 类型 | 说明 | |------|------|------| | afterDomClone | (clonedElement: HTMLElement) => void | DOM克隆后触发 | | beforeSvgConvert | (svgElement: SVGElement) => void | SVG转换前触发 | | beforePdfGenerate | (pdf: jsPDF) => void | PDF生成前触发 | | beforePdfSave | (pdf: jsPDF) => void | PDF保存前触发 | ## 基本用法 ```javascript import vectorInstance from "dom-to-vector-pdf"; export const ExportToPDF = (id, title) => { vectorInstance.registerFont([ { font: PingFangRegular, fontId: "PingFang", fontWeight: "400", fontStyle: "normal", }, { font: PingFangHeavy, fontId: "PingFang", fontWeight: "700", fontStyle: "normal", }, ]); vectorInstance.exportPDF({ id, filename: title, }); }; ``` ## 特性 - 将DOM元素转换为矢量PDF - 保持矢量图形和文本 - 支持SVG元素 - 保持字体样式和粗细 - 处理复杂布局 ## 待办事项 ### DOM克隆 - [ ] 内联样式处理 - [ ] 样式优先级管理 - [ ] Shadow DOM支持 - [ ] iframe支持 ### 图标字体 - [ ] 当前实现使用16px作为基础字体大小进行缩放 - [ ] 需要改进图标字体大小处理 ### SVG支持 - [ ] 目前仅支持属性名与元素属性匹配的内联样式 - [ ] 需要增强SVG样式处理 ### 文本对齐 - [ ] 文本位置略低于背景 - 当前解决方案:将所有文本向上偏移3像素 ### 不支持的功能 - [ ✅ ] 图片背景导出 - [ ] Canvas导出 - [ ] 其他单位支持 ### 字体支持 - [ ] 目前仅限于单个字体系列 - 注册时字体ID必须保持一致 - [ ] 需要添加多字体支持 - [ ] 考虑WOFF2格式兼容性 ### 图片导出 - [ ] 图片导出质量需要改进 ## 贡献 欢迎贡献!请随时提交Pull Request。 ## 许可证 MIT