Tutorial: Crear un gráfico básico (Controles Chart)
Este tutorial muestra cómo agregar un gráfico, mediante el control Chart, a una aplicación web o de Windows Forms y, a continuación, agregar datos, título, leyendas y anotaciones al gráfico.
Agregar un control Chart
Siga los pasos que se indican a continuación para agregar un control de gráfico a sus formularios de Windows Forms para una aplicación web.
Para agregar un control de gráfico a una aplicación
En la vista de diseño, abra el Cuadro de herramientas.
Desde la categoría Datos, arrastre un control Chart hasta el área de diseño.
Si no puede ver el control Chart en el Cuadro de herramientas, haga clic con el botón secundario del mouse en el Cuadro de herramientas, seleccione Elegir elementos y, a continuación, seleccione los siguientes espacios de nombres en la pestaña Componentes de .NET Framekwork:
Nota
Para encontrar el control Chart en el Cuadro de herramientas más fácilmente, oculte los controles inactivos. Para ello, haga clic con el botón secundario del mouse en el Cuadro de herramientas y desactive la opción Mostrar todo.
Haga clic con el botón secundario sobre el control Chart en el área de diseño y seleccione Propiedades.
En la ventana Propiedades, haga clic en el botón Por categorías.
En la categoría Gráfico de la ventana Propiedades, haga clic en la propiedad de colección ChartAreas y, a continuación, haga clic en el botón de puntos suspensivos (…). Esto abre el Editor de colecciones ChartAreas.
La colección ChartAreas (un objeto ChartAreaCollection) contiene todas las áreas de gráfico del control Chart. Observe que la colección ya contiene una área de gráfico denominada "ChartArea1".
Haga clic en Agregar y, a continuación, en Aceptar. Un nuevo objeto ChartArea se agrega a la colección con el nombre predeterminado "ChartArea2".
Observe que el gráfico en el área de diseño se reduce a la mitad de su tamaño original. Esto se debe a que el área del gráfico recién creada se coloca en la parte inferior, pero aún no contiene una serie de datos.
En la ventana Propiedades, haga clic en la colección Series y, a continuación, haga clic en el botón de puntos suspensivos. Esto abre el Editor de colecciones de series.
La colección de series (un objeto SeriesCollection) contiene todas las series de datos del control Chart. Observe que la colección ya contiene una serie denominada "Series1".
En el Editor de colecciones de series, haga clic en Agregar y, a continuación, establezca las siguientes propiedades para el objeto Series recién creado:
Propiedad
Valor
ChartArea
ChartArea2
ChartType
Bar
Name
BarChart
Haga clic en Aceptar y, a continuación, vuelva a hacer clic en Aceptar.
Ahora existen varias áreas de gráfico y cada una contiene una serie de datos. Sin embargo, no verá nada al ejecutar su aplicación porque las series no tienen datos todavía.
Agregar datos al gráfico
Siga los pasos que se indican a continuación para agregar datos al control Chart recién creado.
Para agregar datos al gráfico
Abra de nuevo el Editor de colecciones de series.
En el área Miembros, seleccione Series1.
En la categoría Datos del área de propiedades de Series1, haga clic en la propiedad de la colección de puntos y, a continuación, haga clic en el botón de puntos suspensivos. Esto abre el Editor de colecciones DataPoint.
La colección de puntos (un objeto DataPointCollection) contiene todos los puntos de datos de la serie actual.
En el Editor de colecciones DataPoint, haga clic en Agregar y, a continuación, asigne un valor a la propiedad YValues del objeto DataPoint recién creado.
Repita este paso hasta que tenga cinco puntos de datos en la colección.
Haga clic en Aceptar y, a continuación, repita los pasos anteriores para agregar puntos de datos a la serie de BarChart.
En el Editor de colecciones de series, haga clic en Aceptar.
Ejecute la aplicación.
Ahora puede ver dos áreas de gráfico en el control Chart que muestran los puntos de datos creados en las dos series. Observe los tipos de gráfico diferentes de las dos series.
Agregar leyendas al gráfico
Siga los pasos que se indican a continuación para agregar una leyenda para cada una de las series que ha creado.
Para agregar una leyenda para cada serie
En la categoría Gráfico de la ventana Propiedades, haga clic en la propiedad de colección de Leyendas y, a continuación, haga clic en el botón … situado a la derecha. Esto abre el Editor de colecciones de leyendas.
La colección de leyendas (un objeto LegendCollection) contiene todas las leyendas del control Chart.
Si no hay ninguna leyenda en el Editor de colecciones de leyendas, haga clic en Agregar.
Establezca las siguientes propiedades para el objeto Legend:
Propiedad
Valor
DockedToChartArea
ChartArea1
Docking
Right
IsDockedInsideChartArea
False
Haga clic de nuevo en Agregar y, a continuación, establezca las siguientes propiedades para el objeto Legend recién creado:
Propiedad
Valor
DockedToChartArea
ChartArea2
Docking
Right
Haga clic en Aceptar.
Observe que en el área de diseño, la segunda leyenda se muestra vacía. De forma predeterminada, ambas series se asignan a la primera leyenda. Puede asignar cada serie a una leyenda diferente.
Abra de nuevo el Editor de colecciones de series.
En el área Miembros, seleccione BarChart.
En la categoría Leyenda del área de propiedades de BarChart, en la lista desplegable de la propiedad Legend, seleccione Legend2.
Haga clic en Aceptar.
Ejecute la aplicación.
Agregar un título al gráfico
Siga los pasos que se indican a continuación para agregar un título al gráfico.
Para agregar un título al gráfico
En la categoría Gráfico de la ventana Propiedades, haga clic en la propiedad de colección Títulos y, a continuación, haga clic en el botón de puntos suspensivos. Esto abre el Editor de colecciones de títulos.
La colección de títulos (un objeto TitleCollection) contiene todos los títulos incluidos en el control Chart.
En el Editor de colecciones de leyendas, haga clic en Agregar.
En la categoría Apariencia del área de propiedades de Title1, escriba un título del gráfico en la propiedad Text.
Haga clic en Aceptar.
Ejecute la aplicación.
Marcar un punto de datos con una anotación
Siga los pasos que se indican a continuación si desea utilizar una anotación para marcar un punto de datos en el gráfico.
Para marcar un punto de datos con una anotación
En la categoría Gráfico de la ventana Propiedades, haga clic en la propiedad de colección de Anotaciones y, a continuación, haga clic en el botón de puntos suspensivos. Esto abre el Editor de colecciones de anotaciones.
La colección de anotaciones (un objeto AnnotationCollection) contiene todas las anotaciones incluidas en el control Chart.
En el Editor de colecciones de anotaciones, haga clic en la flecha Agregar y seleccione ArrowAnnotation.
En la categoría Delimitador del área de propiedades de ArrowAnnotation1, haga clic en la flecha de AnchorDataPoint y seleccione el primer punto de datos de Series1.
Establezca las siguientes propiedades para el objeto Legend recién creado:
Propiedad
Valor
Height
-5
Width
0
AnchorOffSetY
-2,5
En la categoría Varios, expanda la propiedad SmartLabelStyle y establezca su propiedad IsOverlappedHidden en False.
Haga clic en Aceptar.
Ejecute la aplicación.
Paso siguiente
Ha aprendido cómo agregar un gráfico, mediante el control Chart, a una aplicación web o de Windows Forms y, a continuación, agregar datos, título, leyendas y anotaciones al gráfico. Para obtener información sobre cómo utilizar los gráficos 3D, vea Tutorial: Cambiar a un gráfico 3D.
Vea también
Referencia
System.Windows.Forms.DataVisualization.Charting
System.Web.UI.DataVisualization.Charting