> For the complete documentation index, see [llms.txt](https://docs.bdb.ai/governed-dashboards-1/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.bdb.ai/governed-dashboards-1/getting-started/overview-of-designer-module/dashboard-canvas-page/canvas-properties.md).

# Canvas Properties

The Designer canvass is provided with specific properties.

* Navigate to the ***Designer*** canvas.
* Use the Right-click anywhere on the canvas.
* Select the ***Properties*** option from the context menu.

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FElyXodKeCoiOyEVs5xB9%2Fimage.png?alt=media&#x26;token=d7f4f193-002a-45f5-aaef-e012309d9dd0" alt=""><figcaption><p><em>Accessing the Canvas Properties option</em></p></figcaption></figure>

* The following ***Canvas*** properties will be displayed:

​![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FWgGgwqzrjlkItqU9oAdZ%2Fimage.png?alt=media\&token=08118e82-521f-404a-966e-d847f9c8eb59)​

## **Gradient**

​![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2F8lEEoEdN5JB23iKJaMIZ%2Fimage.png?alt=media\&token=82606914-5a9b-4f96-b436-d1709f9a3143)​​

| **Parameter Name**  | **Description**                                          |
| ------------------- | -------------------------------------------------------- |
| Background Colors   | Users will be directed to select a background color.     |
| Opacity             | Set background-color opacity.                            |
| Background Rotation | Set the value to rotate the background color accordingly |

{% hint style="info" %}
*<mark style="color:green;">Please Note:</mark>* *By clicking the **Background Colors** icon, a new window opens with a menu to select a color for the **Background** (as displayed in the below-given image)* *gradient colors. The users can select a color using the menu and click the **Save** option to apply the selected background gradient color. The colors pallet to set background gradient color is given below:*

![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FWu4ZlJJQmuIoPDRFmH3Y%2Fimage.png?alt=media\&token=2af2526d-c24d-429b-a858-efdc8dcaf92f)
{% endhint %}

## **Border**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2F2QvQMF58lNZToDdzWmO3%2Fimage.png?alt=media&#x26;token=5cc38ccc-9f3c-49d8-8308-c0e38c1c9cae" alt=""><figcaption><p>The Border Properties fields​</p></figcaption></figure>

| **Parameter Name** | **Description**                      |
| ------------------ | ------------------------------------ |
| Thickness          | Set border thickness.                |
| Border Color       | Select a border color from the menu. |

## **Global Font And Themes**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FBcoiSdWO3rWkJqVqOijl%2Fimage.png?alt=media&#x26;token=1c0deb25-fcf8-479f-b5b2-a49bf08c1694" alt=""><figcaption><p>Global Font and Themes properties fields</p></figcaption></figure>

**​**

| **Parameter Name**  | **Description**                             |
| ------------------- | ------------------------------------------- |
| Use Global Shadow   | Enable this option to display global shadow |
| Shadow Color        | Select a color from using the menu          |
| Shadow Transparency | Set the transparency for the shadow         |
| Use Global Font     | Enable this option to use the global font.  |
| Font Family         | Select a font type from the drop-down menu. |
| Designer Themes     | Select a theme from the drop-down menu.     |

## **Screen Size**

{% hint style="success" %}
Check out the given walk-through on how redraw on resize Property gets applied to the Dashboard.
{% endhint %}

<figure><img src="https://2847660295-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTmpwImm2wvMpv2GGC779%2Fuploads%2FmeTuB9thgJyTTDin2Kt9%2FDashboard%20redraw%20on%20resize1.gif?alt=media&amp;token=d37b8435-1c36-48b4-b2ef-324658b72d18" alt=""><figcaption><p>Displaying Redraw on Resize option</p></figcaption></figure>

![](https://2847660295-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FTmpwImm2wvMpv2GGC779%2Fuploads%2FJujiceUTKnew1bvQ7qF9%2Fimage.png?alt=media\&token=c3f46031-45c4-4c9a-8af5-4852dedfc677)

**​**

| **Parameter Name** | **Description**                                                                                 |
| ------------------ | ----------------------------------------------------------------------------------------------- |
| Screen Size        | Select an option from the drop-down menu.                                                       |
| Width              | Increase/decrease the width of the dashboard.                                                   |
| Height             | Increase/decrease the height of the dashboard.                                                  |
| Redraw on resize   | Redraws the dashboard while resizing it.                                                        |
| Enable Scaling     | Enable this option to display scaling.                                                          |
| Scaling View       | Select an option from the drop-down menu (Fit to page/Fit to width/Fit to height/Proportional). |
| Align              | Gets aligns based on the selected Align option.                                                 |

{% hint style="info" %}
*<mark style="color:green;">Please Note:</mark> The Dashboard screen size can be scaled based on display devices (E.g., Mobile, iPad, and PC).*
{% endhint %}

### **Steps to set the Screen Size**

* Click the drop-down icon for the ***Screen Size*** field.
* A context menu appears displaying various options to set the Screen Size.

&#x20;    *​*![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FG0fbVCrV1vOmdcm41QG3%2Fimage.png?alt=media\&token=79a00696-e112-41b0-bf91-0b7fcb3efc89)*​*

## **Language Mapping**

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FSULoAM4tPvK0shDrLCdi%2Fimage.png?alt=media&#x26;token=519e30eb-0036-463a-a98b-0529f2f5af1c" alt=""><figcaption><p>Language Mapping Properties fields</p></figcaption></figure>

**​**

| **Parameter Name** | **Description**                                             |
| ------------------ | ----------------------------------------------------------- |
| Enable             | Enable this option to apply language mapping functionality. |
| Hide Curly Braces  | Enable this option to hide the curly braces.                |
| Select a Mapping   | Select a language mapping using the drop-down menu.         |

Please Note: *By clicking on the **Select a Mapping** icon, the **Language Mapping Selection** dialog box opens.*

### **Steps to Map a Language**

* Navigate to the ***Language Mapping Selection*** dialog box.
* Select a language mapping option using the Mapping List drop-down menu.
* Click the ***Save*** option.

<figure><img src="https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FSz0141NklJwpu7nHDY9h%2Fimage.png?alt=media&#x26;token=a6220817-1231-4206-8dac-7a4ecd455da8" alt=""><figcaption><p>Mapping a Language</p></figcaption></figure>

## **Cache**

​![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2FocbOKTqwq6pDGO5H1Tyu%2Fimage.png?alt=media\&token=4e949e87-12a8-4fd8-9048-7cd4bc6c90cf)​

Use a checkmark in the given box to enable the ***Enable Cache*** option for the data service. If cache is enabled for a dashboard with a data service as a data source it will do the following tasks:

* While loading the dashboard, for the first time data will hit from database.
* The same dashboard while loading again it will load the data from the Cache.

## **Report Burst**

​![](https://859511478-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGDmsjfjJBNqow7Fo97cO%2Fuploads%2F5XHzIU1rrpWcAMbghEyM%2Fimage.png?alt=media\&token=5627f9aa-80d7-44d6-9625-c43219bd7472)​

Use a checkmark in the given box to ***Enable Report Burst.*** By enabling the Report Burst option from the Dashboard properties displays the ***Report Burst*** option for a published Dashboard. Refer the [***Report Burst*** ](https://docs.bdb.ai/7.6/core-platform/getting-started/homepage/documents-folders/document-options/options-for-a-published-dashboard#report-burst)section from the [***Options for a Published Dashboard***](https://docs.bdb.ai/7.6/core-platform/getting-started/homepage/documents-folders/document-options/options-for-a-published-dashboard) section for more details.

{% hint style="info" %}
*<mark style="color:green;">Please Note:</mark> The Report Burst option comes pre-selected in all the new dashboards.*
{% endhint %}
