ActiveReportsJS: 버전 6.0의 새로운 기능

셀 기반 보고서 디자이너

이제 새로운 셀 기반(Cell-based) 레이아웃 모드를 사용하여 보고서를 디자인할 수 있습니다. 이 모드는 디자인 화면을 셀 그리드로 나누어, 보고서 항목을 배치할 때 스프레드시트처럼 정밀하게 조정할 수 있도록 해줍니다. 특히 Excel로 내보내기 위한 보고서에 매우 유용하며, 생성된 스프레드시트에서 정확한 정렬과 구조를 보장합니다. 자세한 내용은 레이아웃 모드 문서 페이지를 참조하세요. 또한 데모 웹사이트에서 셀 기반 레이아웃으로 설계된 보고서의 예제를 확인할 수 있습니다.

새로운 Excel 내보내기

새로운 Excel 내보내기(Excel Export) 기능은 여러분이 그동안 제기해온 많은 문제를 해결하기 위해 완전히 재설계되었습니다.

• 연속 페이지 및 페이지 경계 없는 레이아웃 유형에서 각 보고서 섹션마다 별도의 시트를 생성합니다.

• 보고서에서 정의한 동일한 서식을 적용하여 숫자 및 날짜 데이터 유형을 그대로 유지합니다.

• 새로운 셀 기반 레이아웃을 활용해 보고서 내용을 정확한 셀 정렬로 표현합니다 — 이제 더 이상 잘게 쪼개진 작은 열과 행은 없습니다!

자세한 내용은 Viewer에서 보고서 내보내기 및 API를 통한 보고서 내보내기 페이지에서 Excel 내보내기를 참고하세요.

API 개선

Report Viewer 컴포넌트

사용자 정의 드롭다운 버튼 추가

이제 Report Viewer 컴포넌트의 툴바에 사용자 정의 드롭다운 버튼을 추가할 수 있습니다. 이 기능을 통해 관련된 작업들을 하나의 툴바 항목 아래에 그룹화하여, 더 깔끔하고 유연한 사용자 인터페이스를 구현할 수 있습니다. 자세한 내용은 Customization 페이지에서 확인하거나, 온라인 데모에서 전체 코드 예제를 살펴보세요.

애니메이션 효과 구성하기

Report Viewer 초기화 옵션과 React, Vue, Angular, Svelte용 Report Viewer 컴포넌트에는 이제 차트와 테이블의 애니메이션 효과를 구성할 수 있는 새로운 animations 속성이 추가되었습니다. 테이블의 경우, onHover 애니메이션을 활성화하고 강조된 행에 대해 텍스트 색상과 배경색을 지정할 수 있습니다. 차트의 경우, onLoad, onHover, highlight 애니메이션을 활성화할 수 있습니다. 이 데모에서는 이러한 애니메이션이 실제로 작동하는 모습을 볼 수 있습니다.

Report Designer 컴포넌트

디자이너 인스턴스 제거

이제 Report Designer API에 새로운 destroy 메서드가 추가되어, UI에서 디자이너 인스턴스를 올바르게 정리할 수 있습니다. React, Angular, Svelte, Vue용 Designer 컴포넌트는 각각의 라이프사이클 이벤트 동안 이 메서드를 자동으로 호출합니다.