Descripción general de la hoja de cálculo Web Components
El componente Web Components Spreadsheet (visor de Excel) es liviano, tiene muchas funciones y cuenta con todas las opciones necesarias para operar, visualizar y editar todo tipo de datos de hojas de cálculo: científicos, comerciales, financieros y más. Toda la información se puede presentar en un formato tabular que resulta intuitivo y fácil de navegar a través de celdas, paneles y hojas de trabajo. El IgcSpreadsheetComponent
se complementa con una interfaz flexible similar a la de Excel, gráficos detallados y funciones como activación, edición de celdas, formato condicional, estilo, selección y portapapeles.
Web Components Spreadsheet Example
Functionality
- Características
Al igual que en la hoja de cálculo de Excel, puede aplicar funciones de filtrado, clasificación, mover celdas, personalización en términos de color de celdas, atajos de teclado y agregar la capacidad de incluso calcular fórmulas.
Spreadsheet Usage
- Actuación
La hoja de cálculo es compatible con todos los navegadores modernos y está optimizada para modelos de hojas de cálculo complejos y voluminosos, al tiempo que garantiza una funcionalidad y simplicidad impecables.
- Diseño flexible y fácil personalización
Puede seleccionar, agregar, eliminar, activar o desactivar fácilmente las funciones que desee y configurar hojas React en un instante para que todo responda a las necesidades de los usuarios finales. También hay bibliotecas configurables, alternativas de estilo y formato, opciones de visibilidad y muchos temas para elegir.
- Cómoda interfaz tipo Excel
Al igual que operar datos en Excel, nuestro componente de hoja de cálculo ofrece todas las operaciones conocidas del portapapeles de Excel: copiar, pegar, cortar. No necesitarás formación adicional ni nuevas habilidades para empezar a utilizarlo de inmediato. También viene con opciones para ordenar, navegación completa con el teclado, valores y fórmulas, arrastrar celdas, editar columnas y filas, filtrar, formatear números y cambiar el tamaño. El motor de cálculo rápido e inteligente impulsa incluso las estimaciones más complejas. Sin dependencias de Excel.
- Operaciones de datos
Recopile y administre datos científicos, comerciales, de ingeniería, financieros y educativos. Prepare y cree análisis, cuadrículas avanzadas, informes, formularios de entrada de datos, elaboración de presupuestos, escenarios de previsión y hojas de cálculo personalizadas. Todo esto gracias a la API integral.
- Procesamiento de datos rápido y seguro
Con nuestra hoja de cálculo, el procesamiento de datos es 100% seguro y protegido...
- Importación y exportación de Excel y CSV
Con la funcionalidad incorporada de importación/exportación de Excel, puede cargar y abrir instantáneamente documentos de Excel y verlos a pedido, agregar cambios y guardarlos. Además, exporte sin esfuerzo sus hojas de cálculo Excel .xlsx completas.
Dependencies
Al instalar el componente de hoja de cálculo Web Components, también se deben instalar el paquete principal y de Excel.
npm install --save igniteui-webcomponents-core
npm install --save igniteui-webcomponents-excel
npm install --save igniteui-webcomponents-spreadsheet
Component Modules
El IgcSpreadsheetComponent
requiere los siguientes módulos:
// 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
Ahora que se importa el módulo de hoja de cálculo Web Components, lo siguiente es la configuración básica de la hoja de cálculo.
<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
.
A continuación se muestra cómo cargar un libro de trabajo en la hoja de cálculo 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;
});