Trabajo Angular con gráficos

    La funcionalidad WorksheetChart de Infragistics Angular Excel Engine le permite agregar representaciones gráficas visuales de tendencias de datos en regiones de celdas en una hoja de trabajo. Por ejemplo, si desea ver sus datos de Excel en una región de celdas visualizadas como una columna, una línea o más de 70 tipos de gráficos más, esta función puede ayudarlo a lograrlo.

    Angular Working with Charts Example

    Usage

    Para agregar un gráfico a una hoja de trabajo, debe utilizar el método AddChart de la colección de formas de la hoja de trabajo. En este método, puede especificar el tipo de gráfico que desea utilizar, la celda superior izquierda, la celda inferior derecha y los porcentajes de esas celdas que desea que ocupe el gráfico.

    El método AddChart devuelve el elemento del gráfico de la hoja de trabajo que se agregará a la hoja de trabajo. Una vez que tenga esto, puede usar el método setSourceData en el gráfico para establecer una dirección de celda de la región de celdas de la hoja de cálculo que desea usar como fuente de datos, así como si desea o no cambiar la asignación de columnas y filas al eje X e Y.

    Hay más de 70 tipos de gráficos compatibles, entre ellos Line, Area, IgxColumnComponent, y Pie.

    El siguiente código demuestra cómo utilizar la función de gráficos de Excel. El siguiente fragmento agregará un gráfico de columnas entre la primera celda y la celda 13 en la primera fila de la hoja de trabajo. Luego, los datos de origen se configuran para los datos en la región de A2:M6, cambiando la asignación de columnas y filas para los ejes X e Y del gráfico de columnas:

    var chart = ws.shapes().addChart(ChartType.ColumnClustered,
      ws.rows(0).cells(0), { x: 0, y: 0 },
      ws.rows(0).cells(12), { x: 100, y: 100 });

chart.setSourceData("A2:M6", true);

    API References