06-时序图使用方法 - CloudKanBan 相关

# **1.概述**
任何特定任务的活动顺序和持续时间都可以通过活动列表和时间刻度以图形方式直观地表示出来。为了解决这一问题，CloudKanBan新增了“时序图组件”，能以图形形式显示进度。

# **2.实现步骤**
1.选中设计器左侧条形图，拖拽时序图组件，如下图

![](/media//202303/2023-03-08_163622.png)

2.选中时序图组件，绑定数据源，如下图

![](/media//202303/2023-03-08_163740.png)
<span style="color:red">注意：如果starttime和endtime需要返回时间戳形式，具体json可参考如下：</span>
```json
[
    {
        "starttime": 1678179797169,
        "endtime": 1678179806545,
        "color": "#75d874",
        "name": "Nodes",
        "category": "categoryA"
    },
    {
        "starttime": 1678179808075,
        "endtime": 1678179810642,
        "color": "#dc77dc",
        "name": "GPU Memory",
        "category": "categoryA"
    },
    {
        "starttime": 1678179797169,
        "endtime": 1678179802994,
        "color": "#dc77dc",
        "name": "GPU Memory",
        "category": "categoryB"
    },
    {
        "starttime": 1678179803955,
        "endtime": 1678179811148,
        "color": "#dc77dc",
        "name": "GPU Memory",
        "category": "categoryB"
    }
]
```
参数说明：
starttime: 任务开始时间（时间戳）
endtime：任务结束时间（时间戳）
color：任务颜色
name：任务名称
category：任务系列类别（组）

在数据库中，可以通过 DATEDIFF(second, '1970-01-01 08:00:00', GETDATE()) 把日期时间转换为时间戳。