React Chart Highlighting Example

    O exemplo a seguir demonstra as diferentes opções de destaque disponíveis no gráfico React.

    Gráfico de React destacando modos e comportamentos

    Todos os React Charts suportam uma variedade de opções de destaque. highlightingMode pode ser definido para clarear ou desbotar quando o mouse estiver passando sobre uma série/item de dados renderizado na área do gráfico. highlightingBehavior pode ser definido diretamente sobre ou o item de dados mais próximo para acionar o efeito de destaque. Os modos e comportamentos de destaque são suportados pelos controles IgrCategoryChart, IgrFinancialChart e IgrDataChart e eles têm a mesma API para usar o recurso de destaque.

    O exemplo a seguir demonstra o gráfico highlightingMode React.

    O exemplo a seguir demonstra o gráfico React highlightingBehavior.

    Destaque de legenda do gráfico React

    Todos os React Charts suportam destaque de legenda. legendHighlightingMode pode ser habilitado para que quando o mouse estiver passando sobre um item de marcador de legenda, a série renderizada seja destacada na área de plotagem. O destaque de legenda é suportado pelos controles IgrCategoryChart, IgrFinancialChart e IgrDataChart e eles têm a mesma API para usar o recurso de destaque.

    O exemplo a seguir demonstra a série de legendas destacando o gráfico React.

    Highlight Layers

    A Ignite UI for React IgrCategoryChart pode habilitar três tipos de destaque ao passar o mouse sobre itens de dados.

    1. O Realce de Série realçará o único ponto de dados representado por um marcador ou coluna quando o ponteiro estiver posicionado sobre ele. Isso é habilitado definindo a isSeriesHighlightingEnabled propriedade como true.

    2. O Realce de Item realça os itens em uma série desenhando uma forma em faixas em sua posição ou renderizando um marcador em sua posição. Isso é habilitado definindo a isItemHighlightingEnabled propriedade como true.

    3. O realce de categoria tem como alvo todos os eixos de categoria no gráfico. Eles desenham uma forma que ilumina a área do eixo mais próxima da posição do ponteiro. Isso é habilitado definindo a isCategoryHighlightingEnabled propriedade como true.

    O exemplo a seguir demonstra as diferentes camadas de destaque disponíveis no gráfico React.

    Additional Resources

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

    API References

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