11
C# ‐ Criando gráficos com o componente Chart Se você precisa criar gráficos usando a linguagem C# então ganhou o dia pois este artigo mostra como fazer isso usando o componente Chart que já vem com a versão do Visual C# 2010 Express Edition. Obs: Este artigo foi baseado no meu artigo para VB .NET ‐ VB .NET ‐ Criando gráficos no VB 2010 Express Edition ‐ Macoratti.net Já faz algum tempo que a Microsoft Liberou o .NET Chart Control , oriundo do Dundas Charts, como um add‐on gratuito para a plataforma .NET versão 3.5, oferecendo dessa forma um recurso com possibilidades muitos interessantes para a geração de gráficos tanto com ASP .NET como com aplicações Windows Forms, uma área muito carente na plataforma .NET. Então se você possui a versão do Visual C# 2008 a primeira coisa que você tem que fazer para ter disponível este recurso é efetuar os seguintes downloads: Microsoft Chart Controls for Microsoft .NET Framework 3.5 Microsoft Chart Controls Add‐on for Microsoft Visual Studio 2008 Neste link você encontra exemplos e documentação sobre o componente: http://code.msdn.microsoft.com/mschart Se você deseja seguir um caminho mais fácil basta fazer o download do Visual C# 2010 Express Edition e após instalar, verificar na aba Data o controle Chart já presente, instalado e pronto para ser usado. Gerando gráficos com Chart Abra o Visual C# 2010 Express Edition e no menu File clique em New Project e selecione o template Windows Forms Application informando o nome Graficos_Chart; Abra a Toolbox na guia Data e verifique o componente Chart presente e pronto para ser usado. Quando pensamos em gráficos queremos exibir dados de alguma fonte e como primeiro exemplo vamos preparar uma fonte de dados bem simples para usarmos como exemplo. Vamos acessar usando o banco de dados Northwind.mdb e acessar a tabela Products selecionando o nome dos produtos e as unidades em estoque e criar um gráfico dos produtos e de seu estoque usando o controle Chart. Gerando a fonte de dados (DataSource) usando um DataSet Vamos iniciar criando um DataSource no menu Data clicando Add New Data Source; Nesta janela selecione DataBase e clique em Next>;

C# - Criando Gráficos Com o Chart

Embed Size (px)

DESCRIPTION

Utilize o Chart para criar Graficos com C#

