매쉬업 작성기 > 위젯 > 레거시 위젯 > 고급 그리드(레거시) > 트리 그리드 데이터 작업
트리 그리드 데이터 작업
트리 로드 데이터 서비스 사용
트리 그리드에서 데이터의 상위 노드와 하위 노드 간의 관계는 작업을 질의하고 필터링할 때 복잡성을 추가합니다. 프로세스를 단순화하기 위해 대부분의 기능이 하나의 JavaScript 데이터 서비스에 인코딩되어 있습니다. 이 샘플은 고급 그리드 샘플 파일에서 제공됩니다. 제공된 JavaScript 코드를 서비스에 완전히 또는 조각으로 추가하여 사용자의 매쉬업에 있는 트리 그리드 기능을 지원할 수 있습니다.
필요한 경우 샘플 데이터 서비스에서 설명하는 API 구현을 Java 기반 서비스로 변환할 수도 있습니다. 입력 매개 변수 이름이 동일하게 유지되고 반환된 인포테이블에는 서비스에 필요한 각 API에 대한 올바른 행 목록이 포함되어 있는지 확인합니다.
다음과 같은 트리 그리드 기능을 최대한 활용하려면 이 데이터 서비스를 그리드에 바인딩해야 합니다.
선택적 질의 및 데이터 필터 매개 변수를 사용하여 초기 하위 데이터 로드
지정된 확장 경로(leafID)에 따라 행 자동으로 확장
지정된 질의 매개 변수와 일치하는 하위 데이터 검색
데이터 필터 위젯을 사용하여 지정된 필터 질의 매개 변수와 일치하는 하위 데이터 필터링
제공된 GetPartsData 샘플 트리 로드 데이터 서비스를 사용하려면 데이터의 위치를 가리키도록 약간 사용자 정의하고, Composer의 사물에 추가하고, 그리드에 바인딩해야 합니다. 다음 단계를 따르십시오.
1. 고급 그리드 샘플 파일 섹션의 정보를 사용하여 샘플을 저장하고 ThingWorx Composer에 가져옵니다.
2. 트리 그리드 기능에 대한 샘플 데이터 서비스는 GetPartsData입니다. 이를 찾으려면 다음 단계를 수행하십시오.
a. Composer에서 모델링/사물을 찾아 GridAdvancedExampleServices 사물을 엽니다.
b. 왼쪽 패널에서 서비스를 클릭하면 사용 가능한 샘플 서비스가 표시됩니다.
c. GetPartsData 서비스를 선택하고 편집을 클릭하여 스크립트 창을 표시합니다.
d. 보기 쉽도록 전체 화면을 클릭합니다.
3. Your Data Store 스크립트의 섹션에서 getEntriesFromDataStore 함수가 하위 데이터 소스의 위치를 가리키도록 사용자 정의합니다. 아래 그림을 참조하십시오.
소스가 데이터 테이블이면 YOUR_DATATABLE_THING 변수에서 테이블의 이름만 업데이트합니다.
소스가 데이터 스트림, 데이터 셰이프 또는 타사 플랫폼이면 이에 따라 getEntriesFromDataStore 함수를 업데이트합니다.
4. 스크립트의 행 섹션에서 상위 행이 없는 최상위 행의 parentId 값이 '/'인지 확인합니다. 이 값은 루트 수준을 나타내며 GetPartsData 서비스에서 데이터를 올바르게 정렬하고 검색할 수 있는지 확인하는 데 필요합니다.
다른 값을 사용하여 루트 수준을 나타내려면 스크립트 상단의 ROOT_ID_VALUE 매개 변수를 수정합니다. /Root, // 또는 공백 하나 와 같이 비어 있지 않은 어떤 문자열도 사용할 수 있습니다.
5. 변경 사항을 저장합니다. 이제 서비스를 그대로 사용하거나 스크립트를 복사하여 Composer에 있는 사용자의 사물에 대한 서비스에 붙여 넣을 수 있습니다.
6. 트리 그리드를 생성 중인 Mashup Builder의 오른쪽 패널에 데이터 서비스를 다른 엔티티로 추가합니다.
7. 오른쪽 패널에 있는 데이터 서비스 엔티티의 반환된 데이터 아래에서 모든 데이터를 그리드로 끌고 Data 또는 ChildData 속성에 바인딩합니다. 데이터와 하위 데이터를 동일하거나 서로 다른 소스에 연결할 수 있습니다.
8. 모든 정렬, 검색 및 필터 매개 변수를 결합하고 적절한 결과를 출력할 수 있도록 FilterFilter Query 속성을 데이터 서비스에 바인딩합니다.
9. 완료된 매쉬업을 저장하고 확인합니다.
도움이 되셨나요?