Tags do Post ‘construção’
Ruby: Aprenda a programar
Postado por: Rafael Biriba em Desenvolvimento, Ruby em 04/04/2009

Nas últimas semanas estive empenhado para aprender Ruby on Rails. Procurei aqui e ali na internet, juntei conteúdo de todas as partes e blogs, para aprender cada vez mais.
Para quem não sabe, Ruby on Rails é um framework para desenvolvimento Web, bem mais fácil de trabalhar comparando com outras linguagens Web.
Como diz no site do Rails, “Mostre, não fale: Ver é acreditar !”, visite o link abaixo e veja alguns exemplos de Rails na prática:
http://www.rubyonrails.pro.br/apresentacoes
Depois de vários dias, descobri um site ótimo para quem quer aprender a programar: ( Pena não ter encontrado ele antes )
http://aprendaaprogramar.rubyonrails.pro.br/
O site apresenta capitulos divididos em 11 links. A didática é ótima, e diz o autor que os exemplos encontrados no site são realmente “executados” , ou seja, o resultado do exemplo que você vê no site, realmente é executado. Isso é apenas um dos benefícios de usar o Ruby on Rails.
Eu recomendo tanto o site, quanto a linguagem para todos os programadores/desenvolvedores. Inclusive eu recomendo também para os futuros programadores. Quem tem pouco conhecimento na área, vai facilmente aprender a lógica de programação e a linguagem de maneira simplificada.
Em falar nisso, eu achei extremamente fácil de aprender e entender. Pra quem quer começar, visite o site abaixo para baixar a última distribuição do ruby:
http://www.ruby-lang.org/pt/downloads/
Ou então visite direto o site do Ruby on Rails, utilizem seus links para o download tanto do ruby quanto do rails*:
http://www.rubyonrails.pro.br/down
Neste mesmo link ainda exemplos de como criar sua primeira aplicação em Rails.
* Instalação do Rails e muitos outros pacotes, serão efetuadas pelo gerenciador RubyGems.
Bom, espero que se divirtam… =)
Chart API: Medidor em formato de velocímetro
Postado por: Rafael Biriba em Desenvolvimento, Google Chart API em 10/03/2009

Google Code: http://code.google.com/apis/chart/
Um gráfico em formato de velocímetro, pode ser usado para diversos fins, como indicar o uptime ou apresentar o espaço livre em disco e etc..
Abaixo segue a URL utilizada, e em seguida a explicação de cara parâmetro, para que você aprenda, configure e use conforme a sua necessidade !
No exemplo, utilizamos um gráfico de 0 a 200, onde o ponteiro vale 150 !
Lembrando que a URL deve ficar em uma só linha, abaixo ela está segmentada devido ao tamanho.
http://chart.apis.google.com/chart?
&chs=225×125
&cht=gom
&chd=t:150
&chds=0,200
&chl=Titulo 01
&chco=00ff00,ffff00,ff0000
&chxt=y
&chxl=0:|0|200
Recomendo que apenas os valores em negrito/colorido sejam editados para facilitar a exibição. Qualquer alteração nos outros parâmetros, recomendo ler a documentação em http://code.google.com/apis/chart/.
Clique aqui para acessar o link completo do gráfico.
&chs = Dimensões do gráfico, Comprimento X Altura. Deve ser alterado para ficar de acordo com o tamanho do gráfico a ser apresentado, senão alguns dados não serão corretamente exibidos na tela.
&cht = É o tipo de gráfico. Neste caso usamos o gom. Outras opções seriam: p3 = pizza, bvg = barras dentre outros…
&chd = Posição da seta. Em nosso exemplo deve estar diretamente associado ao valores do &chxl, no eixo Y. Observe que atribuimos o valor 150.
&chds = Valor mínimo e máximo para o eixo Y. Manteremos o valor inicial como zero e o maior valor sendo igual ou maior que o maior dado informado no &chd, para que o gráfico seja exibido corretamente.
&chl = É o título da seta. Também é possível deixar esse parâmetro em branco, para deixar a seta sem nenhum rótulo.
&chco = Cores do gráfico em hexadecimal, sendo o primeiro como cor inicial, o segundo como cor intermediária e o terceiro como cor final. Basta alterar conforme sua necessidade.
&chxt = Habilita o eixo y.
&chxl = Nome dos pontos nos eixos. 0:| corresponde aos titulos do eixo Y. Não há limite para que seja adicionado dados no eixo Y, porém o primeiro e o ultimo valor do eixo Y, deve ser o mesmo que o informado no parametro &chds, para que seja exibido corretamente no gráfico.
Acho que isso já é um grande inicio para construir um gráfico em formato de velocímetro.
=)
Chart API: Gráfico de visitantes do dia
Postado por: Rafael Biriba em Desenvolvimento, Google Chart API em 06/03/2009

