createTimelineView

在 scheduler 中设置 Timeline 视图

void createTimelineView(object config);

config

object

Timeline 视图的配置对象

Available only in PRO Edition

Example

// 时间刻度从上午8点到晚上8点，间隔为30分钟
scheduler.createTimelineView({
    name: "timeline",
    x_unit: "minute",
    x_date: "%H:%i",
    x_step: 30,
    x_size: 24,
    x_start: 16,
    x_length: 48,
    fit_events_offset: 15,
    y_unit:[    
        {key:1, label:"Section A"},
        {key:2, label:"Section B"},
        {key:3, label:"Section C"},
        {key:4, label:"Section D"}  
    ],
    y_property: "section_id",
    render: "bar"
});

Applicable views:Timeline 视图

Related samples

Details

此功能仅在 PRO 版本中可用。

该方法需要启用 timeline 插件。

Timeline 视图的配置对象支持以下属性：

name- (string) 视图的标识符。定义与已有 Timeline 视图相同的 name 会覆盖该视图
render - ('cell', 'bar', 'tree', 'days') 定义视图模式。默认为 'cell'
y_property - (string) 用于将事件关联到特定区块的数据属性
y_unit - (对象数组) 定义视图中的区块。
每个对象代表一个区块，包含以下属性：
- children - (数组) 仅用于 'Tree' 模式的嵌套子项
- key - (string) 区块的 ID，用于匹配事件属性以分配事件
- label - (string) 区块显示标签
- open - (boolean) 区块是否初始展开（仅对 'Tree' 模式）
days - (number) Y 轴上的项目数量（天数），仅对 'Days' 模式有效
x_unit - (minute, hour, day, week, month, year) X 轴的时间单位。默认为 'minute'
x_date - (string) X 轴日期格式（参见日期格式规范）。若未设置，使用 hour_date 格式
x_step - (number) X 轴步长，单位为 'x_unit'。默认为 1
x_start - (number) X 轴起始偏移，单位为 'x_unit'。默认为 0
x_size - (number) X 轴总长度，表示 'x_step' 的数量。默认为 24
x_length - (number) 点击调度器头部“下一页”按钮时滚动的 'x_step' 数量。可选，默认为 1。
此参数较为复杂，请注意：
- 仅当 x_unit='minute' 或 x_unit='hour' 时有效，其他单位可省略。
- 若未设置 x_length，时间线根据其他刻度参数（x_start, x_step, x_size）显示部分日间区间，允许滚动浏览日段。
- 若设置了 x_length，应覆盖整天（填满一天的 x_step 数量），确保“下一页”按钮正常工作。
first_hour - (number) 单元格内时间区间的起始小时，仅当 x_unit="day" 有效
last_hour - (number) 单元格内时间区间的结束小时，仅当 x_unit="day" 有效
show_unassigned (boolean) 若为 false，则未分配到任何区块的事件不显示；若为 true，则这些事件显示在第一个区块。默认为 false，可选
section_autoheight - (boolean) 是否启用单元格高度自动调整。默认为 true
dy - (number) 最小单元格高度（若 section_autoheight 为 false，单元格高度固定为此值；否则高度自动扩展以填充空间）。默认为 50
dx - (number) 显示区块名称的列宽。默认为 200
event_dy - (number/string) 事件高度；可设为 'full' 以填满整个单元格。默认为 scheduler.xy.bar_height-5
event_min_dy - (number) 事件最小高度。默认为 scheduler.xy.bar_height-5
resize_events - (boolean) 是否允许单个事件高度缩小以适应单个事件高度（不低于 event_min_dy）。默认为 true
fit_events - (boolean) 是否扩展区块高度以适应所有事件，或保持固定高度（dy）。3.0 版本起支持。默认为 true
fit_events_offset - (number) 当 fit_events 为 true 时，最后一个事件下方的额外空白（像素）
round_position - (boolean) 是否将事件拉伸至单元格全宽，无论持续时间。默认为 false。仅适用于 'bar' 和 'tree' 模式
folder_events_available - (boolean) 是否允许将事件分配给整个文件夹（任意层级），而非仅分配给单独持有者。仅适用于 'tree' 模式。默认为 false
folder_dy - (number) 文件夹（包含子区块的区块）高度（像素）。仅适用于 'tree' 模式
second_scale - (object) 在默认 X 轴上方添加第二个 X 轴，用于分组时间区间。可选，3.0 版本起支持。
对象包含：
- x_unit - (minute, hour, day, week, month, year) 时间单位。默认为 'minute'
- x_date - (string) 日期格式（参见日期格式规范）。若未设置，使用 hour_date 格式
scrollable - (boolean) 是否启用 Timeline 视图的水平滚动；默认为 false。若为 false 或未定义，日期列会缩小以适应视口宽度。若为 true，列宽不会小于 column_width，并在需要时显示水平滚动条。
column_width - (number) 时间线日期列的最小宽度；默认为 100
scroll_position - (Date) 渲染后滚动到指定日期；接受与 timeline.scrollTo() 相同的参数
autoscroll - (object) 配置自动滚动的灵敏度和速度，属性包括：
- range_x - (number) 数据区边缘的水平自动滚动距离
- range_y - (number) 数据区边缘的垂直自动滚动距离
- speed_x - (number) 水平自动滚动速度
- speed_y - (number) 垂直自动滚动速度
cell_template - (boolean) 是否启用自定义 Timeline 单元格模板渲染
smart_rendering - (boolean) 是否启用智能渲染，仅渲染可见的行、列和事件，其他在滚动时加载。可滚动时间线默认启用。
columns- (数组) 指定左侧面板的列。若未提供，使用 timeline_scale_label 模板。

动态修改属性

所有 timeline 视图均存储于 scheduler.matrix 中。你可以通过视图名称访问并修改任意 timeline 视图配置。更新后需重绘 scheduler 以生效：

scheduler.getView('timeline').x_size = 12;
scheduler.setCurrentView(); // 重新绘制 scheduler

这里的 "timeline" 是在 createTimelineView 方法中赋予 timeline 视图的名称：

scheduler.createTimelineView({
    name:"timeline",
    ...
});

返回顶部