Angular Chart Highlighting Example

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

    Angular Modos e comportamentos de destaque de gráfico

    Todos os gráficos Angular suportam uma variedade de opções de destaque. highlightingMode pode ser definido para clarear ou esmaecer quando o mouse estiver passando o mouse sobre uma série/item de dados renderizado na área de plotagem. highlightingBehavior pode ser definido diretamente sobre ou para o item de dados mais próximo para acionar o efeito de realce. Os modos e comportamentos de realce são suportados pelos controles , IgxCategoryChartComponent​ ​IgxFinancialChartComponent, e IgxDataChartComponent eles têm a mesma API para usar o recurso de realce.

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

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

    Angular Realce da legenda do gráfico

    Todos os gráficos Angular suportam realce de legenda. legendHighlightingMode pode ser ativado para que, quando o mouse estiver passando o mouse sobre um item de marcador de legenda, a série renderizada seja destacada na área de plotagem. O realce de legenda é suportado pelos controles , IgxCategoryChartComponent​ ​IgxFinancialChartComponent, e IgxDataChartComponent eles têm a mesma API para usar o recurso de realce.

    O exemplo a seguir demonstra a série de legendas realçando Angular gráfico.

    Highlight Layers

    O Ignite UI for Angular IgxCategoryChartComponent pode habilitar três tipos de realce 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 realce disponíveis no gráfico Angular.

    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: