导出为 PDF

本文档适用于 dhtmlxScheduler 4.1 及以上版本的导出功能。如需 4.0 或更早版本，请参阅此指南。

自 4.1 版本起，dhtmlxScheduler 提供了一种新的方式，通过在线导出服务将调度器导出为 PDF 文件。

该服务可免费使用，但在 GPL 许可下生成的 PDF 会带有库的水印。购买许可证后，在有效的支持期内（所有 PRO 许可证为 12 个月），水印将被移除。

使用导出服务

有多种导出服务可用，可以在本地安装用于将 Scheduler 导出为 PDF。

请注意，导出服务与 Scheduler 包是分开的。如需了解使用条款，请参阅相关文档。

请求大小限制

API 端点 https://export.dhtmlx.com/scheduler 处理导出请求（如 exportToPDF、exportToPNG 等）。最大允许请求大小为 10 MB。

默认导出为 PDF

要将调度器导出为 PDF，请按照以下步骤操作：

通过 plugins 方法启用 export_api 插件：

scheduler.plugins({
    export_api: true
});

对于 7.0 之前的 Scheduler 版本，需要在页面中引入 https://export.dhtmlx.com/scheduler/api.js 脚本以启用在线导出服务，例如：

<script src="codebase/dhtmlxscheduler.js"></script>
<script src="https://export.dhtmlx.com/scheduler/api.js"></script>

使用 exportToPDF 方法进行导出：

<input value="Export to PDF" type="button" onclick='scheduler.exportToPDF()'>

Related sample: Export to PDF/PNG

导出方法的参数

exportToPDF() 方法可接受一个可选的对象参数，包含多种属性：

name	(string) 导出 PDF 的文件名
format	('A0', 'A1', 'A2', 'A3', 'A4', 'A5') PDF 输出的纸张尺寸
orientation	('portrait', 'landscape') PDF 页面的方向
zoom	(number) PDF 输出的缩放级别
header	(string) PDF 顶部包含的 HTML 内容
footer	(string) PDF 底部包含的 HTML 内容
server	(string) 导出请求的 API 端点 URL。如果使用本地导出服务可设置此项。默认值为 https://export.dhtmlx.com/scheduler
additional_settings	(object) 其他导出选项，包括： format - (string) 输出文件格式：'A3', 'A4', 'A5', 'Legal', 'Letter', 'Tabloid' landscape - (boolean) 页面方向，仅在指定 "format" 时适用 width - (string\|number\|"content") 输出页面宽度，多页导出时有效 height - (string\|number\|"content") 输出页面高度，多页导出时有效

调用 exportToPDF 并带参数的示例

scheduler.exportToPDF({
    name:"myscheduler.pdf",
    format:"A4",
    orientation:"portrait",
    zoom:1,
    header:"<h1>My company</h1>",
    footer:"<h4>Bottom line</h4>",
    server:"https://myapp.com/myexport/scheduler"
});

输出文件名

如需自定义导出 PDF 的文件名，请在 exportToPDF 参数中的 name 属性设置：

scheduler.exportToPDF({
    name:"my_beautiful_scheduler.pdf"});

输出文件的页眉/页脚

可以通过 exportToPDF 参数中的 header 和 footer 属性为导出的 PDF 添加页眉和页脚：

这些属性中可以使用任意 HTML。插入图片时，请确保 "src" 属性为绝对 URL。

scheduler.exportToPDF({
    name:"myscheduler.pdf",
    header:"<h1>My company</h1>",    footer:"<h4>Bottom line</h4>"});

输出文件的自定义样式

可通过引入包含自定义 CSS 类的样式表来应用自定义样式：

通过链接外部样式表：

scheduler.exportToPDF({
    name:"calendar.pdf",
    header:'<link rel="stylesheet" href="http://mysite.com/custom.css">' });

或者通过在 <style> 标签内嵌入样式：

scheduler.exportToPDF({
    name:"calendar.pdf",
    header:'<style>... custom css classes here ...</style>' });

请注意，此方式仅适用于全网可访问的 HTTP URL。对于本地或内网环境，可直接在 header 中嵌入所有样式，例如：

scheduler.exportToPDF({
    header:"<style>.tier1{background: red; color:white;}</style>"
});

导出 HTML 元素

将 Scheduler 导出为 PDF 时，出于安全考虑，对 HTML 元素存在一些限制。

某些元素如 <canvas>、<svg>、<script> 以及 Base64 编码的 src 属性图片并不完全支持。但对于导出 SVG 和 Base64 格式图片有安全的替代方式：

使用 <img> 标签，src 属性指向 SVG 图片 URL（适用于 PNG 和 JPG 导出，不适用于 Base64），例如：

<img src=https://www.svgrepo.com/download/530597/hat.svg>

使用 CSS 样式，如 background 或 background-image，通过 url() 指向图片 URL 或 Base64 字符串（适用于 PNG、JPG 和 SVG）：

.red {
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABmJLR0QA/wD/AP+gvaeTAAAAB3RJTUUH1ggDCwMADQ4NnwAAAFVJREFUGJWNkMEJADEIBEcbSDkXUnfSgnBVeZ8LSAjiwjyEQXSFEIcHGP9oAi+H0Bymgx9MhxbFdZE2a0s9kTZdw01ZhhYkABSwgmf1Z6r1SNyfFf4BZ+ZUExcNUQUAAAAASUVORK5CYII=") 100%/contain no-repeat;
    display: inline-block;
    width: 32px;
    height: 32px;
}

如果您有自定义的导出模块，并且需要导出不受支持的 HTML 元素，可以联系技术支持获取如何修改模块以绕过限制的建议。但请注意，这样做可能会使服务器面临 XSS 安全风险。

返回顶部