Blazor Chart Selection
La función de selección de Ignite UI for Blazor en Blazor {ComponentTitle} permite a los usuarios seleccionar, resaltar, delinear y, viceversa, anular la selección de una o varias series de forma interactiva dentro de un gráfico. Esto ofrece muchas posibilidades diferentes en cuanto a la forma en que los usuarios interactúan con los datos presentados de formas más significativas.
Configuring Selection
El comportamiento SelectionMode predeterminado está desactivado y requiere optar por una de las siguientes opciones. Hay varios modos de selección disponibles en: {ComponentName}
- Auto
- Ninguno
- Brighten
- DesvanecerOtros
- Escala de grisesOtros
- FocusColorThickOutline
- FocusColorOutline
- SelectionColorThickOutline
- SelectionColorOutline
- FocusColorFill
- SelectionColorFill
- Contorno grueso
Brighten desvanecerá el elemento seleccionado mientras FadeOthers que causará el efecto contrario. GrayscaleOthers se comportará de manera similar, FadeOthers pero en su lugar mostrará un color gris al resto de la serie. Tenga en cuenta que esto anulará cualquier SelectionBrush configuración. SelectionColorOutline y SelectionColorThickOutline trazará una frontera alrededor de la serie.
En conjunto, a está disponible para proporcionar un SelectionBehavior mayor control sobre los elementos que se seleccionan. El comportamiento predeterminado de Auto es PerSeriesAndDataItemMultiSelect.
- Auto
- PerDataItemMultiSelect
- PerDataItemSingleSelect
- PerSeriesAndDataItemMultiSelect
- PerSeriesAndDataItemSingleSelect
- PerSeriesAndDataItemGlobalSingleSelect
- PerSeriesMultiSelect
- PerSeriesSingleSelect
Configuring Selection via Color Fill
En el siguiente ejemplo se muestra la combinación de ambos SelectionColorFill y Auto el comportamiento de selección, también conocido como PerSeriesAndDataItemMultiSelect. Los rellenos de color proporcionan una señal visual útil, ya que cambian el color de fondo de todo el elemento de la serie. Al hacer clic en cada elemento, verá que el artículo cambia de verde a morado.
Configuring Multiple Selection
Otros modos de selección ofrecen varios métodos de selección. Por ejemplo, el uso de SelectionBehavior con PerDataItemMultiSelect afectará a todas las series de toda la categoría cuando haya varias series presentes, al tiempo que permitirá la selección entre categorías. En comparación con PerDataItemSingleSelect, solo se puede seleccionar una sola categoría de artículos a la vez. Esto es útil si varias series están enlazadas a diferentes fuentes de datos y proporciona un mayor control de la selección entre categorías. PerSeriesAndDataItemGlobalSingleSelect Permite la selección de una sola serie en todas las categorías a la vez.
Configuring Outline Selection
Cuando FocusBrush se aplica, las series seleccionadas aparecerán con un borde cuando la SelectionMode propiedad se establezca en una de las opciones de enfoque.
Radial Series Selection
Este ejemplo muestra otro tipo de serie a través de la IgbDataChart donde cada serie radial se puede seleccionar con diferentes colores.
Programmatic Selection
La selección de gráficos también se puede configurar en un código donde los elementos seleccionados en el gráfico se pueden ver al inicio o en tiempo de ejecución. Esto se puede lograr agregando elementos a la propiedad de la SelectedSeriesCollection IgbCategoryChart. La Matcher propiedad del IgbChartSelection objeto permite seleccionar una serie basada en un "matcher", ideal cuando no se tiene acceso a la serie real desde el gráfico. Si conoce las propiedades que contiene la fuente de datos, puede usar las ValueMemberPath que sería la serie.
El comparador es ideal para usar en gráficos, como el IgbCategoryChart cuando no tiene acceso a la serie real, como el IgbDataChart. En este caso, si conoce las propiedades que contenía el origen de datos, puede suponer los ValueMemberPaths que tendría la serie. Por ejemplo, si su fuente de datos tiene propiedades numéricas Nuclear, Carbón, Petróleo, Solar, entonces sabe que hay series creadas para cada una de estas propiedades. Si desea resaltar la serie enlazada a valores solares, puede agregar un objeto ChartSelection a la SelectedSeriesItems colección mediante un comparador con las siguientes propiedades establecidas
Por ejemplo, si su fuente de datos tiene propiedades numéricas Nuclear, Carbón, Petróleo, Solar, entonces sabe que hay series creadas para cada una de estas propiedades. Si desea seleccionar la serie enlazada a los valores solares, puede agregar un objeto ChartSelection a la colección SelectedSeriesItems mediante un comparador con las siguientes propiedades establecidas.
API References
La siguiente es una lista de miembros de API mencionados en las secciones anteriores:
IgbCategoryChart Properties |
IgbDataChart Properties |
|---|---|