VIEW TYPE 자세히 살펴보기

작업 영역에서 VIEW를 선택하면 오른쪽 DESIGN 패널에 VIEW TYPE 정보가 표시되거나 VIEW TYPE을 선택할 수 있습니다.

VIEW TYPE 목록에서 파란색 테두리로 표시된 항목 왼쪽 아래의 연필 모양 아이콘을 클릭하면 수정할 수 있는 속성 목록(OPTION)이 새 창으로 표시됩니다.

이번 장은 선택할 수 있는 VIEW TYPE 목록과 VIEW TYPE에서 편집할 수 있는 OPTION 항목에 대해 설명합니다.

일반 양식

검색창 - search

OPTION

기본값

설명

Label Width(px)

108

라벨 너비

Field Width(px)

140

입력 필드 너비

Field Height(px)

34

입력 필드 높이

Button Text

조회

검색 버튼 text

Button Position

bottom

검색 버튼 위치

none: 버튼 표시 안함

top: View 영역 상단에 표시

middle: View 영역 중앙에 표시

bottom: View 영역 하단에 표시

full: View 영역 높이 가득 차게 표시

검색창 - search_vertical

OPTION

기본값

설명

Label Width(px)

108

라벨 너비

Field Width(px)

140

입력 필드 너비

Field Height(px)

34

입력 필드 높이

Button Text

조회

검색 버튼 text

Button Position

bottom

검색 버튼 위치

none: 버튼 표시 안함

top: View 영역 상단에 표시

middle: View 영역 중앙에 표시

bottom: View 영역 하단에 표시

full: View 영역 높이 가득 차게 표시

목록 - free_view

OPTION

기본값

설명

Title Text

Title

제목

Column Count

3

한 행에 표시할 칼럼 개수

Label Width(px)

108

라벨 칼럼 너비

Field Height(px)

34

행 높이

목록 - free

OPTION

기본값

설명

Title Text

Title

제목

Column Count

3

한 행에 표시할 칼럼 개수

Label Width(px)

108

라벨 칼럼 너비

Field Height(px)

34

행 높이

일정 - schedule

OPTION

기본값

설명

Title Text

Title

제목

Calendar Position

horizontal

달력 위치 설정

horizontal: 가로 방향으로 왼쪽부터 달력, 일정 표시

vertical: 세로 방향으로 위쪽부터 달력, 일정 표시

only: 달력만 표시

버튼 - button

OPTION

기본값

설명

Column Count

3

한 행에 표시할 버튼 개수

Icon Position

top

버튼 아이콘 위치 설정

left: 가로 방향으로 왼쪽부터 아이콘, 텍스트 표시

right: 가로 방향으로 왼쪽부터 텍스트, 아이콘 표시

top: 세로 방향으로 위쪽부터 아이콘, 텍스트 표시

bottom: 세로 방향으로 위쪽부터 텍스트, 아이콘 표시

로그인 - login

OPTION

기본값

설명

Label Width(px)

108

라벨 너비

Field Height(px)

34

입력 필드 높이

Label Position

vertical

라벨, 입력 필드 위치 설정

horizontal: 가로 방향으로 왼쪽부터 라벨, 입력 필드 표시

vertical: 세로 방향으로 위쪽부터 라벨, 입력 필드 표시

Button Text

로그인

로그인 버튼 text

Button Height(px)

60

로그인 버튼 높이

포털 메인 - portal

OPTION

기본값

설명

Field Height(px)

34

입력 필드 높이

이미지 - image

OPTION

기본값

설명

Column Count

3

한 행에 표시할 이미지 개수

Image Stretch

fixaspectratio

이미지 축소, 확대 비율 설정

none: 원본 이미지 그대로 표시

fit: VIEW 영역에 가득차게 표시하도록 원본 이미지의 너비, 높이를 조정

fixaspectratio: 원본 이미지 너비, 높이 비율을 유지하며 VIEW 영역에 최대한 가득차게 표시하도록 원본 이미지의 너비, 높이를 조정

표

일반 - table

OPTION

기본값

설명

Title Text

Title

제목

Head Height(px)

32

제목 행 높이

Body Height(px)

32

데이터 행 높이

Summary Height(px)

0

합계 행 높이

Field Width(px)

80

칼럼 너비

Autofit

true

가로 스크롤 없이 표시되도록 칼럼 너비 자동 조정

Auto Size

none

줄바꿈 처리 여부

none: 줄바꿈 하지 않음

autosize-wordwrap: 칼럼 너비보다 표시할 데이터가 긴 경우 줄바꿈 처리

Suppress

false

같은 칼럼 내에서 데이터가 같은 행을 병합해 표시할지 여부

트리 - table_tree

