샘플 포럼 지원
문서
Start간트 API기타

treeDatastore

treeDatastore 메서드들의 모음

object treeDatastore;
Details

참고, Tasks와 Links는 표준 Gantt API를 통해 업데이트해야 합니다. datastore 내에서 직접적으로 tasks나 links를 변경하면 예기치 않은 동작이 발생할 수 있습니다. Datastore는 주로 리소스나 기타 커스텀 객체를 위한 용도로 설계되었습니다.

새로운 datastore는 createDatastore 메서드를 사용하여 생성할 수 있습니다.

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 - 리소스 그리드의 아이템들을 정렬합니다
    • 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