 |
|
 |
| 조직도의 유형 |
|
- 기본형 : 모든 조직 및 구성원을 탑다운 계층구조로 표현.
(확대 / 축소 및 구성원의 상세정보를 조회가능)
- 패널형 : 탑다운 방식의 조직형태 + 구성원 리스트를 패널형태로 표현
(확대/축소 및 구성원 상세정보 조회는 동일)
|
| 표현가능한조직형태 |
|
- 단일계층형 : 모든 조직이 하나의 계층구조 아래에 구성됨.
- 계층형 + 보조조직(Assistant Organization) : 계층형 구조에 더하여, 보조조직 이나 태스크포스
조직과 같이 정규조직에서 분리된 조직을 표현하기 위함.
- 복수계층형 : head가 서로 다른 별개의 조직을 동시에 표현할 수 있음.
|
Overview
영역 |
|
- Ovewview는 조직도의 좌측상단 혹은 우측상단에 위치하여, 조직도 전체를 조감키 위한 box 입니다.
- Ovewview영역에서 마우스 드래그를 통해 해당노드로 퀵이동이 가능합니다.
- Ovewview내에 컬러는 각 노드의 status (상태를 나타내는 attribute)를 표시하기때문에, staus 를
파악하기에 편리합니다.
|
| 조직도 속성(확대/축소) |
|
- 조직도는 기본적으로 마우스 휠을 통해 확대/축소를 할 수 있습니다.
- 처음 로딩시에는 부서명+이름 혹은 이름만 표기하여 나타내며, 확대/축소 시에 상세정보로 펼쳐지게 됩니다.
- 각 노드별 속성제어를 통해 확대시에 상세정보로 펼쳐지게 하거나, 펼치지지 않도록 각 노드별로 제어
할 수 있습니다.
- 확대/축소는 마우스휠을 통해서 가능할 뿐 아니라, 외부에서 자바스크립트를 통해서도 제어가 가능합니다.
|
조직도 속성
(색상/CSS
Style) |
|
- 조직도의 각 노드는 색상을 다르게 지정할 수 있습니다.
- 이를통해 서로 다른 조직별로 색상을 구분하거나, 레벨(탑다운의 레벨)별로 구분된 색상을 표시하거나,
특정 조건에 해당하는 조직원에 대하여 색상을 구분하는 등의 기능을 수행할 수 있습니다.
- 색상의 지정은 패널형 조직도에서도 동일합니다.
- 기본형과 패널형, Overview 영역에 CSS style을 적용할 수 있습니다.
|
사용자
정의함수 |
|
자바스크립트를 통해 실시간으로 변경가능한 외부 함수를 제공합니다.
- Fill Function : 노드의 컬러를 자바스크립트를 통해 변경
- Label 및 Text Function : Text란 상세정보를 나타내는 문자열이며, Label이란 상세정보 이전에 대표문자열을
의미합니다. 이 Label 및 Text를 자바스크립트를 통해서 변경이 가능합니다.
- ToolTip Function : 마우스 over시의 툴팁을 자바스크립트를 통해 변경할 수 있습니다.
|
| 이벤트 |
|
- 클릭 이벤트 전달 : 각 노드 혹은 패널에 대하여 이용자의 클릭이벤트를 자바스크립트를 통해 전달해
드립니다. 이를통해 URL이동이나 상세화면 창 띄우기 등의 기능을 수행할 수 있습니다.
- 레벨이벤트 : 조직도는 계층형 구조를 가지기 때문에, 각 계층을 하나의 레벨로 간주할 수 있습니다.
만약 각 계층별로 화면에 보이기/숨기기를 하고자 할 경우, 자바스크립트를 통해서 제어하실 수 있습니다.
- Zoom In/Zoom Out/Fit 이벤트 : 자바스크립트를 통해서 조직도의 확대/축소/화면에 맞추기 기능을 제어할
수 있습니다.
|
조직도
초기화면
제어 |
|
조직도가 처음 로딩될때 다음의 형태로 초기화면을 구성 가능합니다.
- 조직도를 전체화면에 맞추어서(Fit하여) 보이기
- 특정 노드만 보이기
- 노드의 범위( A노드에서 B노드까지)를 보이기
|
| 기타기능 |
|
- 이미지로 저장기능 : 화면에 나타난 조직도를 이미지로 저장할 수 있습니다.
(이미지의 해상도를 자바스크립트를 통해 지정할 수 있습니다.)
- 이펙트 재생시간 조정 : 화면에 로딩시의 이펙트 처리시간을 지정.
- 마우스 휠 (확대/축소)의 감도조정 : 한번의 휠마다 확대/축소되는 간격을 사용자가 지정할 수 있습니다.
- 줌의 최대치/최소치 조정 : 확대/축소시의 최대/최소치를 설정할 수 있습니다.
- 조직도에 로고와 타이틀넣기 : 조직도에 로고, 타이틀 등을 넣을 수 있습니다.
- ItemRenderer 변경 : 패널형 조직도의 패널모양을 랜더러 교체를 통해 바꿀 수 있습니다.
|
레이아웃 및
데이터
연동방식 |
|
레이아웃이란 : 조직도의 외형을 정의하기 위한 XML로서 아래의 내용을 정의합니다.
- 색상 / CSS 스타일 지정 : 조직도 전체의 바탕 컬러나 CSS Style 등을 지정합니다.
- 데이터의 필드명을 지정 : 데이터에서 사용될 필드의 명을 귀사에 맞게끔 지정할 수 있습니다.
- 마우스 휠의 감도 / Zoom 의 최대치,최소치 / Overview 화면의 크기, 위치 등을 지정합니다.
- 자바스크립트 함수를 정의합니다.
- 아이템렌더러를 설정합니다.
- 조직도에 로고 및 라벨넣기 등을 할 수 있습니다.
데이터란 : 조직도의 각 노드에 표현될 실질적인 데이터를 의미합니다.
- 데이터는 Xml 구조로 만들어집니다. Xml의 hierarchy 구조를 통해 각 계층의 레벨을 조정하게 됩니다.
- 데이터에는 실질적인 value 외에, Node의 색상 및 zoom시에 세부정보를 보일지 말지를 결정하는
속성등을 지정할 수 있습니다.
레이아웃 및 데이터 연동방식 : 레이아웃과 데이터는 XML 파일(파일에 대한 URL)로 저장하여 이를 조직도에게
전달하거나, Jsp, Asp, Php, Java, .Net 등에서 String으로 전달하실 수 있습니다.
- String 레이아웃 / String 데이터 - String 레이아웃 / URL(파일) 데이터
- URL(파일)레이아웃 / String 데이터 - URL(파일)레이아웃 / URL(파일)데이터 의 4가지 모두를
사용하실 수 있습니다.
레이아웃 및 데이터의 동적변경 : 레이아웃 및 데이터를 동적으로 변경할 수 있습니다.
이를 통해 웹페이지 재로딩없이, 조직도의 외형이나, 데이터를 교체하실 수 있습니다.
|