Citation preview

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 1/11

    C# Criando grficos com o componente Chart

    Se voc precisa criar grficos usando a linguagem C# ento ganhou o dia pois este artigo mostra como fazer isso usando ocomponente Chart que j vem com a verso do Visual C# 2010 Express Edition.

    Obs: Este artigo foi baseado no meu artigo para VB .NET VB .NET Criando grficos no VB 2010 Express Edition Macoratti.net

    J faz algum tempo que a Microsoft Liberou o .NET Chart Control , oriundo do Dundas Charts, como um addon gratuito para aplataforma .NET verso 3.5, oferecendo dessa forma um recurso com possibilidades muitos interessantes para a gerao de grficostanto com ASP .NET como com aplicaes Windows Forms, uma rea muito carente na plataforma .NET.

    Ento se voc possui a verso do Visual C# 2008 a primeira coisa que voc tem que fazer para ter disponvel este recurso efetuar osseguintes downloads:

    Microsoft Chart Controls for Microsoft .NET Framework 3.5

    Microsoft Chart Controls Addon for Microsoft Visual Studio 2008

    Neste link voc encontra exemplos e documentao sobre o componente: http://code.msdn.microsoft.com/mschart

    Se voc deseja seguir um caminho mais fcil basta fazer o download do Visual C# 2010 Express Edition e aps instalar, verificarna aba Data o controle Chart j presente, instalado e pronto para ser usado.

    Gerando grficos com ChartAbra o Visual C# 2010 Express Edition e no menu File clique em New Project e selecione o template Windows Forms Applicationinformando o nome Graficos_Chart;

    Abra a Toolbox na guia Data e verifique o componente Chart presente e pronto para ser usado.

    Quando pensamos em grficos queremos exibir dados de alguma fonte e como primeiro exemplo vamos preparar uma fonte de dadosbem simples para usarmos como exemplo.

    Vamos acessar usando o banco de dados Northwind.mdb e acessar a tabela Products selecionando o nome dos produtos e asunidades em estoque e criar um grfico dos produtos e de seu estoque usando o controle Chart.

    Gerando a fonte de dados (DataSource) usando um DataSet

    Vamos iniciar criando um DataSource no menu Data clicando Add New Data Source;

    Nesta janela selecione DataBase e clique em Next>;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 2/11

    A seguir selecione o item DataSet e clique em Next>;

    Defina a conexo com o banco de dados Northwind.mdb clicando em New Connection e selecionando este arquivo na pasta ondevoc o colocou;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 3/11

    Selecione a tabela Products e marque apenas os campos ProductName e UnitsInStock e clique em Finish;

    Ser criado o DataSource representado pelo dataset NorthwindDataSet.xsd na janela Solution Explorer;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 4/11

    Selecione este arquivo e abrao no descritor dataset; Clique com o boto direito sobre ProductsTableAdapter e selecione Configure;

    Na prxima janela altere a instruo SQL original : SELECT ProductName, UnitsInStock FROM Products para

    SELECT TOP 5 ProductName, UnitsInStock FROM ProductsORDER BY ProductName

    Assim estamos selecionando apenas os 5 primeiros produtos por ordem de nome do produto;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 5/11

    Clique em Finish e salve o DataSet alterado.

    Vamos agora criar o nosso grfico com base no DataSource gerado.

    Gerando o grfico a partir do DataSourceSelecione o formulrio form1.vb e a partir da ToolBox arraste e solte o controle Chart no formulrio ajustando o seu tamanho deforma adequada conforme a figura abaixo:

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 6/11

    Selecione o controle Chart1 gerado no formulrio e na janela de propriedades vamos definir a propriedade DataSource;

    Clique nesta propriedade e selecione o dataset NorthwindDataSet gerado anteriormente e a tabela Products do DataSet;

    Selecione a propriedade Series e clique ao lado de Collection para abrir a janela Series Collection Editor;

    Expanda a propriedade DataSource e defina a propriedade XValueMember como igual a ProductName e YValueMember como iguala UnitsInStock;

    Define tambm a propriedade IsValueShowAsLabel de Label como True e clique em OK;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 7/11

    Executando o projeto agora voc ir ver o seguinte grfico:

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 8/11

    Nada mal mas podemos melhorar... e vamos fazer isso incluindo os seguintes detalhes no grfico:

    Incrementando a aparncia do grfico

    1 Incluir um Titulo no grfico:

    1. Selecione a propriedade Titles e clique em Collection;2. Na janela Title Collection Editor clique no boto Add;3. Na propriedade Text digite o ttulo do grfico: Estoque dos 5 Produtos e clique em OK;

    2 Definir uma aparncia mais elegante para o nosso grfico:

    Selecionando a propriedade BackColor do controle Chart e definindo uma cor para destacar o grfico;Selecionando a propriedade BorderSkin do controle Chart1 e selecionando um Skin da sua preferncia;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 9/11

    Selecionando a propriedade Palette e definindo um conjunto de cores para o grfico;

    E desta forma podemos alterar tambm o tipo de grfico exibido selecionando a propriedade Series e na propriedade Chart da janelaSeries Collection Editor definir a propriedade CharType para o tipo de grfico desejado;

    Para obtermos um grfico em 3D basta selecionar a propriedade ChartAreas e expandindo a propriedade Area3DStyle da janelaChartArea Collection Editor , defina a propriedade Enabled3D como true;

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 10/11

    Aps estas configuraes executando o projeto iremos obter:

    Um pouco melhor no mesmo ???

    Se voc verificar o meu artigo sobre Chart usando o VB .NET vai notar que eu apenas repeti os mesmos procedimentos neste artigo.

    Afinal o componente usado foi o mesmo.

    Pegue o cdigo completo usado no artigo aqui: Graficos_Chart_CSharp.zip

    VejaosDestaquesenovidadesdoSUPERCDVB2012(sempreatualizado):cliqueeconfira!

    Quer migrar para o VB .NET ?

    Veja mais sistemas completos para a plataforma .NET no Super DVD .NET , confira...

    Quer aprender C# ??

    ChegouoSuperDVDC#2012comexclusivomaterialdesuporteevdeoaulascomcursobsicosobreC#.

    Heb1:9AmasteajustiaeodiasteainiqidadeporissoDeus,oteuDeus,teungiucomleodealegria,maisdoqueateuscompanheirosHeb1:10e:Tu,Senhor,noprincpiofundasteaterra,eoscussoobrasdetuasmosHeb1:11elesperecero,mastupermanecesetodoseles,comoroupa,envelhecero,Heb1:12equalummantoosenrolars,ecomoroupasemudaromastusomesmo,eosteusanosnoacabaro.

  • 26/03/2015 C#CriandogrficoscomoChart

    http://www.macoratti.net/12/11/c_chart1.htm 11/11

    Referncias:

    Seo VB .NET do Site Macoratti.netSuper DVD .NET A sua porta de entrada na plataforma .NETSuper DVD Vdeo Aulas Vdeo Aula sobre VB .NET, ASP .NET e C#Seo C# do site Macoratti.netASP .NET Usando o controle Chart Control Macoratti.netVB .NET Criando grficos no VB 2010 Express Edition Macoratti.net

    JosCarlosMacoratti