OPTION

기본값

설명

Title Text

Title

제목

Head Height(px)

32

제목 행 높이

Body Height(px)

32

데이터 행 높이

Summary Height(px)

0

합계 행 높이

TreeField Width(px)

200

트리를 표시하는 칼럼 너비

Field Width(px)

80

칼럼 너비(트리를 표시하는 칼럼 제외)

Autofit

true

가로 스크롤 없이 표시되도록 칼럼 너비 자동 조정

Auto Size

none

줄바꿈 처리 여부

none: 줄바꿈 하지 않음

autosize-wordwrap: 칼럼 너비보다 표시할 데이터가 긴 경우 줄바꿈 처리

Expand All/Collapse All

true

화면 실행 시 트리의 상태를 설정

대시보드 - table_dashboard

OPTION

기본값

설명

Title Text

Title

제목

Body Height(px)

32

데이터 행 높이

Auto Size

none

줄바꿈 처리 여부

none: 줄바꿈 하지 않음

autosize-wordwrap: 칼럼 너비보다 표시할 데이터가 긴 경우 줄바꿈 처리

Suppress

false

같은 칼럼 내에서 데이터가 같은 행을 병합해 표시할지 여부

카드

카드 - card_normal

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Field Height(px)

40

입력 필드 높이

카드 - card_rowfit

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

카드 - card_detail

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Detail Label Width(px)

100

상세 데이터 라벨 너비

Field Height(px)

40

입력 필드 높이

카드 - card

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Field Height(px)

40

입력 필드 높이

카드 - card_leftimage

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Field Height(px)

40

입력 필드 높이

카드 - card_topimage

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Field Height(px)

40

입력 필드 높이

카드 - card_leftimage_dashboard

OPTION

기본값

설명

Title Text

Title

제목

Label Width(px)

100

라벨 너비

Field Height(px)

40

입력 필드 높이

차트

차트에서 공통으로 사용하는 OPTION입니다. 각 차트에서는 공통 OPTION을 제외한 항목만 설명합니다.

OPTION

기본값

설명

Title Text

Title

제목

Color Palettes

basic

차트 색상

blue: 파란색 계열 색상

purple: 보라색 계열 색상

rainbow: 무지개색 색상

basic: 기본 색상

Legend Position

rightcenter

범례 표시 위치 설정

none: 범례 표시하지 않음

표시위치(top, bottom, left, right)와 정렬(left, center, right 또는 top, center, bottom) 형식으로 설정

세로 막대형 - barchart

OPTION

기본값

설명

Display Type

grouped

grouped: 그룹으로 묶어서 개별 막대로 값 표시

stacked: 개별 막대를 쌓아가는 형태로 값 표시100%stacked: 전체 값을 100을 기준으로 나누어 stakced 형태로 표시

Categoryaxis Text

-

항목(가로축) 제목 설정

Valueaxis Text

-

값(세로축) 제목 설정

가로 막대형

OPTION

기본값

설명

Display Type

grouped

grouped: 그룹으로 묶어서 개별 막대로 값 표시

stacked: 개별 막대를 쌓아가는 형태로 값 표시

100%stacked: 전체 값을 100을 기준으로 나누어 stakced 형태로 표시

Categoryaxis Text

-

항목(세로축) 제목 설정

Valueaxis Text

-

값(가로축) 제목 설정

영역형

OPTION

기본값

설명

Display Type

grouped

grouped: 그룹으로 묶어서 개별 영역으로 값 표시

stacked: 개별 영역을 쌓아가는 형태로 값 표시

100%stacked: 전체 값을 100을 기준으로 나누어 stakced 형태로 표시

Line Style

curve

각 항목의 영역을 연결하는 라인 형태 설정

segment: 직선 형태로 표시

step: 계단 형태로 표시

curve: 곡선 형태로 표시

Categoryaxis Text

-

항목(가로축) 제목 설정

Valueaxis Text

-

값(세로축) 제목 설정

묶은 세로 막대형 - 꺽은선형

OPTION

기본값

설명

Categoryaxis Text

-

항목(가로축) 제목 설정

Valueaxis Text

-

값(세로축) 제목 설정

꺽은선형

OPTION

기본값

설명

Line Style


각 항목 값을 연결하는 라인 형태 설정

segment: 직선 형태로 표시

step: 계단 형태로 표시

curve: 곡선 형태로 표시

Categoryaxis Text

-

항목(가로축) 제목 설정

Valueaxis Text

-

값(세로축) 제목 설정

원형

도넛형

OPTION

기본값

설명

Inner Radius

50

차트 안쪽 여백의 반지름을 설정

Inner Text

-

차트 안쪽 여백에 표시할 텍스트를 설정