type_renderers

信息

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

Description

重新定义负责显示不同类型任务的函数

type_renderers: CustomTypeRenderers["type_renderers"]

Example

gantt.config.type_renderers[gantt.config.types.project] = function(task,defaultRender){  
    var main_el = document.createElement("div");  
      var size = gantt.getTaskPosition(task);  
      main_el.innerHTML = [  
        "<div className='project-left'></div>",  
        "<div className='project-right'></div>"  
      ].join('');  
      main_el.className = "custom-project";  

      main_el.style.left = size.left + "px";  
      main_el.style.top = size.top + 7 + "px";  
      main_el.style.width = size.width + "px";  

      return main_el;  
};

Default value: {}

Related samples

• Classic Look

Details

此功能允许您通过定义自定义渲染函数，定制不同类型任务的显示方式。

渲染函数接收两个参数:

• typeRenderer (task, defaultRender): HTMLElement | boolean | void | undefined - 一个函数，接收一个任务对象并返回一个 DOM 元素，用以替代默认的任务条。
  • task - (Task) - 任务对象
  • defaultRender? - (TaskLayerRender) - 可选，由 dhtmlxGantt 提供的默认渲染函数

可用的 type_renderers 包括:

• type_renderers - (object) - 针对不同任务类型的自定义渲染函数
  • task? - (typeRenderer) - 可选，标准任务的自定义渲染函数
  • project? - (typeRenderer) - 可选，项目任务的自定义渲染函数
  • milestone? - (typeRenderer) - 可选，里程碑任务的自定义渲染函数
  • [typeName: string] - (typeRenderer | undefined) - 可选，任意自定义任务类型的渲染函数

此选项允许您为特定任务类型创建定制外观。例如，您可以为项目或汇总任务设计更传统的显示风格。

注释

sample Classic Look

Related API

• getTaskPosition