Web Components Filtro de resaltado de gráfico
Los componentes de gráfico de Ignite UI for Web Components admiten una superposición de resaltado de datos que puede mejorar la visualización de las series trazadas en esos gráficos al permitirle ver un subconjunto de los datos trazados. Cuando está habilitado, esto resaltará un subconjunto de datos mientras muestra el conjunto total con una opacidad reducida en el caso de los tipos de serie de columna y área, y una línea discontinua en el caso de los tipos de serie de líneas. Esto puede ayudarte a visualizar cosas como los valores objetivo frente a los valores reales con tu conjunto de datos. Esta característica se muestra en el siguiente ejemplo:
Tenga en cuenta que la función de resaltado de datos es compatible con la función IgcDataChartComponent
y IgcCategoryChartComponent
, pero se configura de diferentes maneras en esos controles debido a la naturaleza de cómo funcionan esos controles. Sin embargo, una cosa permanece constante con esta función, en el sentido de que debe establecer el parámetro highlightedValuesDisplayMode
propiedad a Overlay
si quieres ver lo más destacado. A continuación se explican las diferentes configuraciones para la función de filtro de resaltado.
Using Highlight Filter with DataChart
En la API de filtro de resaltado, gran parte de la API de filtro de resaltado se produce en las propias series, principalmente estableciendo la IgcDataChartComponent
HighlightedItemsSource
propiedad en una colección que representa un subconjunto de los datos que desea resaltar. El recuento de los elementos de la debe coincidir con el recuento de los datos enlazados a la ItemsSource
de la serie que desea resaltar y, en el caso de las series de categorías, utilizará la HighlightedItemsSource
ValueMemberPath
que ha definido como ruta de resaltado de forma predeterminada. En el ejemplo de la parte superior de esta página se utiliza el HighlightedItemsSource
método in the IgcDataChartComponent
para mostrar la superposición.
En el caso de que el esquema no coincida entre el y el HighlightedItemsSource
ItemsSource
de la serie, puede configurarlo mediante la propiedad de la HighlightedValueMemberPath
serie. Además, si desea utilizar el ItemsSource
de la propia serie como origen de resaltado y tiene una ruta de acceso en el elemento de datos que representa el subconjunto, puede hacerlo. Esto se hace simplemente estableciendo la HighlightedValueMemberPath
propiedad en esa ruta de acceso y no proporcionando un HighlightedItemsSource
.
La opacidad reducida de los tipos de serie de columnas y áreas se puede configurar estableciendo el parámetro highlightedValuesFadeOpacity
propiedad de la serie. También puede establecer el parámetro highlightedValuesDisplayMode
propiedad a Hidden
si no desea ver la superposición en absoluto.
La parte de la serie mostrada por el filtro de resaltado se representará en las capas de leyenda y descripción emergente del gráfico por separado. Puede configurar el título que se le da en la información sobre herramientas y la leyenda estableciendo el highlightedTitleSuffix
. De este modo, se anexará el valor que proporcione al final de la chartTitle
serie.
Si se utiliza o, DataLegend
IgcDataToolTipLayerComponent
la serie resaltada aparecerá agrupada. Esto se puede administrar estableciendo la HighlightedValuesDataLegendGroup
propiedad en la serie para categorizarlas adecuadamente.
En el ejemplo siguiente se muestra el uso de la característica de superposición de resaltado y agrupación de leyendas de datos dentro del IgcDataChartComponent
control mediante el uso de HighlightedValuesDataLegendGroup
:
En el ejemplo siguiente se muestra el uso de la característica de superposición de resaltado y agrupación de leyendas de datos dentro del IgcDataChartComponent
control mediante el uso de HighlightedValuesDataLegendGroup
:
En el ejemplo siguiente se muestra el uso de la característica de superposición de resaltado de datos dentro del IgcDataChartComponent
control mediante HighlightedValueMemberPath
:
Using Highlight Filter in CategoryChart
El filtro de IgcCategoryChartComponent
resaltado se produce en el gráfico estableciendo la initialHighlightFilter
propiedad. Dado que el tiene en cuenta todas las propiedades del elemento de datos subyacente de forma predeterminada, también deberá definirlas initialGroups
en el IgcCategoryChartComponent
gráfico para que los datos se puedan agrupar y agregar de manera que pueda tener un subconjunto de los datos para filtrar. Puede establecer el en una ruta de acceso de valor en el initialGroups
elemento de datos subyacente para agrupar por una ruta de acceso que tenga valores duplicados.
Al igual que el, la highlightedValuesDisplayMode
propiedad también está expuesta en el IgcDataChartComponent
IgcCategoryChartComponent
. En el caso de que no desee ver la superposición, puede establecer esta propiedad en Hidden
.
En el ejemplo siguiente se muestra el uso de la característica de superposición de resaltado de datos dentro del IgcCategoryChartComponent
control:
Additional Resources
Puede encontrar más información sobre las funciones de gráficos relacionadas en estos temas:
- Resaltado de gráfico
- Información sobre herramientas de datos del gráfico
- Agregaciones de datos de gráficos
API References
La siguiente es una lista de miembros de API mencionados en las secciones anteriores:
IgcCategoryChartComponent Properties |
IgcDataChartComponent Properties |
---|---|
CategoryChart.HighlightedItemsSource |
Series.HighlightedItemsSource |
highlightedTitleSuffix |
highlightedTitleSuffix |
CategoryChart.HighlightedValueMemberPath |
Series.HighlightedValueMemberPath |
highlightedValuesDisplayMode |
highlightedValuesDisplayMode |
highlightedValuesFadeOpacity |
highlightedValuesFadeOpacity |
highlightedValuesDisplayMode |
highlightedValuesDisplayMode |
initialHighlightFilter |
|
initialGroups |