Blazor Data Legend

No Ignite UI for Blazor, o IgbDataLegend é uma versão altamente personalizável do Legend, que mostra valores de série e fornece muitas propriedades de configuração para filtrar linhas de série e colunas de valores, valores de estilo e formatação. Esta legenda é atualizada ao mover o mouse para dentro da área de plotagem do IgbCategoryChart, IgbFinancialChart, e IgbDataChart. Além disso, ele tem um estado persistente que lembra o último ponto pairado quando o ponteiro do mouse do usuário sai da área de plotagem. Ele exibe esse conteúdo usando um conjunto de três tipos de linhas (cabeçalho, série, resumo) e quatro tipos de colunas (título, rótulo, valor, unidade).

Blazor Data Legend Rows

As linhas do incluem a linha de cabeçalho, a(s) linha(s) da série e a linha de IgbDataLegend resumo. A linha de cabeçalho exibe o rótulo do eixo do ponto que está passando o mouse e pode ser alterada usando a HeaderText propriedade.

Header Row

A linha de cabeçalho exibe o rótulo atual do eixo x ao passar o mouse sobre a série de categorias e as séries financeiras. Você pode usar HeaderFormatDate as propriedades e HeaderFormatTime para formatar a data e a IgbDataLegend hora no se o eixo x mostrar datas. Para outros tipos de séries, o IgbDataLegend não renderiza a linha de cabeçalho.

Series Row

A linha da série representa cada série plotada no gráfico. Essas linhas exibirão o emblema da legenda, o título da série, o valor real/abreviado da série e o símbolo de abreviação ou unidade de medida, se especificado. Você pode filtrar linhas de série definindo IncludedSeries ou ExcludedSeries propriedades para uma coleção de índices de série (1, 2, 3) ou títulos de série (Tesla, Microsoft).

Summary Row

Por fim, há uma linha de resumo que exibe o total de todos os valores da série. O título de resumo padrão pode ser alterado usando a SummaryTitleText propriedade da legenda. Além disso, você pode usar a SummaryType propriedade para personalizar se deseja exibir os Min Total Max Average valores de série ou de na linha de resumo.

Blazor Data Legend Columns

As colunas do IgbDataLegend Inclua o título da série, o rótulo, o valor da coluna de dados e a unidade opcional associada ao valor. Algumas séries no gráfico podem ter várias colunas para rótulo, valor e unidades. Por exemplo, a série de preços financeiros tem Alto, Baixo, Abrir e Fechar colunas de dados que podem ser filtradas no IgbDataLegend Usando o IncludedColumns ou ExcludedColumns Propriedades.

A configuração de valores nas IncludedColumns propriedades e ExcludedColumns depende do tipo de série e de quantas colunas de dados elas suportam. Por exemplo, você pode definir IncludedColumns a propriedade como uma coleção de cadeias de caracteres de Abertura e Fechamento e a legenda mostrará apenas os valores de abertura e fechamento para os preços das ações quando o gráfico estiver plotando séries financeiras. A tabela a seguir lista todos os nomes de coluna que podem ser usados para filtrar colunas na legenda de dados.

Type of Series	Column Names
Série de categorias	Valor
Série Radial	Valor
Série Polar	Radius, Angle
Bubble Series	X, Y, Radius
Série de dispersão	X, Y
Série de alcance	Alto, Baixo
Série Financeira	Alto, Baixo, Abrir, Fechar, Mudança, TypicalPrice, Volume

Onde o TypicalPrice e a alteração percentual dos preços OHLC são calculados automaticamente por séries financeiras, para que você não precise incluí-los em suas fontes de dados.

Title Column

A coluna de título exibe emblemas de legenda Title e títulos de série, que vêm da propriedade dos diferentes IgbSeries plotados no gráfico.

Label Column

A coluna de rótulo exibe o nome curto no lado esquerdo da coluna de valor, por exemplo, "O" para o preço de ação de abertura. Você pode alternar a visibilidade dessa coluna usando a LabelDisplayMode propriedade.

Value Column

A coluna de valor exibe valores de série como texto abreviado que pode ser formatado usando a ValueFormatAbbreviation propriedade para aplicar a mesma abreviação para todos os números definindo essa propriedade como Shared. Como alternativa, um usuário pode selecionar outras abreviações, como Independent, Kilo, Million, etc. A precisão dos valores abreviados é controlada usando o e ValueFormatMaxFractions para dígitos ValueFormatMinFractions mínimo e máximo, respectivamente.

Unit Column

A coluna da unidade exibe um símbolo de abreviação no lado direito da coluna de valor. O símbolo da unidade depende da ValueFormatAbbreviation propriedade, por exemplo, "M" para a abreviatura Million.

Customizing Columns

Você pode personalizar o texto exibido nas colunas Rótulo e Unidade usando propriedades que terminam com MemberAsLegendLabel e MemberAsLegendUnit em cada série. A tabela a seguir mostra algumas personalizações possíveis das colunas Rótulo e Unidade.

