-
- Notifications
You must be signed in to change notification settings - Fork 447
Image Map
Sung Gyun Oh edited this page Jul 24, 2018 · 1 revision
- 맵에 이미지 업로드가 가능 해야한다.
- 이미지맵 내부에서 여러개의 맵을 추가 할 수 있어야 한다.
- 이미지는 맵에 고정 될 수 있어야 한다.
- 레이어 컴포넌트를 드래그/드랍으로 맵으로 위치 시킬 수 있어야 한다.
- 레이어 컴포넌트는 목록에서 종류에 따라 클릭시 맵에 추가되거나 그리기의 경우 연속적인 클릭이 지원되어야 한다.
- 멥과 이미지, 레이어 컴포넌트는 같은 스케일로 줌 인/아웃이 될 수 있어야 한다.
- 레이어 컴포넌트는 각종 이벤트를 지원해야 한다
- 드래그/드랍
- 리사이즈
- 로테이션
- 클릭
- 호버
- 이미지와 레이어 컴포넌트는 단일 대상이 선택 되었을 경우, 속성 정보를 수정/저장을 할 수 있어야 한다.
- Polygon, Line, Rect, Circle 등 도형 레이어 컴포넌트를 그릴 수 있어야 한다.
- 레이어 컴포넌트는 다중 선택을 통해 그룹화할 수 있어야 한다.
- 맵에 추가된 컴포넌트들은 트리 형태로 관리 되어, 트리에서 컴포넌트 추가/삭제/이동이 가능할 수 있어야 한다.
- 유틸성 기능을 포함한 툴바를 지원해야 한다.
- 마우스 커맨드 (기본, 그립, 셀렉션)
- 정렬 (좌, 우, 중앙, 수직, 수평)
- 줌 (인, 아웃, 1:1)
- Undo/Redo
- JSON 포맷으로 Export/Import가 가능해야 한다.
- 레이어 컴포넌트는 상태를 정의 하여, 해당 상태를 동작 시킬 수 있어야 한다.
- 다른 맵으로 이동
- 외부 경로로 이동
- 다른 대시보드로 이동
- 리소스 이동
- 다른 위젯이나 해당 이미젯 위젯 내에 리소스, 리소스타입, 지표 필터
- 최종적으로 위젯 편집 후, 저장이 가능해야 한다.
- 맵에 놓여진 레이어 컴포넌트는 상태가 정의 되어 있을 경우, 해당 상태를 동작 시킬 수 있어야 한다.
- 다른 맵으로 전환
- 외부 경로로 이동
- 다른 대시보드로 이동
- 리소스 이동
- 다른 위젯이나 해당 이미젯 위젯 내에 리소스, 리소스타입, 지표 필터
- 이미지맵 위젯에서는 다른 맵으로 전환 시킬 수 있다.
- 위젯 리사이즈시, 맵의 스케일과 맵의 넓이 능동적 변경
- 편집 전용 유틸성 기능들이 제거되어야 한다.
- 지표를 선택할 수 있는 레이어 컴포넌트는 기간 및 실시간 선택에 따른 조회가 가능해야 한다.
- 드래그/드랍
- 줌 인/아웃
- 셀렉션
- 클릭
- Copy/Paste
- Undo/Redo
- 리사이즈
- 로테이션
- 정렬
- 도형 그리기
- 맵 관리
- 맵 추가/수정/삭제
- 컴포넌트 관리
- 트리 제공
- 툴팁 설명 제공
- 추가/복제/삭제/위치 이동/리사이즈/로테이션/그룹화
- 컴포넌트 속성 관리
- 툴팁 설명 제공
- 초기화/수정/저장/커스텀 툴팁
- Context Menu
- 추가/복제/삭제
- 순서 변경
- 툴바
- 마우스 커맨드 (기본, 그립, 셀렉션)
- 정렬 (좌, 우, 중앙, 수직, 수평)
- 줌 (인, 아웃, 1:1)
- Undo/Redo
- 복제
- 삭제
- 위젯
- Import/Export
- Preview
- 취소/저장
- 컴포넌트 관리
- Internal Link
- Map
- Resource
- Dashboard
- External Link
- URL
- Filter
- 툴팁 제공
- Internal Link
- 위젯
- Map Combobox
- Fullscreen
- 위젯
- 일반 위젯 속성
- 툴팁
- Enabled
- Show Action
- Hover
- Click
- Fullscreen
- Zooming
- Enabled Multiple Map
- 맵
- 일반
- Responsive/Fixed
- Name
- Width
- Height
- Rotation
- 이미지
- 파일
- URL
- 일반
- 레이어 컴포넌트
- 일반
- Name
- Width
- Height
- Rotation
- X Position
- Y Position
- Fixed
- Visible
- 꾸미기
- Border
- Color
- Opacity
- Width
- Dashed
- Background
- Color
- Opacity
- Border
- 상태
- Internal Link
- Map
- Dashboard
- Resource
- External Link
- URL
- Filter
- Resource
- ResourceType
- MeasurementDefinition
- Internal Link
- 툴팁
- Enabled
- Show Action
- Hover
- Click
- 텍스트 입력
- Dom Element
- 차트(?)
- 지표 선택
- 임계치 지정
- 차트 위젯의 기본 설정 따라갈 예정
- 테이블
- 지표 선택
- 임계치 지정
- 테이블 위젯 기본 설정 따라갈 예정
- 라벨
- 텍스트 입력
- 마커
- 이미지
- 파일
- URL
- 이미지
- 이미지
- 맵에 크기 맞추기
- 파일
- URL
- 도형
- 그리기 (Polygon, Line, Rect, Circle)
- 일반
GoJS | Fabric.js | Konva | Leaflet | |
|---|---|---|---|---|
GitHub | Not Supported | 10,395 | 2,760 | 21,899 |
Commit | Not Supported | Latest 8 days, 3,910 commits | Latest 4 days, 2,248 commits | Lastest 2 days, 6,582 commits |
React | Not Supported | Not Supported | Support | Support |
Maturity | Very High | High | Middle | Very High |
Document | Very High | High | High | Middle |
Reference | Middle | High | Middle | High |
Difficulty | Low | Middle | Middle | Middle |
Extension | Not Supported | Middle | Middle | Very High |
Licence | Pricing (Buy) | MIT | MIT | BSD-2-Clause |
Cross Browsing | all modern browsers (IE9+), including mobile browsers. | Firefox 2+, Safari 3+, Opera 9.64+, Chrome (all versions), IE10, IE11, Edge | HTML5 canvas supported browser | Chrome, Firefox, Safari 5+, Opera 12+, IE 7–11, including mobild browsers |
Usage | Diagram Editor | Design Editor | Design Editor | Map |
Web Site | GoJS Homepage reference | https://ludus.one | https://pixteller.com | General Supported Map in website |
GoJS | Fabric.js | Konva | Leaflet | |
|---|---|---|---|---|
Responsive | Support | Support | Support | Support |
Normal Event | Support | Support | Support | Support |
Resize | Support | Support | Support | Not Supported |
Rotation | Support | Support | Support | Support |
Grouping | Support | Support | Support | Not Supported |
Multi Select | Support | Support | Support | Not Supported |
Undo/Redo | Support | Not Supported | Not Supported | Not Supported |
Copy/Paste | Support | Not Supported | Not Supported | Not Supported |
Zoom | Support | Support | Support | Support |
Selection | Support | Support | Not Supported | Not Supported |
Alignment | Support | Not Supported | Not Supported | Not Supported |
Tooltip | Support | Support | Support | Support |
Drawing Shapes | Support | Support (Development) | Support (Development) | Support |
Supported SVG | Support | Support | Support | Support |
Supported Export | Support | Support | Support | Support |