Bootstrap

项目管理软件dhtmlxGantt配置教程(十四):自定义缩放时间尺度

dhtmlxGantt提供了一个内置模块,用于方便地管理时间尺度缩放。如果您想自定义默认缩放行为,有一个灵活的 API 允许您实现动态更改时间刻度设置的能力。

1、内置缩放模块

嵌入式缩放模块在gantt.ext.zoom扩展中声明。要启用该模块,您需要调用gantt.ext.zoom.init(zoomConfig)并传递一个带有配置设置的zoomConfig对象,其中包含一组缩放级别。例如:

var zoomConfig = {
    levels: [
      {
        name:"day",
        scale_height: 27,
        min_column_width:80,
        scales:[
            {unit: "day", step: 1, format: "%d %M"}
        ]
      },
      {
         name:"week",
         scale_height: 50,
         min_column_width:50,
         scales:[
          {unit: "week", step: 1, format: function (date) {
           var dateToStr = gantt.date.date_to_str("%d %M");
           var endDate = gantt.date.add(date, 6, "day");
           var weekNum = gantt.date.date_to_str("%W")(date);
           return "#" + weekNum + ", " + dateToStr(date) + 
;