Google Code: http://code.google.com/apis/chart/
O gráfico abaixo, pode ser utilizado, não somente para visitantes do dia, mas pode ser adaptado para uma utilidade de sua preferência !
Abaixo segue a URL, utilizada para exibir esse gráfico, e logo depois as explicações de como personaliza-lo ! Lembrando que a URL deve ficar em uma só linha, abaixo ela está segmentada devido ao tamanho.
http://chart.apis.google.com/chart?
&cht=lc
&chco=ff0000
&chs=300×200
&chd=t:55,20,50,50,60,45,47,175,200
&chds=0,200
&chtt=Visitantes+do+Dia - 03/04/08
&chm=o,000000,0,-1,5.0
&chxt=x,y
&chxl=0:|00:00|03:00|06:00|09:00|12:00|15:00|18:00|21:00|24:00|1:|0||50||100||150||200
Recomendo que apenas os valores em negrito/colorido sejam editados para facilitar a exibição. Qualquer alteração nos outros parâmetros, recomendo ler a documentação em http://code.google.com/apis/chart/.
Clique aqui para acessar o link completo do gráfico.
&cht = É o tipo de gráfico. Neste caso usamos o lc. Outras opções seriam: p3 = pizza, bvg = barras dentre outros…
&chco = Cor da linha. FF0000 é vermelho em hexadecimal. Basta alterar conforme sua necessidade.
&chs = Dimensões do gráfico, Comprimento X Altura. Deve ser alterado para ficar de acordo com o tamanho do gráfico a ser apresentado, senão alguns dados não serão corretamente exibidos na tela.
&chd = Dados do gráfico. Em nosso exemplo deve estar diretamente associado ao valores do &chxl, no eixo Y.
&chds = Valor mínimo e máximo para o eixo Y, que no exemplo correponde ao número de visitas. O correto, é manter o valor inicial como zero, já que não temos visitas negativas, e o maior valor sendo igual ou maior que o maior dado informado no &chd, para que o gráfico seja exibido corretamente.
&chtt = Titulo do gráfico. Pode ser uma frase separada por ‘+’, ou simplesmente por espaços.
&chm = Responsável por criar as bolas em cada ponto. o segundo valor ‘000000‘, corresponde ao preto em hexadecimal, e 5.0 é o tamanho da bola. Ambos podem ser alterados.
&chxt = Habilita o eixo x e y. No manual, é possível ver que podemos mais eixos, passando por este parametro.
&chxl = Nome dos pontos nos eixos. 0:| correponde aos titulos no eixo X. Para que o gráfico seja exibido corretamente, a quantidade de dados informados &chd deve ser igual a quantidade de títulos no eixo X. Reparem que ambos tem 9 entradas.
1:| corresponde aos titulos do eixo Y. Não há limite para que seja adicionado dados no eixo Y, porém o primeiro e o ultimo valor do eixo Y, deve ser o mesmo que o informado no parametro &chds.
Com isso, é possível construir esse e muitos outros gráficos, e trabalhando em um pequeno script, é possível que o gráfico seja exibido sempre atualizado. Cabe a você definir a sua necessidade.
=)
Chart API: Desenhe gráficos com o Google - Introdução
Postado por: Rafael Biriba em Desenvolvimento, Google Chart API em 04/03/2009

Google: http://www.google.com/
O Google Chart API permite que você gere gráficos de forma dinâmica. Através de parâmetros informados pela URL, a API retorna uma imagem PNG com o gráfico especificado.
Existem diversos tipos de possibilidades, como gráficos de pizza, linear, múltiplas linhas, barra, radar, mapas geográficos e muitos outros, com opções de dimensões, legenda, cores, tamanhos, efeitos e muitas outras possibilidades.
Link: http://code.google.com/apis/chart/
Abaixo segue um modelo de exemplo:
URL Utilizada: http://chart.apis.google.com/chart?cht=p3&chd=t:60,40&chs=250×100&chl=Hello|World
Código html utilizado:
<img src=”URL” alt=”" width=”250″ height=”100″ />
Onde no lugar de URL deve ser informado o endereço do Chart API do Google conforme informado no exemplo a cima.
Estarei ensinando e apresentando nos próximos POSTs, formas e possibilidades de construções de gráficos simples e avançados em todos os formatos disponíveis.


