Animações de gráficos React

As animações permitem que você facilite a série à medida que carrega uma nova fonte de dados. A animação disponível difere dependendo do tipo de série envolvida. Por exemplo, a série de colunas é animada subindo do eixo x, uma série de linhas é animada desenhando a partir da origem do eixo y.

As animações são desabilitadas na Ignite UI for React Charts, mas podem ser habilitadas definindo a propriedade isTransitionInEnabled como true. A partir daí, você pode definir a propriedade transitionInDuration para determinar quanto tempo sua animação deve levar para ser concluída e o transitionInMode para determinar o tipo de animação que ocorre.

React Chart Animation Example

O exemplo a seguir descreve um gráfico de linhas com uma animação definida como o padrão transitionInMode "Auto". A lista suspensa e o controle deslizante na parte superior neste exemplo permitirão que você modifique o transitionInMode e transitionInDuration, respectivamente, para que você possa ver como as diferentes animações suportadas se parecem em diferentes velocidades.

Additional Resources

Você pode encontrar mais informações sobre recursos de gráfico relacionados nestes tópicos:

• Anotações de gráficos
• Destaque de gráfico
• Dicas de ferramentas de gráfico

API References

A seguir está uma lista de membros da API mencionados nas seções acima:

• IgrCategoryChart
• isTransitionInEnabled
• transitionInDuration
• transitionInMode