- <mvc:View>: View의 루트 요소로, 이 View가 사용하는 Controller를 지정합니다. controllerName 속성은 이 View가 사용할 Controller를 지정합니다.
- xmlns:mvc="sap.ui.core.mvc": XML 네임스페이스 선언으로, SAPUI5 MVC 관련 요소들을 사용하기 위한 선언입니다.
- displayBlock="true": View가 블록 요소로 렌더링되도록 합니다.
- xmlns="sap.m": SAPUI5 모바일 라이브러리의 네임스페이스 선언입니다.
- xmlns:viz="sap.viz.ui5.controls": SAPUI5 VizFrame 컨트롤의 네임스페이스 선언입니다.
- xmlns:viz.data="sap.viz.ui5.data": SAPUI5 VizFrame 데이터 관련 요소들의 네임스페이스 선언입니다.
- xmlns:viz.feeds="sap.viz.ui5.controls.common.feeds": SAPUI5 VizFrame 피드 관련 요소들의 네임스페이스 선언입니다.
- <Page>: SAPUI5 모바일 페이지 컨트롤로, 전체 View의 컨테이너 역할을 합니다.
- id="page": 이 페이지의 ID를 지정합니다.
- title="{i18n>title}": 페이지의 제목을 i18n 모델을 통해 설정합니다. 이는 다국어 지원을 위한 것입니다.
- <viz:VizFrame>: SAPUI5 VizFrame 컨트롤로, 차트를 렌더링하는 데 사용됩니다.
- id="idPiechart": 이 VizFrame의 ID를 지정합니다.
- vizType="pie": 차트의 타입을 'pie'로 지정합니다.
- selectData="onSelectData": 차트 데이터 선택 이벤트를 처리하기 위해 지정된 이벤트 핸들러입니다.
- <viz:dataset>: VizFrame에 사용될 데이터 세트를 지정합니다.
- <viz.data:FlattenedDataset>: 데이터를 평평하게(flatten) 구조화하는 데이터 세트입니다.
- data="{/newSap}": JSON 모델에서 /newSap 경로에 있는 데이터를 사용합니다. 여기서 /newSap은 모델의 루트에서 시작하는 경로로, 모델 데이터 구조에서 newSap이라는 객체나 배열을 참조합니다.
- <viz.data:dimensions>: 차트의 차원(범주)을 정의합니다.
- <viz.data:DimensionDefinition>: 차원의 정의를 지정합니다. 여기서는 skillName이 차원의 이름이고, 해당 값은 skillName 필드에서 가져옵니다.
- <viz.data:measures>: 차트의 측정값(값)을 정의합니다.
- <viz.data:MeasureDefinition>: 측정값의 정의를 지정합니다. 여기서는 rate가 측정값의 이름이고, 해당 값은 rate 필드에서 가져옵니다.
<viz:feeds>: VizFrame에 데이터를 공급(feed)하는 방법을 정의합니다.
- <viz.feeds:FeedItem>: 데이터 피드 항목을 정의합니다.
- uid="color": 이 피드 항목이 차트의 색상을 결정합니다.
- type="Dimension": 이 피드 항목이 차원의 값을 사용함을 지정합니다.
- values="skillName": 차원의 값으로 skillName 필드를 사용합니다.
- <viz.feeds:FeedItem>: 데이터 피드 항목을 정의합니다.
- uid="size": 이 피드 항목이 차트의 크기를 결정합니다.
- type="Measure": 이 피드 항목이 측정값을 사용함을 지정합니다.
- values="rate": 측정값으로 rate 필드를 사용합니다.
- </content>: 페이지의 내용 끝을 나타냅니다.
- </Page>: 페이지의 끝을 나타냅니다.
- </mvc:View>: View의 끝을 나타냅니다.
이 데이터 구조에서 /newSap 경로는 newSap 배열을 가리키며, 각 항목이 skillName과 rate 필드를 포함하고 있습니다. 차트는 이 데이터를 사용하여 skillName을 차원의 값으로, rate를 측정값으로 표시합니다.