Type of Series	Propriedades da série
Série de categorias	ValueMemberAsLegendLabel="$" ValueMemberAsLegendUnit="M"
Série Radial	ValueMemberAsLegendLabel="Distance:" ValueMemberAsLegendUnit="KM"
Série Polar	RadiusMemberAsLegendLabel="Radius:" RadiusMemberAsLegendUnit="KM" AngleMemberAsLegendLabel="Angle:" AngleMemberAsLegendUnit="°"
Série de alcance	HighMemberAsLegendLabel="H:" HighMemberAsLegendUnit="K" LowMemberAsLegendLabel="L:" LowMemberAsLegendUnit="K"
Série Financeira	OpenMemberAsLegendLabel="O:" OpenMemberAsLegendUnit="K" HighMemberAsLegendLabel="H:" HighMemberAsLegendUnit="K" LowMemberAsLegendLabel="L:" LowMemberAsLegendUnit="K" CloseMemberAsLegendLabel="C:" CloseMemberAsLegendUnit="K"

Além disso, você pode usar a UnitText propriedade no para alterar o IgbDataLegend texto exibido em todas as colunas da unidade.

Blazor Data Legend Styling

O IgbDataLegend fornece propriedades para estilizar cada tipo de coluna. Cada uma dessas propriedades começa com Title,Label,Value ou Units. Você pode estilizar a cor, a fonte e a margem do texto. Por exemplo, se você quisesse definir a cor do texto de todas as colunas, definiria as TitleTextColor propriedades, LabelTextColor, ValueTextColor, e UnitsTextColor. O exemplo a seguir demonstra uma utilização das propriedades de estilo mencionadas acima:

Blazor Data Legend Value Formatting

O IgbDataLegend fornece abreviação automática de números grandes usando sua ValueFormatAbbreviation propriedade. Isso adiciona um multiplicador na coluna de unidades, como quilo, milhão, bilhão, etc. Você pode personalizar o número de dígitos fracionários exibidos definindo o ValueFormatMinFractions e ValueFormatMaxFractions. Isso permitirá que você determine o número mínimo e máximo de dígitos que aparecem após o ponto decimal, respectivamente. O exemplo a seguir demonstra como usar essas propriedades:

Blazor Data Legend Value Mode

Você tem a capacidade de alterar a exibição decimal padrão de valores dentro do IgbDataLegend para uma moeda alterando a ValueFormatMode propriedade. Além disso, você pode alterar a cultura do símbolo de moeda exibido definindo uma marca de cultura para a ValueFormatCulture propriedade. Por exemplo, o exemplo de legenda de dados a seguir com o ValueFormatCulture conjunto como "en-GB" para exibir o símbolo de libras esterlinas (£):

Blazor Data Legend Grouping

DataLegendGroup pode ser definido, em todos os tipos de séries, como uma string que categorizará um grupo de séries na Legenda de Dados. Cada grupo terá sua própria linha de resumo exibida antes que outro grupo de séries seja exibido: Por padrão, DataLegend ocultará nomes de grupos, mas você pode exibir nomes de grupos definindo a GroupRowVisible propriedade como true.

Blazor Data Legend Styling & Events

Várias propriedades são expostas, incluindo partes de agrupamento da legenda.

GroupRowMargin
GroupTextMargin
GroupTextColor
GroupTextFontSize
GroupTextFontFamily
GroupTextFontStyle
GroupTextFontStretch
GroupTextFontWeight
HeaderTextMargin
HeaderTextColor
HeaderTextFontSize
HeaderTextFontFamily
HeaderTextFontStyle
HeaderTextFontStretch
HeaderTextFontWeight

O IgbDataLegend tem vários eventos que são acionados ao renderizar sua linha correspondente, mesmo durante interações do mouse em que os valores estão sendo atualizados. Esses eventos estão listados abaixo com uma descrição do que eles foram projetados para serem usados:

StyleGroupRow: esse evento é acionado para cada grupo para estilizar o texto exibido em linhas de grupo.
StyleHeaderRow: esse evento é acionado ao renderizar a linha de cabeçalho.
StyleSeriesRow: esse evento é acionado uma vez para cada linha da série, o que permite o estilo condicional dos valores da série.
StyleSeriesColumn: esse evento é acionado uma vez para cada coluna da série, o que permite o estilo condicional das diferentes colunas da série no gráfico.
StyleSummaryRow: esse evento é acionado uma vez ao renderizar a linha de resumo.
StyleSummaryColumn: esse evento é acionado uma vez ao renderizar a coluna de resumo.

Alguns dos eventos expõem um IgbDataLegendStylingRowEventArgs parâmetro como seus argumentos, o que permite personalizar o texto de cada item, a cor do texto e a visibilidade geral da linha. Os argumentos de evento também expõem propriedades específicas do evento. Por exemplo, como o StyleSeriesRow evento é acionado para cada série, os argumentos do evento retornarão o índice da série e o título da série para a linha que representa a série.

StyleSummaryColumn e SeriesStyleColumn eventos expõem um IgbDataLegendStylingColumnEventArgs parâmetro como seus argumentos, para personalizar cada campo na série. Os argumentos de evento também expõem propriedades específicas do evento, como índice de coluna e propriedades relacionadas ao membro de valor sobre as colunas.