示例 论坛 支持
文档
开始甘特图 API其他

treeDatastore

一组 treeDatastore 方法的集合

object treeDatastore;
Details

注意，任务（Tasks）和链接（Links）应通过标准的 Gantt API 进行更新。直接在 datastore 中更改任务或链接可能导致意外行为。Datastore 主要用于资源或其他自定义对象。

您可以使用 createDatastore 方法创建一个新的 datastore。

TreeDatastore 继承自 Datastore，并包含其所有方法。 treeDatastore 对象的扩展 API 提供了以下 方法 和 事件：

方法

  • move (sid, tindex, parent): boolean | void - 将一个项目移动到新的位置或父节点
    • sid - (string | number) - 要移动的项目标识符
    • tindex - (number) - 项目将在该分支中的目标索引位置
    • parent? - (string | number) - 新父节点的 id。如果提供，tindex 是相对于该父节点分支的索引
    如果被 onBeforeItemMove 取消，返回 false，否则返回 undefined。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.move(6, -1, 2);// 将 'John' 从 'QA' 移动到 'Development'


    treeDatastore.move() 的对应方法是 gantt.moveTask()。
    此方法会触发 onBeforeItemMove、onAfterItemMove 事件，以及所有与 refresh 方法相关的事件。
  • getBranchIndex (id): number - 获取项目在其分支中的索引
    • id - (string | number) - 项目的标识符
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getBranchIndex(8);
// -> 1


    treeDatastore.getBranchIndex() 的对应方法是 gantt.getTaskIndex()
  • hasChild (id): number | void - 判断指定项目是否有子项目
    • id - (string | number) - 项目的标识符
    如果存在子项目，返回子项目数量（number），否则返回 undefined。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.hasChild(1);
// -> true
 
store.hasChild(9);
// -> false


    treeDatastore.hasChild() 的对应方法是 gantt.hasChild()。
  • getChildren (id): Array<number | string | object> - 获取指定父分支的直接子项目
    • id - (string | number) - 父分支的 id
    返回包含子项目 id 的数组。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getChildren(3);
// -> [9, 10]
 
store.getChildren(9);
// -> [0]


    treeDatastore.getChildren() 的对应方法是 gantt.getChildren()。
  • isChildOf (childId, parentId): boolean - 判断一个项目是否为另一个项目的子项目
    • childId - (string | number) - 潜在子项目的 id
    • parentId - (string | number) - 潜在父项目的 id
    如果该项目是指定父项目的子项目，返回 true，否则返回 false。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.isChildOf(9, 3);
// -> true
 
store.getChildren(9, 2);
// -> false


    treeDatastore.isChildOf() 的对应方法是 gantt.isChildOf()。
  • getSiblings (id): Array<number | string | object> - 获取指定项目的兄弟节点（含项目自身）
    • id - (string | number) - 项目的 id
    返回包含兄弟节点 id 的数组。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getSiblings(1);
// -> [1,2,3,4]
 
store.getSiblings(6);
// -> [6]


    treeDatastore.getSiblings() 的对应方法是 gantt.getSiblings()。
  • getNextSibling (id): number | string | null - 返回同级下一个兄弟节点的 id
    • id - (string | number) - 当前项目的 id
    返回下一个兄弟节点的 id，如果不存在则返回 null。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getNextSibling(9);
// -> 10
 
store.getNextSibling(10);
// -> null


    treeDatastore.getNextSibling() 的对应方法是 gantt.getNextSibling()。
  • getPrevSibling (id): number | string | null - 返回同级上一个兄弟节点的 id
    • id - (string | number) - 当前项目的 id
    返回上一个兄弟节点的 id，如果不存在则返回 null。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getPrevSibling(9);
// -> null
 
store.getPrevSibling(10);
// -> 9


    treeDatastore.getPrevSibling() 的对应方法是 gantt.getPrevSibling()。
  • getParent (id): number| string - 返回父项目的 id，如果不存在则返回 0
    • id - (string | number) - 项目的 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.getParent(9);
// -> 3
 
store.getParent(1);
// -> 0


    treeDatastore.getParent() 的对应方法是 gantt.getParent()。
  • calculateItemLevel (item): number - 计算项目的嵌套层级
    • item - (object) - 项目对象
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.calculateItemLevel(store.getItem(9));
// -> 1
 
store.calculateItemLevel(store.getItem(1));
// -> 0


    treeDatastore.calculateItemLevel() 的对应方法是 gantt.calculateTaskLevel()。
  • setParent (item, newParentId): void - 通过更新 `parentProperty` 配置（默认为 "item.parent"）指定的属性，为项目分配新的父节点。
    • item - (object) - 项目对象
    • newParentId - (string | number | null) - 新父节点的 id

    要正确地将项目移动到不同父节点，请使用 treeDatastore.move()。setParent() 方法仅更新项目的属性，不影响内部树结构。

    gantt.createDatastore({
    name: gantt.config.resource_store,
    type: "treeDatastore",
    parentProperty: "parent", //
    initItem: function (item) {
        item.parent = item.parent || gantt.config.root_id;
        item[gantt.config.resource_property] = item.parent;
        item.open = true;
        return item;
    }
});
 
