jQuery Visualize Radar Chart (english)

A few days ago i googled for a free (open source) radar chart to use in a project, but i didn't found anything.

Google charts has that chart, but, i will use this software in a intranet so use charts that requires web doesn't make sense..

So i grab the jQuery Visualise code that is licenced under MIT licence and implement the radar (sometimes called spider char) on it.

This is how the chart is generated:

If you need a chart api that support radar charts in javascript and that is fully compatible with HTML5, that is the deal. Another pro is that still working on older browsers like IE 6.0.

O use it is easy, create a table with the data you need, than transform that table into the radial chart using jQuery:

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

For more information on how to use jQuery Visualize go to the Filament Group (it is for how to use. Download from the botton of this page if you need radar charts, the original release don't have it). 

There are two types of chart that i had created 'radar' radial 'radial' both are the same chart, the difference is that the 'radial' creates a transparent fill with the series color.

That chart is also compatible with the light style (you must import 2 css files, the base 'css/visualize.css' and the theme, 'css/visualize-light.css' or  'css/visualize-dark.css').

Download link at Evodata: link.

Download link at 4Shared: link.

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.