Ejemplos de paneles de filtrado

Este tema de ayuda ofrece varios ejemplos que muestran cómo puede personalizar el estilo y otras propiedades en los paneles de filtrado para lograr una serie de propósitos funcionales.

Ejemplo 1 — Diseño condensado

Puede añadir muchos cuadros de lista a un panel de filtrado, lo que permite refinar los datos en muchas dimensiones diferentes.

Para ahorrar espacio y priorizar otras visualizaciones en su hoja, puede dar a su panel de filtrado un diseño condensado donde el contenido se expande y contrae según sea necesario.

Haga lo siguiente:

1. Cree una nueva app y pegue el Ejemplo: script de carga en una nueva sección en el Editor de carga de datos. A continuación, cargue los datos.

2. Cambie al modo de vista de hoja. En las propiedades de la hoja, establezca Espaciado de línea de cuadrícula en 42.

3. Agregue un Panel de filtrado a la hoja.

4. Haga clic en Añadir dimensión. Seleccione Country.

5. En el panel de propiedades, haga clic en Añadir campo. Seleccione Item Type.

6. Usando el botón Añadir campo, añada otras cuatro dimensiones como cuadros de lista:

   • Order Year

   • Order Priority

   • Region

   • Sales Channel

7. Uno a uno, expanda cada cuadro de lista que acaba de añadir y configure Presentación > Contraer cuadro de lista en Siempre.

8. En el panel de propiedades, expanda Aspecto > Presentación.

9. Haga clic en Opciones de estilo.

10. En la pestaña Panel de filtrado, establezca las siguientes propiedades:

    • Tamaño de fuente para Título: 18px

    • Color de fuente para Título: Código hexadecimal #ffffff

    • Color de fondo: código hexadecimal #87205d

    • Sombra: pequeña, código hexadecimal #000000

11. En la pestaña Cuadros de lista, establezca las siguientes propiedades:

    • Tamaño de fuente para Encabezado: 14px

12. Cambie el tamaño del panel de filtrado a un espacio de dos por diez en la cuadrícula de la hoja.

Cambie al modo de análisis. Puede expandir los cuadros de lista según sea necesario para hacer selecciones.

Ejemplo 2 — Diseño enriquecido

Aunque un panel de filtrado se utiliza principalmente para filtrar datos, también se puede utilizar para visualizar datos. La incorporación de un diseño enriquecido permite a los analistas obtener información a medida que realizan diferentes selecciones.

Haga lo siguiente:

1. Cree una nueva app y pegue el Ejemplo: script de carga en una nueva sección en el Editor de carga de datos. A continuación, cargue los datos.

2. Cambie a la vista de hoja y arrastre un panel de filtrado a la hoja.

3. Haga clic en Añadir dimensión. Seleccione Item Type.

4. Haga clic en el Item Type cuadro de lista para ampliar sus propiedades.

5. Expanda Presentación.

6. Active la configuración de Histograma.

7. Utilice el menú desplegable Mostrar frecuencia para seleccionar Frecuencia relativa (%).

8. Configure Contraer cuadro de lista en Nunca.

9. Expanda Ordenación.

10. Establezca la Ordenación en Personalizada.

11. Borre todas las opciones y active Ordenar por expresión.

12. Seleccione Descendente.

13. En Expresión, introduzca la siguiente expresión:

    Count([Item Type])

14. En el panel de propiedades, expanda Aspecto > General.

15. Desactive Mostrar títulos.

16. Expanda Aspecto > Presentación.

17. Haga clic en Opciones de estilo.

18. En la pestaña Cuadros de lista, establezca las siguientes propiedades:

    • Encabezado:

      • Fuente: Inter, sans-serif

      • Tamaño de fuente: 18px

    • Contenido:

      • Fuente: Inter, sans-serif

19. Cambie el tamaño del panel de filtrado a una forma rectangular pequeña, por ejemplo, tres por cuatro cuadrados.

Ejemplo 3 — Diseño enfocado

Cómo diseñe su panel de filtrado dependerá de cómo desee que los usuarios hagan sus selecciones. Por ejemplo, podría querer restringir a los usuarios de ciertas funciones para fomentar una interacción más limitada y enfocada con los datos.

Los escenarios incluyen:

