A visualização de dados eficaz permite que os usuários entendam e consumam facilmente informações complexas e enfadonhas. Plotar seus dados pode substituir os dados tabulares e também é uma ótima maneira de adicionar gráficos práticos à sua página da web ou aplicativo. Há várias maneiras de plotar dados dinamicamente – mas neste artigo vamos nos concentrar em 10 excelentes soluções JavaScript para gráficos/gráficos de dados que permitem processar dados do lado do cliente.
Você também encontrará um link para uma das páginas de demonstração do script para poder vê-lo em ação.
Ótimo
Ótimo é uma biblioteca de plotagem de dados desenvolvida por IOLA construído em cima do jQuery. É fácil de usar, mas repleto de recursos e elegante. Ele possui um recurso de zoom controlado pelo mouse (clique e arraste sobre a área de destino) e alguns recursos simples de interatividade do usuário, como a capacidade de determinar as coordenadas xey dos cliques do mouse. Demonstração: Diferentes tipos de gráficos
Biblioteca de plotagem Javascript Flotr
flutuarescrito por Bas Wenneker da Solutoire.com, é uma solução de plotagem inspirada em Flot que usa a biblioteca Prototype JS e excanvas.js.
Ele suporta a maioria dos navegadores modernos, incluindo o Internet Explorer 6, e possui muitos recursos do Flot, incluindo rastreamento de mouse, seleção e recursos de rastreamento de mouse. Demonstração: Exemplo Básico de Legenda
Plug-in fgCharting para jQuery
Plug-in fgCharting jQuery é uma solução acessível para gráficos de dados. Ele pega dados em uma tabela HTML e transforma dinamicamente a tabela em gráficos, permitindo que navegadores não tradicionais (ou seja,
– leitores de tela) acesso à tabela HTML. O uso básico envolve uma linha de código para inicializar o plugin. Demonstração: Página de tipos de gráfico
PlotKit
PlotKit é uma solução de plotagem de tabelas e gráficos escrita em cima de Mochikit.
PlotKit uma reescrita completa de um projeto chamado CanvasGraph.js, melhorando a estrutura do código e adicionando suporte ao formato SVG. Demonstração: Testes de renderização SVG
Construtor de diagrama JavaScript
O Construção de diagrama JavaScriptr oferece suporte a vários tipos de gráficos, incluindo barras, pontos, linhas e gráficos de pizza. O desenvolvedor forneceu um Ferramenta de suporte ao navegador para ajudá-lo a verificar se determinados objetos/métodos da biblioteca são suportados pelo seu navegador atual.
Demonstração: O objeto Barra
Gráficos JavaScript da Emprise
Gráficos JavaScript da Emprise oferece uma licença pessoal gratuita para seu script de gráficos/gráficos repleto de recursos. Confira a tabela de comparação de recursos dos diferentes tipos de licenças para ver qual licença é a certa para você. Demonstração: exemplo de gráfico de área
Script de gráfico de pizza do Drive Dinâmico
DynamicDrive oferece uma solução baseada em DHTML/CSS para gráficos de pizza.
A implementação é simples, basta incluir dois scripts fornecidos (wz_jsgraphics.js e pie.js), definir os valores de cada segmento do seu gráfico de pizza embutido ou em um arquivo JS externo e pronto!
Script de gráfico de linha de direção dinâmica
O Script de gráfico de linha é outra solução DHTML da DynamicDrive que permite exibir dados gráficos de linhas. O procedimento de implementação é semelhante ao script Pie Graph.
Gráfico 3D em tela
Se você precisar representar graficamente dados tridimensionais, Gráfico 3D em tela vale a pena conferir. Canvas 3D Graph foi escrito com excanvas.js para oferecer suporte ao Internet Explorer.
O mecanismo de gráficos Dojo
O mecanismo de gráficos Dojo é uma solução escrita sobre a biblioteca JavaScript do Dojo Toolkit.
É uma solução rica em recursos que inclui métodos de tendência para análise dinâmica de dados, barras visuais 3D e efeitos animados de passagem do mouse. Observe que o exemplo de página de teste vinculado à página do projeto não funciona. Aqui está o link da página de exemplo funcional. Demonstração: gráfico de cilindros Sua solução de gráficos favorita não está incluída na lista?
Tem uma página da web que usa alguma das soluções acima? Compartilhe com todos nós nos comentários.
Perguntas frequentes sobre soluções JavaScript para gráficos de dados
Qual é a biblioteca de plotagem Javascript Flotr?
Flotr é uma solução de plotagem de dados desenvolvida por Bas Wenneker da Solutoire.com, inspirada em Flot, que usa a biblioteca Prototype JS e excanvas.js.
O que é o Plug-in fgCharting para jQuery?
O Plug-in fgCharting para jQuery é uma solução acessível para gráficos de dados que pega dados em uma tabela HTML e transforma dinamicamente a tabela em gráficos.
O que é o PlotKit?
PlotKit é uma solução de plotagem de tabelas e gráficos escrita em cima da biblioteca Mochikit, oferecendo suporte ao formato SVG.
Qual é o Construtor de diagrama JavaScript?
O Construtor de diagrama JavaScript oferece suporte a vários tipos de gráficos, incluindo barras, pontos, linhas e gráficos de pizza, com uma ferramenta de suporte ao navegador para verificação de compatibilidade.
O que são os Gráficos JavaScript da Emprise?
Os Gráficos JavaScript da Emprise são uma solução repleta de recursos, com uma licença pessoal gratuita disponível para seu script de gráficos/gráficos.
