Dataframe

[report 영역] Dataframe은 데이터를 표로 정의합니다.

필드	타입	필수	설명	기본값
section	string	Y	데이터가 표출되는 영역 report
contents	object[]	Y	표로 전환 할 데이터 테이블
config	object	Y	기본 설정
config.id	string	Y	표의 고유 식별자
config.type	string	Y	type 구분 dataframe
config.option	object	N	세부 설정
config.option.title	string	N	표의 제목
config.option.note	string	N	표의 설명 ex) (단위:만원 면적: ㎡)
config.option.column	object	N	열에 관련한 옵션 설정
config.option.column.style	object[]	N	열 스타일 정의
config.option.column.style[].name	string	Y	스타일을 정의할 열의 이름
config.option.column.style[].format	string	N	해당 열의 decimal format (숫자 관련 포맷) ex) ‘#,##0.0#’ 1234.995 → 1,235.0 1234.956 → 1,234.96 ‘#,##0.0#%’ 0.34995 → 35.0%
config.option.column.style[].fontWeight	string	N	열 텍스트 굵기 (CSS font-weight)	normal
config.option.column.style[].fillColor	string	N	열 배경색 (CSS 색상값)	#FFFFFF
config.option.column.style[].textAlign	string	N	열 텍스트 정렬 (left/center/right)	center
config.option.column.style[].padding	string	N	열 패딩 값	0px
config.option.column.style[].fontSize	string	N	열 글자 크기	12px
config.option.column.style[].textDecoration	string	N	열 텍스트 장식	none
config.option.column.hidden	string[]	N	숨길 열 이름 배열
config.option.row	object	N	행에 관련한 옵션 설정
config.option.row.style	object[]	N	행 스타일 정의
config.option.row.style[].columnName	string	N	행 스타일 설정 열의 이름
config.option.row.style[].value	string	N	행 스타일 설정 열의 값
config.option.row.style[].fillColor	string	N	행 배경색 (CSS 색상값)	#FFFFFF
config.option.row.style[].fontWeight	string	N	행 텍스트 굵기 (CSS font-weight)	normal
config.option.row.style[].textAlign	string	N	행 텍스트 정렬 (left/center/right)	center
config.option.row.style[].padding	string	N	행 패딩 값 (CSS padding)
config.option.row.style[].fontSize	string	N	행 글자 크기 (CSS font-size)	12px
config.option.row.style[].textDecoration	string	N	행 텍스트 장식 (CSS text-decoration)	none
config.option.row.style[].fillOpacity	float	N	행 배경색 투명도 (0 ~ 1)	1.0

Protocol 구조

{
    section:"report",
    contents:  [
        {
            id: string
            key: value,
        }
    ],
    config: {
        id: string,
        type: string,
        option:{
            title: string,
            note: string,
            column:{
                style:[
                    {
                        name:string,
                        format:string,
                        fontWeight:string,
                        fillColor:string,
                        textAlign:string,
                        padding:string,
                        fontSize:string,
                        textDecoration:string,
                        fillOpacity:string
                    }
                ],
                hidden:string[]
            },
            row:{
                style:[
                    {
                        columnName:string,
                        value:string,
                        fillColor: string,
                        fontWeight: string,
                        textAlign: string,
                        padding: string,
                        fontSize: string,
                        textDecoration: string,
                        fillOpacity:string
                    }
                ]
            }
        }
    }
}

Example

{
  "section": "report",
  "contents": [
    {
      "이름": "니카",
      "나이": 30,
      "직업": "개발자",
      "연봉": 5000
    },
    {
      "이름": "판다",
      "나이": 25,
      "직업": "디자이너",
      "연봉": 4500
    },
    {
      "이름": "하모",
      "나이": 22,
      "직업": "기획자",
      "연봉": 4000
    }
  ],
  "config": {
    "type": "dataframe",
    "option": {
      "title": "스타일이 적용된 테이블",
      "note": "컬럼과 행에 스타일이 적용된 예시입니다",
      "column": {
        "style": [
          {
            "name": "연봉",
            "format": "#,##0 만원",
            "fontWeight": "bold",
            "textAlign": "left",
            "padding": "8px",
            "fillColor": "#e6f7ff",
            "fontSize": "14px",
            "textDecoration": "",
            "fillOpacity": "0.9"
          }
        ]
      },
      "row": {
        "style": [
          {
            "columnName": "직업",
            "value": "개발자",
            "fillColor": "#FFD6E0",
            "fontWeight": "bold",
            "textAlign": "center",
            "padding": "12px",
            "fontSize": "16px",
            "textDecoration": "underline wavy blue",
            "fillOpacity": "0.8"
          },
          {
            "columnName": "나이",
            "value": "25",
            "fillColor": "#C1E1C1",
            "fontWeight": "bold",
            "textAlign": "right",
            "padding": "10px",
            "fontSize": "15px",
            "textDecoration": "overline",
            "fillOpacity": "0.85"
          }
        ]
      }
    },
    "id": "styled_table"
  }
}