• Filtrar en su dimensión particular aporta la mayor perspectiva cuando los valores se seleccionan de uno en uno, o seleccionar varios valores no proporciona ninguna perspectiva significativa. Para guiar el análisis de esta manera, puede desactivar la selección de rango usando el modo de casilla de verificación.

• Buscar valores en el campo no proporciona ninguna información o no es deseable.

• Desea minimizar las distracciones al filtrar datos, por ejemplo, la barra de herramientas de selecciones.

Haga lo siguiente:

1. Cree una nueva app y pegue Ejemplo: script de carga en una nueva sección en el Editor de carga de datos. A continuación, cargue los datos.

2. Cambie a la vista de hoja y arrastre un panel de filtrado a la hoja.

3. Haga clic en Añadir dimensión. Seleccione Item Type.

4. Haga clic en el cuadro de lista Item Type para ampliar sus propiedades.

5. Establezca Búsqueda en Ocultar.

6. Desactive Mostrar la barra de herramientas de selección.

7. Expanda Presentación.

8. Active el Modo casilla de verificación.

9. En el panel de propiedades, expanda Aspecto > General.

10. Desactive Mostrar títulos.

11. Cambie el tamaño del panel de filtrado a una forma rectangular pequeña, por ejemplo, tres por cuatro cuadrados.

Ejemplo 4 — Diseño de cuadrícula

Puede usar el modo de cuadrícula para los paneles de filtrado que utilicen conjuntos de datos pequeños y definidos. Un buen ejemplo es organizar las dimensiones basadas en el tiempo en cuadrículas.

Haga lo siguiente:

1. Cree una nueva app y pegue Ejemplo: script de carga en una nueva sección en el Editor de carga de datos. A continuación, cargue los datos.

2. Cambie a la vista de hoja y arrastre un panel de filtrado a la hoja.

3. Haga clic en Añadir dimensión. Seleccione Order Year.

4. Haga clic en el cuadro de lista Order Year para expandir sus propiedades.

5. Desactive Mostrar títulos.

6. Expanda Presentación.

7. Configure Contraer cuadro de lista en Nunca.

8. En Mostrar datos en, seleccione Cuadrícula.

9. Establezca Máximo de columnas visibles en Personalizado.

10. Establezca Máximo de columnas en 3.

11. Añada Order Quarter como un cuadro de lista en el panel de filtrado.

12. Haga clic en el Order Quarter cuadro de lista para ampliar sus propiedades.

13. Desactive Mostrar títulos.

14. Expanda Presentación.

15. Configure Contraer cuadro de lista en Nunca.

16. En Mostrar datos en, seleccione Cuadrícula.

17. Establezca Ordenar por en Columnas.

18. Establezca Máximo de filas visibles en Personalizado.

19. Establezca Máximo de columnas en 1.

20. Añada Order Month como un cuadro de lista en el panel de filtrado.

21. Haga clic en el Order Month cuadro de lista para ampliar sus propiedades.

22. Desactive Mostrar títulos.

23. Expanda Presentación.

24. Configure Contraer cuadro de lista en Nunca.

25. En Mostrar datos en, seleccione Cuadrícula.

26. Establezca Máximo de columnas visibles en Personalizado.

27. Establezca Máximo de columnas en 4.

28. En el panel de propiedades, expanda Aspecto > General.

29. Desactive Mostrar títulos.

30. En el panel de propiedades, expanda Aspecto > Presentación.

31. Haga clic en Opciones de estilo.

32. En la pestaña Panel de filtrado, establezca las siguientes propiedades:

    • Color de fondo: #83af9b

33. En la pestaña Cuadros de lista, establezca las siguientes propiedades:

    • Contenido:

      • Fuente: Fredoka One, fantasy

      • Tamaño del texto: 15px

      • Tamaño del texto: Negrita

      • Color del texto: #000000

    • Estado de selección > Posible: #000000

    • Color de fondo: #83af9b

34. Cambie el tamaño del panel de filtrado a un tamaño que funcione bien para la pantalla, por ejemplo, tres por tres.

Mejoras adicionales: panel de filtrado compuesto con el contenedor de diseño

Para una mayor capacidad de respuesta y control, podría crear el panel de filtrado anterior como una serie de tres paneles de filtrado incrustados dentro de un contenedor de diseño. La imagen siguiente muestra un ejemplo de cómo podría verse.

