Konva.js 라이브러리 사용기

콘바는?

Konva
데스크톱 및 모바일 응용 프로그램에 대한 캔버스 상호 작용을 활성화 하여 2D 컨텍스트를 확장하는 HTML5 Canvas JavaScript 프레임워크입니다 .

 

Konva고성능 애니메이션, 전환, 노드 중첩, 계층화, 필터링,
캐싱, 데스크탑 및 모바일 애플리케이션을 위한 이벤트 처리 등을 가능하게 합니다.

 

응용 프로그램에서 수천 개의 도형을 사용하는 경우에도 스테이지에 항목을 그리고 이벤트 리스너를 추가하고
다른 도형과 독립적으로 이동하고 크기를 조정하고 회전하여 고성능 애니메이션을 지원할 수 있습니다.

 

1. transformline

- transformline 플러그인을 사용하여 마우스로 인터렉티브한 이미지 조작가능

2. konva.animation 

- 라이브러리 내에 requestanimationFrame을 상황에 맞게 적용 시켜 놓은 메소드

3. Tween 

- 애니메이션의 easing 효과 , duration 을 설정할 수 있는 애니메이션 메소드

트러블 : Canvas에 500개이상의 이미지를 띄우면 Frame이 저하되는 현상 발생