2-Column Progress Bar Chart Dashboard Widgets


This block includes two dashboard widgets for displaying progress bar charts with metrics:


  • When this block is added to a page, it is placed within a group called Blocks container 860 (do not rename) on the page. This group contains the responsive settings for all blocks.

  • This block contains two groups:

    • Group Responsive chart 1 contains two progress bar metric groups with labels for each metric

    • Group Responsive chart 2 contains three progress bar metric groups without logos for each metric

How to set up the progress bar elements within each chart

  • All progress bar elements are Bubble elements that can dynamically display a percentage:

  • For example, if you would like to display which percentage of revenue comes from a specific source (e.g., Shopify), you can set that progress bar's "Percentage" data source to be that dynamic expression (e.g., [Shopify Revenue numeric value]/[Total Revenue numeric value])

For more information on using hidden variables, please visit this section of the Canvas Manual.

How to set up the title, menufocus, and button elements

  • Clone and replace, or hide the menufocus_template elements depending on whether the the app needs to associate more actions with this table (e.g., Edit, Delete). For more information about how to best use menufocus_template within your application, please click here.

  • Update the title and description above the Group Inner Large Title container groups, or hide the groups if they are not needed.

  • Modify or hide the Group Secondary action elements.

  • Modify or hide the Group Primary action elements.

Last updated