How to Use Conditional Formatting for Inserting Images with Values in Grid Widget

In Bold BI, the Grid widget is designed to display data in a tabular format, with support for conditional formatting. This feature allows you to highlight data or display icons and images based on certain conditions. This article guide will walk you through the process of inserting images into a Grid column alongside the column values.

Steps for Adding Images to a Grid Column:

1. Configure the Grid Widget: Begin by setting up the Grid widget with the required data. For example, if you’re dealing with country population data, ensure the grid is set up accordingly.
   

   

2. Access the Properties Tab: Within the Grid widget settings, navigate to the Properties tab. Scroll down to the Formatting section and select the column where you want to place images along with the values. Click on the Advanced Setting option.
   

   

3. Apply Conditional Formatting: In the Formatting Settings dialog, choose the Rule option. The selected Grid column will be displayed in the Based On dropdown. Define the condition and enable the Icon option.
   

   

4. Set Custom Icons: Open the Icon dropdown menu and select the Custom option to insert the desired image.
   

   

5. Upload Images: In the Custom Icon dialog, you can upload an image from your computer using the Browse option or provide an image URL.

   1. Upload Option: Select Upload and locate the image file on your device to upload it.
      

      

   2. URL Option: Alternatively, input an image URL directly in the provided input field.
      

      

6. Align Images and Values: Once the image is added, you can align it to the left or right of the column value. You can also choose the Icon Only option to display only the image without text.
   

   

7. Add Additional Conditions: Use the Add Condition feature to set up images for other values within the column, following the same steps as above.
   

   

8. Finalize and View: After configuring all conditions, the Grid widget’s column will display both values and associated images as specified.
   

   

By following these steps, you can enhance the visual presentation of your Grid widget in Bold BI dashboards. Including images can make the data visualization experience more engaging and informative for users.

Additional Reference Links:

1. Conditional Formatting in Grid Widget
2. How to Apply Conditional Formatting in Grid Widget