var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.setParent(store.getItem(9), 4);
// -> 3


    treeDatastore.setParent() 的对应方法是 gantt.setParent()。
  • eachItem (callback, parentId): void - 遍历给定项目的所有子项目
    • callback - (Function) - 对每个项目执行的函数
    • parentId? - (string | number) - 起始父节点 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.eachItem(function(item){
    console.log(item.text);
});


    treeDatastore.eachItem() 的对应方法是 gantt.eachTask()。
  • eachParent (callback, startItem): void - 遍历指定项目的所有父项目
    • callback - (Function) - 对每个父项目执行的函数
    • startItem - (string | number) - 要遍历其父节点的项目 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.eachParent(function(item){
    console.log(item.text);
}, 10);
// -> "Sales"


    treeDatastore.eachParent() 的对应方法是 gantt.eachParent()。
  • open (id): void - 展开指定 id 的分支
    • id - (string | number) - 分支 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.open(1);


    treeDatastore.open() 的对应方法是 gantt.open()。 此操作会触发 onItemOpen 事件。
  • close (id): void - 折叠指定 id 的分支
    • id - (string | number) - 分支 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
store.close(1);


    treeDatastore.close() 的对应方法是 gantt.close()。 此操作会触发 onItemClose 事件。
  • sort (field, desc, parent, silent): void - 对资源 grid 中的项目进行排序
    • field - (string | Function) - 要排序的列名或自定义排序函数
    • desc? - (boolean) - 排序顺序：true 表示降序，false 表示升序（默认 false）
    • parent? - (string | number) - 限制排序到指定父分支的 id
    • silent? - (boolean) - 是否跳过排序后的渲染
    var store = gantt.getDatastore(gantt.config.resource_store);
store.parse([
    {id: 1, text: "QA", parent:null},
    {id: 2, text: "Development", parent:null},
    {id: 3, text: "Sales", parent:null},
    {id: 4, text: "Other", parent:null},
    {id: 5, text: "Unassigned", parent:4},
    {id: 6, text: "John", parent:1},
    {id: 7, text: "Mike", parent:2},
    {id: 8, text: "Anna", parent:2},
    {id: 9, text: "Bill", parent:3},
    {id: 10, text: "Floe", parent:3}
]);
 
// 切换排序方向并按列名排序资源
var resourceSortDirection = false;
function sortResources(){
    resourceSortDirection = !resourceSortDirection;
    gantt.getDatastore("resource").sort("text", resourceSortDirection)
    gantt.render();
}

    Related sample:  Gantt. 按列排序资源

    您也可以使用自定义排序函数： 
    var resourceSortDirection = false;
function sortResources(){
    resourceSortDirection = !resourceSortDirection;
    gantt.getDatastore("resource").sort(function (resource1, resource2){
        return resource1.id - resource2.id;
    }, resourceSortDirection)
    gantt.render();
}

    Related sample:  Gantt. 使用自定义函数排序资源

    treeDatastore.sort() 的对应方法是 gantt.sort()。

事件

  • onBeforeItemMove (id, parent, tindex) - 在项目移动到新位置之前触发
    • id - (string | number) - 要移动的项目 id
    • parent - (string | number) - 新父节点 id
    • tindex - (number) - 在父分支中的目标索引
    返回 false 可阻止移动，否则返回 true。 
    var store = gantt.getDatastore(gantt.config.resource_store);
store.attachEvent("onBeforeItemMove", function(id, parent, tindex){
    // 在此处编写您的代码
    return true;
});


    treeDatastore 的 onBeforeItemMove 事件对应 Gantt 的 onBeforeTaskMove 事件。
  • onAfterItemMove (id, parent, tindex) - 项目移动完成后触发
    • id - (string | number) - 被移动项目的 id
    • parent - (string | number) - 新父节点 id
    • tindex - (number) - 在父分支中的新索引
    var store = gantt.getDatastore(gantt.config.resource_store);
store.attachEvent("onAfterItemMove", function(id, parent, tindex){
    // 在此处编写您的代码
});


    treeDatastore 的 onAfterItemMove 事件对应 Gantt 的 onAfterTaskMove 事件。
  • onItemOpen (id) - 分支展开时触发
    • id - (string | number) - 分支 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.attachEvent("onItemOpen", function(id){
    // 在此处编写您的代码
});


    treeDatastore 的 onItemOpen 事件对应 Gantt 的 onTaskOpened 事件。
  • onItemClose (id) - 分支折叠时触发
    • id - (string | number) - 分支 id
    var store = gantt.getDatastore(gantt.config.resource_store);
store.attachEvent("onItemClose", function(id){
    // 在此处编写您的代码
});


    treeDatastore 的 onItemClose 事件对应 Gantt 的 onTaskClosed 事件。
See also
  • API
  • Articles
    • Back to top