26/10/2008 22:28
El Bruno
[NET] DataVisualization.Charting.Chart: Controles para crear gráficos en .Net
Buenas,
si alguna vez has tenido que agregar capacidades para crear gráficos en alguna aplicación, seguramente habrás optado por pasarle el marrón a otra persona tenido que sufrir a MSChart. Por lo general, una de las opciones más comunes era comprar una biblioteca de clases de otras empresas, o agregar la clásica y popular funcionalidad de exportar a Excel;desde donde nuestros queridos y expertos usuarios podrán crear los gráficos que necesiten.
Desde hace un tiempo existe una biblioteca de clases para .Net que nos pueden ayudar en este tipo de escenarios: Microsoft Chart Controls. Estos links nos pueden ayudar a comenzar a utilizarla:
Como por lo general me gusta probar un poco algo antes de postearlo, me cree una pequeña aplicación con un Chart en un formulario; he aquí mis apuntes.
1. En primer lugar, he agregado un control del tipo DataVisualization.Charting.Chart, al formulario principal de la aplicación.
2. como no tengo ganas de agregar datos a mano, he creado la siguiente función que crea una serie con 5 datos en forma aleatoria.
1 ''' <summary>
2 ''' Gets the random series.
3 ''' </summary>
4 ''' <param name="name">The name.</param>
5 ''' <returns></returns>
6 Public Function GetRandomSeries(ByVal name As String) As Series
7 Dim returnSeries As New Series(name)
8 Dim rnd As New Random()
9 For index As Integer = 1 To 5
10 returnSeries.Points.Add(rnd.Next(0, 100))
11 Next
12 Return returnSeries
13 End Function
2. A continuación, para crear un gráfico simple de barras con 2 series, en el evento Load() del form, agrego las siguientes líneas
1 ' crear y agregar el chart area
2 Dim chartArea1 As New ChartArea("ChartArea1")
3 chartViewer.ChartAreas.Add(chartArea1)
4 ' añadir datos
5 chartViewer.Series.Add(GetRandomSeries("serie 1"))
6 chartViewer.Series.Add(GetRandomSeries("serie 2"))
y podemos ver un gráfico como el de la siguiente imagen.
3. Si agrego 2 series más de datos, con el siguiente código
1 ' crear y agregar el chart area
2 Dim chartArea1 As New ChartArea("ChartArea1")
3 chartViewer.ChartAreas.Add(chartArea1)
4 ' añdir datos
5 chartViewer.Series.Add(GetRandomSeries("serie 1"))
6 chartViewer.Series.Add(GetRandomSeries("serie 2"))
7 chartViewer.Series.Add(GetRandomSeries("serie 3"))
8 chartViewer.Series.Add(GetRandomSeries("serie 4"))
el gráfico muestra un nuevo set de datos
4. Si por ejemplo, deseo organizar las series de datos en 2 áreas separadas, y agregar un titulo con formato al Chart, el siguiente código lo hace posible
1 ' crear y agregar el chart area
2 Dim chartArea1 As New ChartArea("ChartArea1")
3 Dim chartArea2 As New ChartArea("ChartArea2")
4 chartViewer.ChartAreas.Add(chartArea1)
5 chartViewer.ChartAreas.Add(chartArea2)
6
7 ' añadir datos
8 chartViewer.Series.Add(GetRandomSeries("serie 1"))
9 chartViewer.Series.Add(GetRandomSeries("serie 2"))
10 chartViewer.Series.Add(GetRandomSeries("serie 3"))
11 chartViewer.Series.Add(GetRandomSeries("serie 4"))
12
13 chartViewer.Series(0).ChartArea = "ChartArea1"
14 chartViewer.Series(1).ChartArea = "ChartArea1"
15 chartViewer.Series(2).ChartArea = "ChartArea2"
16 chartViewer.Series(3).ChartArea = "ChartArea2"
17
18 ' apariencia del char
19 Dim titleChart As Title = chartViewer.Titles.Add("Titulo del chart")
20 titleChart.ForeColor = Color.Blue
21 titleChart.Font = New Font(titleChart.Font, FontStyle.Bold)
22 titleChart.TextStyle = TextStyle.Shadow
y el gráfico se divide en "2 gráficos" con un título en la sección superior.
5. Finalmente si quiero mostrar una de las secciones del Chart, en barras 3D, debo modificar una de las ChartArea
1 ' 3D charts
2 chartArea1.Area3DStyle.Enable3D = True
3 chartArea2.Area3DStyle.Enable3D = False
y el gráfico queda como en la siguiente imagen.
En pocos pasos he creado un gráfico que se adapta a lo que estaba necesitando por estos días. Pero además de tener capacidades para graficar en aplicaciones Windows, las librerías también son para ASP.Net, con lo que realmente conviene echarles un vistazo, en el caso de que tengamos que crear Chart.
Descarga el ejemplo:
http://cid-bef06dffdb192125.skydrive.live.com/self.aspx/Code%20Samples/2008%2010%2027%20-%20DemoChart.zip
Saludos @ Home
El Bruno
Crossposting from
ElBruno.com
Archivado en: Visual Studio
Comparte este post: