treeDatastore

Description

TreeDatastore 메서드들의 모음

treeDatastore: TreeDatastoreMethods

Example

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 example: Gantt. 컬럼별 리소스 정렬





또는 커스텀 정렬 함수를 사용할 수 있습니다:

var resourceSortDirection = false;
function sortResources(){
    resourceSortDirection = !resourceSortDirection;
    gantt.getDatastore("resource").sort(function (resource1, resource2){
        return resource1.id - resource2.id;
    }, resourceSortDirection)
    gantt.render();
}



노트

Related example: 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 이벤트입니다.

Related API

• createDatastore
• getDatastore
• datastore

Related Guides

• 리소스 관리