Ejemplo 5 — Alineación con la paleta de colores de la organización

Los paneles de filtrado se pueden diseñar de acuerdo con la paleta de colores de su organización. Además de definir el color de fondo y el color del texto, puede establecer esquemas de color para los estados de selección en su panel de filtrado. Es posible que desee que las selecciones aparezcan en los colores principales de la marca de su empresa en lugar del color verde predeterminado.

Con las plantillas de estilo personalizadas, puede aplicar aún más el esquema de color de su organización estableciendo un color para las selecciones en todas las visualizaciones y en la barra de herramientas de selección. Para más información, consulte Plantillas de estilo personalizadas (solo en inglés).

En este ejemplo, creamos un panel de filtrado que refleje los siguientes colores de marca:

• Color principal: código hexadecimal #3100ff

• Color secundario: código hexadecimal #9ba7ff

Haga lo siguiente:

1. Cree una nueva aplicación y pegue los datos de ejemplo en una nueva sección en el Editor de carga de datos. A continuación, cargue los datos.

2. Cambie a la vista de hoja y arrastre un panel de filtrado a la hoja.

3. Haga clic en Añadir dimensión. Seleccione Item Type.

4. En el panel de propiedades, haga clic en Añadir campo. Seleccione Order Year.

5. Usando el botón Añadir campo, añada otras tres dimensiones como cuadros de lista:

   • Order Priority

   • Region

   • Sales Channel

6. En el panel de propiedades, expanda Aspecto > General.

7. Desactive Mostrar títulos.

8. Expanda Aspecto > Presentación.

9. Haga clic en Opciones de estilo.

10. En la pestaña Panel de filtrado, establezca las siguientes propiedades:

    • Sombra: pequeño, código hexadecimal #000000

11. En la pestaña Cuadros de lista, establezca las siguientes propiedades:

    • Tamaño de fuente para Encabezado: 14px

    • Estado de selección:

      • Seleccionado: código hexadecimal #3100ff

      • Alternativa: código hexadecimal #9ba7ff

      • Excluido: #bebebe

      • Seleccionado excluido: #7b7a78

      • Posible: #ffffff

12. Cambie el tamaño del panel de filtrado a una forma rectangular larga en un lado de la hoja; por ejemplo, tres por doce cuadrados.

Cambie al modo de análisis. Realice selecciones en el panel de filtrado para ver la combinación de colores.

Ejemplo: script de carga

Sales:
LOAD 
Dual([Order Month Text], [Order Month Num]) as [Order Month],

