PUBLICIDADE
Este artigo tem nota
10

Autor

francke

Francke Peixoto

membro deste setembro de 2007

Compartilhe e guarde

  • Rec6
  • StumbleUpon
  • ueba
  • linkk
  • dihitt
  • linkloko
  • linkto
  • Technorati
  • Simpy
  • del.icio.us
  • Faves: Fave It!

PUBLICIDADE

Enquete

Que banco de dados você utiliza em seus projetos?
quarta-feira, 21 de outubro de 2009

Gerando Gráficos em Barra no ASP.NET


Neste artigo, criaremos um gráfico de barras em uma página ASP.NET.

Para gerar gráficos em uma página asp.net, precisamos de uma era para desenho, está area está disponível na classe Bitmap.

Vamos pensar um pouco...

No mundo real, para fazermos um desenho do que precisamos?
R: Caneta,Papel ou Pincel, dependendo do tipo de desenho! ;-)

No Asp.net não seria diferente. Então vamos criar nossa area de desenho!

Ao criar um objeto Bitmap, devemos passar 3 argumentos, como descrito em seu construtor. (existem 12, mas iremos usar este! :-] )



Exemplo:
Bitmap imagem = new Bitmap(260, 180, PixelFormat.Format32bppArgb);

O terceiro argumento indica o formato de cores que desejamos usar,
O PixelFormat é um enum com n tipos.



Depois de criarmos o nosso Bitmap, precisamos que alguém o referencie este alguém é o objeto Graphics.

Exemplo:
Graphics grafico = Graphics.FromImage(imagem);


Agora vamos limpar nossa folha e pintar seu fundo com uma cor suave.
grafico.Clear(Color.LightYellow)


Até o momento já sabemos como criar nossa folha, agora vamos por a mão na massa!

Vamos criar um struct chamado empresa [font color=blue]*nossa base de dados poderia ser um xml,banco de dados ou arquivo texto*

  public struct Empresa
{
public Color cor;
public string nome;
public int lucro;
}


Para facilitar nossa vida, vamos fazer tudo dentro do PAGE_LOAD.

Após criar a estrutura empresa, vamos usá-la.

Empresa[] emp = new Empresa[7];
emp[0].nome = "OI";
emp[0].lucro = 62;
emp[0].cor = Color.Red;
emp[1].nome = "CLARO";
emp[1].lucro = 78;
emp[1].cor = Color.Silver;
emp[2].nome = "VIVO";
emp[2].lucro = 45;
emp[2].cor = Color.Purple;
emp[3].nome = "TIM";
emp[3].lucro = 95;
emp[3].cor = Color.Orange;
emp[4].nome = "NextTel";
emp[4].lucro = 125;
emp[4].cor = Color.Green;
emp[5].nome = "LG";
emp[5].lucro = 145;
emp[5].cor = Color.HotPink;
emp[6].nome = "Intel";
emp[6].lucro = 15;
emp[6].cor = Color.Black;


Declare duas variáveis do tipo INT.
       int total = 0;
int i = 0;


Abaixo estamos fazendo o somatório de tudo:

    for (i = 0; i < emp.Length; i++) 
total += emp[i].lucro;


Como já criamos nossa area de desenho, vamos usá-la! :-]

//for na estrutura
for ( i = 0; i < emp.Length; i++)
{
/* aqui estamos usando o SolidBrush [nosso pincel] com a cor definida na estrutura, e estamos desenhando um retangulo em nossa folha.
*/
grafico.FillRectangle(new SolidBrush(emp[i].cor), 5, 10+(20*i), emp[i].lucro, 13);


Uma descrição dos parâmetros do FillRectangle:


/* depois de desenhar o barra, vamos adicionar sua legenda usando o DrawString e usando nosso pincel novamente o SolidBrush.
*/
grafico.DrawString(emp[i].nome + string.Format(" ({0}%)", ((emp[i].lucro * 100) / total)), new Font("verdana", 8, FontStyle.Regular), Brushes.Black, 5 + emp[i].lucro, 10 + (20 * i) );

}
grafico.DrawString("Linha de Codigo ", new Font("verdana", 8, FontStyle.Regular), Brushes.Black,140, 150);


Uma descrição dos parâmetros do DrawString:


Para finalizar nossa aplicação, vamos agora informar ao navegador que estamos enviando a ele uma imagem e não um documento html.

Response.Clear();
Response.ClearHeaders();
Response.ContentType ="image/jpeg";
// Daqui sairá nosso gráfico.
imagem.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg);
imagem.Dispose();


Após essa instrução, salve tudo e execute. O resultado será semelhante ao ilustrado abaixo.





Para baixar o código completo deste arquivo clique aqui.


Bom pessoa, vimos como é simples e fácil criar um sistema de gráfico no ASP.NET,

Até o próximo artigo pessoal! []’s

ArquivoTipoTamanho 
docGerandoGráficosemBarranoASPNET.zipArquivo ZIP616,8 KbBaixar o Arquivo
Sim   Não   Este artigo foi útil para você?
NotaComentário
10
usertop comentou em 31/10/2009

Ótimo

parabens Ótimo tutorial bem simples direto no ponto
10
charlo29 comentou em 28/10/2009

Gerando Gráficos em Barra

Achei super interessante, aqui na minha empresa todos estão precisando usar isto, só que não consegui fazer funcionar. Ele dá um erro no ScriptManager. Será que o autor poderia me ajudar? Usamos o Visual Studio 2005.
10
gabriel comentou em 23/10/2009

Parabéns

Excelente artigo. Mande mais. :)
Regras:
Os comentários seguem as seguintes regras:
  • Todos os comentários são enviados por membros cadastrados no site.
  • A pontuação de comentários de conteúdo do próprio membro não serão computados.
  • Os comentários serão pré-aprovados, porém a equipe do site revisará o conteúdo de todos os comentários podendo ser invalidados (inclusive a pontuação).
  • Os comentários precisam ter, obrigatóriamente, coerência sobre o conteúdo que será comentado.
  • O membro que atingir 5 comentários invalidados não poderá mais comentar dentro do site. Com isso o membro não poderá mais ganhar pontos com comentários.
  • Há um limite de 10 comentários por dia para cada membro.
  • Qualquer comentário após ter sido publicado poderá ser retirado através da opção ( denunciar)

Comente

     (ainda não tem cadastro? clique aqui!)


Máximo de 30 caracteres

Máximo de 255 caracteres
 

R&W Consulting - Soluções Web Hospedagem UOL HOST PagSeguro - solução para pagamentos online
© 2006-2009 R&W Informática Ltda. - Todos os direitos reservados.