[#1242] Chart > Zoom in, out 기능

[Mun94]

1차 개발

  [기능]
    1. Drag Zoom
      - 차트를 그룹으로 사용 할 경우 ev-chart-group 컴포넌트로 zoom 옵션을 설정하고 차트들을 감싸거나 차트를 개별로 사용 할 경우 ev-chart 옵션에 zoom 옵션을 설정하면 됨. 
      - Zoom 활성화
        a. point 하나만 drag 했을 경우 x축 drag 좌우 영역 계산 후 가까운 날로 줌 실행
        b. 줌 영역 이동
           i. 마우스 wheel을 이용한 줌 영역 이동 
        c. 이전, 최근 줌 영역으로 이동
           i. 우측 상단 previous, latest 아이콘을 이용하여 이동 (크롬 이전, 다음 페이지로 이동 기능 참고)
        d. 줌 에니메이션 (AMChart 줌 에니메이션 참고)
      - Zoom 비활성화
        a. 기존 ev-chart 이벤트 사용 가능
        b. zoom 관련 모든 기능 사용 불가
      
    2. 우측 상단 아이콘
      - 줌 초기화, 이전 / 최근 줌 영역으로 이동, 드래그 줌
      - chartZoomOption에 따라 ev-icon 변경 가능(아이콘 모양, 사이즈, 색상, hover 색상)
      - 사용 가능한 아이콘 enable, disable 스타일 처리
        a. zoomMode일 경우 아이콘 활성화 / zoomMode가 아닐 경우 아이콘 비활성화로 스타일 처리 (zoom 관련 모든 기능 사용 불가) 
        b. zoomMode일 경우 새로고침(reset)아이콘은 항상 활성화 상태
        c. zoom을 실행했던 값이 있으면 previous 아이콘이 활성화 되고 최근으로 이동할 값이 있으면 latest 아이콘 활성화

    3. this.zoomAreaMemory 버퍼 메모리 제한
      - 버퍼 메모리 제한 default 값으로 100으로 설정 (배열 length 100)
      - chartZoomOptions에 bufferMemoryCnt로 버퍼값 사용자가 설정할 수 있도록 추가 (테스트 가능한 줌 버퍼 메모리 InputNumber 추가)
      - ex. 버퍼 메모리 제한이 5일 경우 최근 5개 기록만 확인 가능

    4. 데이터 업데이트 버튼 생성 
      - 새로운 데이터 조회 후 반응 확인용
      - 랜덤한 값(length 1 ~ 100개)의 차트 데이터로 업데이트 됨
      - 데이터가 1개 밖에 없는 차트일 경우 zoomMode 사용 불가

    5. 양방향으로 zoomStartIdx와 zoomEndIdx 조절 가능

    6. zoom 관련 Chart > zoomChart 메뉴 생성

  [확인경로]
   - Chart > zoomChart

[baejihoon]

zoom 컴포넌트가 내부 chart 의 data, label, option 등을 각각 변경하면서 동작하나 보군요
고생하셨습니다