Web Components 스프레드시트 개요

    Web Components 스프레드시트(Excel 뷰어) 구성 요소는 가볍고 기능이 풍부하며 과학, 비즈니스, 금융 등 모든 유형의 스프레드시트 데이터를 운영, 시각화 및 편집하는 데 필요한 모든 옵션이 함께 제공됩니다. 모든 정보는 셀, 창, 워크시트에서 직관적이고 쉽게 탐색할 수 있는 표 형식으로 표시될 수 있습니다. IgcSpreadsheetComponent는 유연한 Excel과 유사한 인터페이스, 상세한 차트 및 활성화, 셀 편집, 조건부 서식, 스타일 지정, 선택, 클립보드와 같은 기능으로 보완됩니다.

    Web Components Spreadsheet Example

    Functionality

    • 특징

    Excel 스프레드시트와 마찬가지로 필터링 기능, 정렬, 셀 이동, 셀 색상 관련 사용자 정의, 키보드 단축키를 적용하고 수식 계산 기능도 추가할 수 있습니다.

    Spreadsheet Usage

    • 성능

    스프레드시트는 모든 최신 브라우저와 호환되며 복잡하고 방대한 스프레드시트 모델에 최적화되어 있으면서도 완벽한 기능과 단순성을 보장합니다.

    • 유연한 레이아웃과 손쉬운 사용자 정의

    원하는 기능을 쉽게 선택, 추가, 제거하고 전환하고, React 시트를 즉시 구성하여 최종 사용자의 요구에 부응할 수 있습니다. 구성 가능한 라이브러리, 스타일 및 형식 지정 대안, 가시성 옵션, 선택할 수 있는 다양한 테마도 있습니다.

    • Excel과 유사한 편리한 인터페이스

    Excel의 데이터 작업과 마찬가지로 스프레드시트 구성 요소는 잘 알려진 Excel 클립보드 작업(복사, 붙여넣기, 잘라내기)을 모두 제공합니다. 즉시 사용하기 위해 추가 교육이나 새로운 기술이 필요하지 않습니다. 또한 정렬, 전체 키보드 탐색, 값 및 수식, 셀 끌기, 열 및 행 편집, 필터링, 숫자 서식 지정, 크기 조정 옵션도 제공됩니다. 스마트하고 빠른 계산 엔진은 가장 복잡한 추정도 가능하게 합니다. Excel에 종속되지 않습니다.

    • 데이터 작업

    과학, 비즈니스, 엔지니어링, 금융, 교육 데이터를 수집하고 관리합니다. 분석, 고급 그리드, 보고서, 데이터 입력 양식, 예산 책정, 예측 시나리오, 사용자 정의 스프레드시트를 준비하고 생성합니다. 이 모든 것은 포괄적인 API 덕분입니다.

    • 빠르고 안전한 데이터 처리

    스프레드시트를 사용하면 데이터 처리가 100% 안전하고 안전합니다…

    • Excel 및 CSV 가져오기 및 내보내기

    내장된 Excel 가져오기/내보내기 기능을 사용하면 Excel 문서를 즉시 로드 및 열고 필요할 때 볼 수 있으며 변경 사항을 추가하고 저장할 수 있습니다. 또한 완성된 Excel .xlsx 스프레드시트를 쉽게 내보낼 수 있습니다.

    Dependencies

    Web Components 스프레드시트 구성 요소를 설치할 때 핵심 및 Excel 패키지도 설치해야 합니다.

    npm install --save igniteui-webcomponents-core
    npm install --save igniteui-webcomponents-excel
    npm install --save igniteui-webcomponents-spreadsheet
    

    Component Modules

    IgcSpreadsheetComponent 에는 다음 모듈이 필요합니다.

    // Module Manager for registering the modules of the chart
    import { ModuleManager } from 'igniteui-webcomponents-core';
    // spreadsheet's modules
    import { IgcExcelModule } from 'igniteui-webcomponents-excel';
    import { IgcSpreadsheetModule } from 'igniteui-webcomponents-spreadsheet';
    
    // register the modules
    ModuleManager.register(
        IgcExcelModule,
        IgcSpreadsheetModule
    );
    

    Usage

    이제 Web Components 스프레드시트 모듈을 가져왔으므로 다음은 스프레드시트의 기본 구성입니다.

    <igc-spreadsheet id="spreadsheet" height="500px" width="100%">
    </igc-spreadsheet>
    

    [!Note]

    In the following code snippet, an external ExcelUtility class is used to save and load a workbook.

    다음은 Web Components 스프레드시트에 통합 문서를 로드하는 방법을 보여줍니다.

    import { IgcSpreadsheetComponent } from 'igniteui-webcomponents-spreadsheet';
    import { Workbook } from 'igniteui-webcomponents-excel';
    import { ExcelUtility } from "./ExcelUtility";
    
    // ...
    
    let spreadsheet = (document.getElementById("spreadsheet") as IgcSpreadsheetComponent);
    
    const excelFile = '../../assets/Sample1.xlsx';
    ExcelUtility.loadFromUrl(excelFile).then((w: Workbook) => {
        spreadsheet.workbook = w;
    });
    

    API References