jQuery Visualize Gráfico Radar Javascript Acessivel

Novo link em: http://evodata.com.br/marcosfedato/?p=18&lang_view=pt


Hoje eu precisei usar um gráfico de radar (algumas apis chamam de spider) em uma das minhas aplicações.

Procurei por um bom tempo um chart free (open source) para usar, mas o único que achei foi o do google.

Como posso precisar usar esse gráfico em uma intranet, eu preferi não usar.

Como eu já tinha postado aqui antes, eu gosto muito o jQuery visualise, e resolvi extende-lo.

E consegui, o código dessa api é lindamente simples e copiando os códigos dela e alterando foram apenas 2 horas para conseguir o que eu queria.

Vejam como ficou:

Então para quem precisa de uma api de gráfico com suporte a esses gráficos radiais compativel com HTML5, e com um esquema em javascript de retrocompatibilidade que roda até no IE6 fica o meu código.

Para usar é como o jQuery visualize mesmo, vc cria uma tabela, e depois coloca o javascript:

$(function(){
      $('table').visualize({type: 'radar', height: '350px', width: '480px'});
});

Existem agora os tipos 'radar' e 'radial' ambos são esse mesmo gráfico, mas o radial adiciona um preenchimento transparente nas áreas cobertas.

Ele também é compatível com o estilo light (você deve importar 2 css o 'css/visualize.css' e o do tema, 'css/visualize-light.css' ou   'css/visualize-dark.css'.

Download link at Evodata: link.

Download link at 4Shared: link.

Javascript Color Picker

Hoje vou falar de um aditivo para o JavaScript bem legal para trabalhar com a entrada de dados de cores.

É o JSColor, embora não use o jQuery (api que eu gosto muito) é muito fácil de usar e da um resultado bem legal.

O resultado final parece a ferramenta de seleção de cor do Photoshop.

Compatibilidade:

Enquanto muitos reclamam do IE 6, os desenvolvedores desse plug-in preferiram arregaçar as mangas e fazer ele compativel com tudo que é possivel, incluindo o IE 5 e IE 5.5.

Além disso ele trabalha sobre inputs, em browsers sem JavaScript ou com JavaScript desativado o usuário pode digitar o valor da cor dentro do input, ou seja perde usabilidade mas não a funcionalidade.

Facilidade de Uso:

Como ele trabalha com inputs, é só incluir o arquivo JavaScript e colocar a classe "color" nos inputs que devem selecionar a cor.

Licenciamento:

Ele é LGPL, traduzindo, pode ser usado para coisas pessoais, coisas open source e em projetos comerciais sem problemas.

Avaliação:

Algo compativel com IE 5, que não pare o sistema se o JavaScript estiver desabilitado e que possa ser usado comercialmente só pode ser bom!

Recomendo a todos que precisem de um colorpicker em JavaScript.

Link: http://jscolor.com/

jQuery Visualize

Pessoal, este é o meu primeiro post neste blog, espero que vocês gostem.

Pretendo utilizar este blog para falar sobre desenvolvimento para internet, abordando temas como acessibilidade na web, trocar experiências sobre desenvolvimento de sistemas e temas relacionados.

Hoje venho falar de uma API muito legal para se colocar gráficos na sua página ou sistema, como o gráfico de pizza, gráfico de barras e gráfico de linha a API jQuery Visualize.

Com ela você pode transformar uma tabela em um gráfico com apenas 1 linha de comando.

Normalmente gráficos são gerados em imagem ou em flash, o legal dessa API é que se o browser do usuário não suportar imagens (como leitores de tela) ou JavaScript (por motivos de segurança, ou sei la) a informação ficará lá em forma de tabela.

Assim o usuário sempre tem acesso a informação, segue um exemplo de como o jQuery Visualize transforma uma tabela em gráfico.

$('table').visualize();

Legal né? O melhor é que mesmo usando HTML 5, o jQuery Visualize funciona no nosso grande amigo IE 6.0 graças a uma API mantida pela Google que consegue "emular" os efeitos do HTML 5 mesmo nesse browser antigo.

Saiba mais e faça o download desta API aqui [link].