* INLINE [
Order ID,Order Date,Order Year,Order Quarter,Order Month Text,Order Month Num,Region,Country,Item Type,Sales Channel,Order Priority,Ship Date,Units Sold,Unit Price,Unit Cost,Total Revenue,Total Cost,Total Profit
522840487,2/8/2021,2021,Q1,Feb,2,Central America and the Caribbean,Honduras,Household,Offline,H,2/13/2017,8974,668.27,502.54,5997054.98,4509793.96,1487261.02
832401311,2/19/2021,2021,Q1,Feb,2,Asia,Mongolia,Personal Care,Offline,C,2/23/2014,4901,81.73,56.67,400558.73,277739.67,122819.06
419123971,11/19/2021,2021,Q4,Nov,11,Asia,Sri Lanka,Cosmetics,Offline,M,12/18/2016,6952,437.2,263.33,3039414.4,1830670.16,1208744.24
441619336,12/30/2021,2021,Q4,Dec,12,Asia,Turkmenistan,Household,Offline,L,1/20/2011,3830,668.27,502.54,2559474.1,1924728.2,634745.9
795490682,6/30/2022,2022,Q2,Jun,6,Central America and the Caribbean,Honduras,Snacks,Online,L,7/26/2016,2225,152.58,97.44,339490.5,216804,122686.5
158535134,10/27/2022,2022,Q4,Oct,10,Australia and Oceania,Australia,Office Supplies,Online,C,11/25/2015,2924,651.21,524.96,1904138.04,1534983.04,369155
955357205,1/5/2022,2022,Q1,Jan,1,Europe,United Kingdom,Household,Online,L,2/14/2012,282,668.27,502.54,188452.14,141716.28,46735.86
259353148,4/7/2022,2022,Q2,Apr,4,Sub-Saharan Africa,Djibouti,Cosmetics,Offline,H,4/19/2014,7215,437.2,263.33,3154398,1899925.95,1254472.05
450563752,6/9/2022,2022,Q2,Jun,6,Australia and Oceania,Australia,Cereal,Offline,H,7/2/2013,682,205.7,117.11,140287.4,79869.02,60418.38
705784308,10/30/2022,2022,Q4,Oct,10,Middle East and North Africa,Libya,Clothes,Offline,H,11/17/2010,6116,109.28,35.84,668356.48,219197.44,449159.04
505716836,10/13/2022,2022,Q4,Oct,10,Central America and the Caribbean,Haiti,Cosmetics,Offline,H,11/16/2013,1705,437.2,263.33,745426,448977.65,296448.35
807025039,7/25/2023,2023,Q3,Jul,7,Central America and the Caribbean,Belize,Clothes,Offline,M,9/7/2016,5498,109.28,35.84,600821.44,197048.32,403773.12
166460740,10/24/2023,2023,Q4,Oct,10,Europe,Lithuania,Office Supplies,Offline,H,11/17/2010,8287,651.21,524.96,5396577.27,4350343.52,1046233.75
462405812,4/23/2023,2023,Q2,Apr,4,Asia,Turkmenistan,Office Supplies,Online,M,5/20/2013,5010,651.21,524.96,3262562.1,2630049.6,632512.5
816200339,8/14/2023,2023,Q3,Aug,8,Middle East and North Africa,Libya,Fruits,Online,L,9/30/2015,673,9.33,6.92,6279.09,4657.16,1621.93
555990016,5/20/2023,2023,Q2,May,5,Sub-Saharan Africa,Djibouti,Cereal,Online,H,6/17/2017,8656,205.7,117.11,1780539.2,1013704.16,766835.04
231145322,7/5/2023,2023,Q3,Jul,7,Middle East and North Africa,Pakistan,Cosmetics,Offline,L,8/16/2013,9892,437.2,263.33,4324782.4,2604860.36,1719922.04
986435210,11/6/2023,2023,Q4,Nov,11,North America,Mexico,Household,Offline,C,12/12/2014,6954,668.27,502.54,4647149.58,3494663.16,1152486.42
217221009,10/28/2023,2023,Q4,Oct,10,Australia and Oceania,Federated States of Micronesia,Beverages,Online,C,11/15/2014,9379,47.45,31.79,445033.55,298158.41,146875.14
670854651,7/20/2024,2024,Q3,Jul,7,Australia and Oceania,Samoa,Cosmetics,Online,H,8/7/2013,9654,437.2,263.33,4220728.8,2542187.82,1678540.98
213487374,10/21/2024,2024,Q4,Oct,10,Europe,Spain,Household,Offline,L,11/30/2012,4513,668.27,502.54,3015902.51,2267963.02,747939.49
663110148,9/18/2024,2024,Q3,Sep,9,Middle East and North Africa,Lebanon,Clothes,Online,L,10/8/2012,7884,109.28,35.84,861563.52,282562.56,579000.96
827844560,3/18/2024,2024,Q1,Mar,3,Sub-Saharan Africa,Kenya,Vegetables,Online,L,4/7/2012,6457,154.06,90.93,994765.42,587135.01,407630.41
430915820,2/17/2024,2024,Q1,Feb,2,North America,Mexico,Personal Care,Offline,L,3/20/2012,6422,81.73,56.67,524870.06,363934.74,160935.32
240470397,7/7/2024,2024,Q3,Jul,7,Australia and Oceania,Australia,Beverages,Offline,H,7/11/2014,9389,47.45,31.79,445508.05,298476.31,147031.74
559427106,7/30/2024,2024,Q3,Jul,7,North America,Mexico,Personal Care,Offline,M,8/8/2015,5767,81.73,56.67,471336.91,326815.89,144521.02
665095412,2/10/2025,2025,Q1,Feb,2,Sub-Saharan Africa,Mozambique,Household,Offline,L,2/15/2012,5367,668.27,502.54,3586605.09,2697132.18,889472.91
];

drop fields [Order Month Text], [Order Month Num];