매쉬업 작성기 > 위젯 > 표준 위젯 > 그리드 위젯 > 매쉬업에 그리드 위젯 추가
매쉬업에 그리드 위젯 추가
그리드 추가
1. 위젯 패널에서 그리드 위젯을 캔버스의 컨테이너로 끕니다.
2. 데이터 패널에서 인포테이블을 반환하는 데이터 서비스를 추가합니다.
3. 패널에서 데이터 서비스를 확장한 다음 반환된 데이터에서 데이터 서비스의 All Data 속성을 그리드 위젯의 Data 속성에 바인딩합니다. 채워진 화살표는 인포테이블이 그리드에 바인딩되어 있음을 나타냅니다.
4. 속성 패널에서 을 클릭하여 위젯 구성 대화 상자를 엽니다.
5. 그리드 열을 구성한 다음 완료를 클릭합니다. 사용 가능한 열 구성에 대한 자세한 내용은 그리드 열 구성을 참조하십시오.
6. 저장을 클릭한 다음 매쉬업을 봅니다. 서비스 인포테이블의 데이터가 그리드 내에 표시됩니다.
트리 그리드 추가
1. 위젯 패널에서 그리드 위젯을 캔버스의 컨테이너로 끕니다.
2. 데이터 패널에서 그리드의 상위 노드에 대한 데이터를 포함하는 인포테이블을 반환하는 데이터 서비스를 추가합니다. 이 데이터에는 처음에 표시하려는 데이터가 포함되어야 합니다.
3. 패널에서 데이터 서비스를 확장한 다음 반환된 데이터에서 데이터 서비스의 All Data 속성을 그리드 위젯의 Data 속성에 바인딩합니다. 채워진 화살표는 인포테이블이 그리드에 바인딩되어 있음을 나타냅니다.
4. 2단계를 반복하여 상위 노드에 대한 하위 데이터와 함께 인포테이블을 반환하는 두 번째 데이터 서비스를 추가합니다. 이 데이터 인포테이블은 상위가 확장될 때 표시할 데이터를 포함합니다.
* 
동일한 서비스의 상위 및 하위 데이터를 사용하면 서비스의 모든 데이터 속성을 DataChildData 속성에 바인딩합니다.
5. 패널에서 데이터 서비스를 확장한 다음 반환된 데이터에서 데이터 서비스의 All Data 속성을 그리드 위젯의 ChildData 속성에 바인딩합니다.
6. 속성 패널에서 다음을 구성합니다.
을 클릭하여 위젯 구성 대화 상자를 엽니다. 그리드 열을 숨기거나, 순서를 다시 매기거나, 이름을 바꾸거나, 유효성 검사를 적용할 수 있습니다.
IDFieldName 속성을 하위 행의 ID를 포함하는 인포테이블 열의 이름으로 설정합니다.
ParentIDFieldName 속성을 상위 행의 ID를 포함하는 인포테이블 열의 이름으로 설정합니다.
HasChildrenFieldName 속성을 행에 하위 데이터가 있는지 여부를 지정하는 이름 인포테이블 열로 설정합니다.
7. 런타임에 그리드 데이터 서비스를 실행하는 이벤트를 바인딩합니다.
8. 저장을 클릭한 다음 매쉬업을 봅니다. 서비스 인포테이블의 데이터가 그리드 내에 표시됩니다.
트리 그리드 데이터 구성
트리 그리드 구조를 만들려면 다음 형식을 사용하여 인포테이블 데이터를 바인딩해야 합니다.
데이터와 하위 데이터를 동일한 소스 또는 서로 다른 소스에 연결할 수 있습니다. 속성을 하나의 인포테이블로 위젯 Data 속성에 바인딩하거나 상위 데이터를 Data 속성에 바인딩하고 하위 데이터를 ChildData 속성에 바인딩할 수 있습니다. 다음 예에서는 상위 데이터에 대한 인포테이블 형식을 보여줍니다.
id
대륙
하위 있음
1
아시아
true
2
유럽
true
3
북미
true
4
남미
true
5
남극
false
다음 예에서는 하위 데이터에 대한 인포테이블 형식을 보여줍니다.
id
상위 ID
대륙
국가
인구
하위 있음
1
2
독일
8,300만
false
2
2
스웨덴
1,000만
false
3
2
영국
6,700만
false
4
2
이탈리아
6,000만
false
5
1
대한민국
5,100만
false
6
3
미국
3억 3,100만
false
7
3
캐나다
3,700만
false
8
4
브라질
2억 1,200만
false
9
4
페루
3,300만
false
10
1
일본
1억 2,600만
false
런타임에 상위 행이 확장될 때 표시되는 하위 행입니다.
도움이 되셨나요?