label - 如何将任务标签添加到资源 AnyGantt

Question

我想用 AnyGantt 创建一个资源甘特图，目前，当鼠标指针移动到任务时，它会显示资源名称和开始时间/结束时间。我想显示任务名称和开始时间/结束时间。（使用以下数据，我想显示“task1”，而不是“Equipment#1”）有人可以帮忙吗？

谢谢！

[ {"id": 13, "name": "Equipment#1", "periods": [{"id": "task1", "end": 1494099000000, "fill": "green", "start": 1494055800000}]}]

Answer 1

首先，期间的 ID 是必填字段，并且对于甘特图实时编辑目的必须是唯一的。您可以像这样在原始数据中设置任何自定义字段：

var rawdata = [{
    id: 13,
    name: "Equipment#1",
    periods: [
      {
        id: "task1",
        start: Date.UTC(2017, 4, 6),
        end: Date.UTC(2017, 4, 7),
        periodCustomName: "Task 1" //This value will be used in tooltip's title.
      }
    ]
  }];

由于数据已准备就绪，您必须为时间线的工具提示设置自定义标题格式：

//Getting gantt chart's timeline to work with its tooltip.
var timeline = chart.getTimeline();

//Gettnig timeline's tooltip.
var tlTooltip = timeline.tooltip();

//Setting tooltip title format function to access your custom raw data field.
tlTooltip.titleFormat(function() {
  //If period is hovered.
  if (this.period) {
    //Return periodCustomName-field if specified. 
    return this.period.periodCustomName || this.getData('name');
  }
  //Else return name of data item ("Equipment#1")
  return this.getData('name');
});