dhtmlxGantt如何导出/导入Excel,导出到iCal
dhtmlxGantt是用于跨浏览器和跨平台应用程序的功能齐全的Gantt图表。可满足项目管理应用程序的所有需求,是最完善的甘特图图表库。它允许你创建动态甘特图,并以一个方便的图形化方式可视化项目进度。有了dhtmlxGantt,你可以显示活动之间的依赖关系,显示具有完成百分比阴影的当前任务状态以及组织活动到树结构。
下载dhtmlxGantt试用版【慧都网】
dhtmlxGantt库允许您以Excel和iCal格式从甘特图导出数据。您也可以从Excel文件将数据导入甘特文件。
请求大小限制
有一个通用的API端点https://export.dhtmlx.com/gantt,该端点可用于所有导出方法(exportToPDF,exportToPNG,exportToMSProject等)以及importFromExcel 方法。请求的最大大小为10 MB。
还有一个单独的API端点https://export.dhtmlx.com/gantt/project,专门用于MSProject导出/导入服务 (仅exportToMSProject / importFromMSProject)。最大请求大小:40 MB。
导出到Excel
要将数据从甘特图导出到Excel文档,请执行以下操作:
- 在页面上包含“ http://export.dhtmlx.com/gantt/api.js”文件以启用在线导出服务:
<script src="codebase/dhtmlxgantt.js"></script> <script src="https://export.dhtmlx.com/gantt/api.js"></script> <link rel="stylesheet" href="codebase/dhtmlxgantt.css" type="text/css">
- 调用exportToExcel方法以从甘特图导出数据:
<input value="Export to Excel" type="button" onclick='gantt.exportToExcel()'> <script> gantt.init("gantt_here"); gantt.parse(demo_tasks); </script>
相关样本: 导出数据:MS Project,PrimaveraP6,Excel和iCal
相关样本: 导出数据:在线存储
导出方法的参数
所述exportToExcel()方法作为一个参数与多个属性(所有属性是可选的)的对象:
- 名称-(字符串)设置输出文件的扩展名为'.xlsx'
- 列-(数组)允许配置输出Excel工作表的列。列对象的属性是:
- 'id' -(string,number)事件的属性,将映射到列
- 'header' -(字符串)列标题
- 'width' -(number)列的宽度,以像素为单位
- 'type' -(字符串)列类型
- server-(字符串)设置请求的API端点。可以与导出服务的本地安装一起使用。默认值为https://export.dhtmlx.com/gantt
- visual-(boolean)将时间线图添加到导出的Excel文档中。默认为假
- cellColors-(boolean)如果设置为true,则导出文档的单元格将具有由timeline_cell_class模板定义的颜色, 导出color和background-color属性
- data-(object)设置将在输出甘特图中显示的自定义数据源
- date_format-(字符串)设置日期的格式,该日期将在导出的Excel文档中显示。您可以在此处查看可用格式代码的完整列表。
使用可选属性调用导出方法
gantt.exportToExcel({ name:"document.xlsx", columns:[ { id:"text", header:"Title", width:150 }, { id:"start_date", header:"Start date", width:250, type:"date" } ], server:"https://myapp.com/myexport/gantt", visual:true, cellColors:true, data:{}, date_format: "dddd d, mmmm yyyy" });
设置要导出的自定义数据源
要使用自定义数据集导出甘特图(即不使用初始甘特图中显示的数据),请在exportToExcel方法的参数中使用data属性 :
gantt.exportToExcel({ name:"document.xlsx", data:[ {id:1, text:"Project #1", start_date:"01-04-2020", duration:18}, {id:2, text:"Task #1", start_date:"02-04-2020",duration:8, parent:1}, {id:3, text:"Task #2", start_date:"11-04-2020",duration:8, parent:1} ] });
请注意,您不能将某些URL指定为data参数的值,而只能将其指定为数据对象。添加要导出的任务的颜色
您可以通过将视觉属性的值设置为“ base-colors”,将任务的颜色添加到甘特图的导出的Excel文件中:
gantt.exportToExcel({ visual: "base-colors", cellColors: true })
从Excel导入
由于无法自动将Excel文档的任意列映射到Gantt数据模型,因此导出服务会将文档转换为以JSON返回的行数组。将最终文档转换为甘特数据是最终开发人员的责任。
为了转换Excel文件,您需要将以下请求发送到导出服务:
- 请求网址-https: //export.dhtmlx.com/gantt
- 请求方法-POST
- 内容类型-多部分/表单数据
请求参数为:
- 文件-Excel文件
- 类型-“ excel-parse”
- 数据-(可选)带有设置的JSON字符串
例如:
<form action="https://export.dhtmlx.com/gantt" method="POST" enctype="multipart/form-data"> <input type="file" name="file" /> <input type="hidden" name="type" value="excel-parse"> <button type="submit">Get</button> </form>
另外,您可以使用客户端API:
gantt.importFromExcel({ server:"https://export.dhtmlx.com/gantt", data: file, callback: function(project){ console.log(project) } });
其中file是File的实例,其中应包含一个Excel(xlsx)文件。
gantt.importFromExcel需要HTML5 File API支持。
响应
响应将包含带有对象数组的JSON:
[ { "Name": "Task Name", "Start": "2018-08-11 10:00", "Duration": 8 }, ... ]
where:
- 第一行的值用作导入对象的属性名称。
- 每行被序列化为一个单独的对象。
- 日期值以“%Y-%m-%d%H:%i”格式序列化。
导入设置
- 导入服务期望导入的工作表的第一行是包含列名称的标题行。
- 默认情况下,服务返回文档的第一张纸。为了返回不同的工作表,请使用工作表参数(从零开始)
gantt.importFromExcel({ server:"https://export.dhtmlx.com/gantt", data: file, sheet:2, // print third sheet callback: function (rows) {} });
导出到iCal
要将数据从甘特图导出到iCal字符串,请执行以下操作:
在页面上包含“ http://export.dhtmlx.com/gantt/api.js”文件以启用在线导出服务:
<script src="codebase/dhtmlxgantt.js"></script> <script src="https://export.dhtmlx.com/gantt/api.js"></script> <link rel="stylesheet" href="codebase/dhtmlxgantt.css" type="text/css">
调用exportToICal方法以从甘特图导出数据:
<input value="Export to iCal" type="button" onclick='gantt.exportToICal()'> <script> gantt.init("gantt_here"); gantt.parse(demo_tasks); </script>
导出方法的参数
所述exportToICal()方法作为一个参数与下列属性(可选)的对象:
server-(字符串)设置请求的API端点。可以与导出服务的本地安装一起使用。默认值为https://export.dhtmlx.com/gantt。
使用可选属性调用导出方法
gantt.exportToICal({ server:"https://myapp.com/myexport/gantt" });
关产品推荐:
VARCHART XGantt:支持ActiveX、.Net等平台的C#甘特图控件
AnyGantt:构建复杂且内容丰富的甘特图的理想工具
jQuery Gantt Package:基于HTML5 / jQuery的跨平台jQuery Gantt包
phGantt Time Package:对任务和时间的分配管理的甘特图
APS帮助提升企业生产效率,真正实现生产计划可视化呈现与控制,快速有效响应不同场景的生产计划,提高准时交货能力,提高产能和资源利用率