# 2-Column Chart and Key Metrics Dashboard Widgets

## Overview

![](https://1483599141-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LbzMeM9XfnblRd78nga%2F-MWxj-Z1VVkp7G1EEmTV%2F-MWxl0zrKu6GiViKQZH5%2F2charts.png?alt=media\&token=e2d6cd2a-71d6-4ff9-be95-23bcbf638fbf)

The block includes two common dashboard widgets for displaying a chart and key metrics.

## Structure

* 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 Inner chart** contains a Bubble chart element for displaying graphs
  * **Group Inner metrics** contains various text elements for displaying metrics
* This block also includes two reusable elements that you can customize:
  * [**filters\_template**](https://docs.airdev.co/canvas-pages-and-modules/v/3.0.0/reusables/applyfilters)
  * [**menufocus\_template**](https://docs.airdev.co/canvas-pages-and-modules/v/3.0.0/reusables/menufocusgroup-or-menu-options)
    * You may need to clone this reusable element to use a different data source for the chart and metrics

## How to set up

* Clone and replace, or hide the **menufocus\_template** element 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](https://docs.airdev.co/canvas-pages-and-modules/v/3.0.0/reusables/menufocusgroup-or-menu-options).
* Modify the text element data sources
* Update the data source for **Line/BarChart**
* Hide any UI elements that you are not using by unchecking the element's box for This element is visible on page load
