# Donut

The Donut chart gives you an overview of the percentage shares of a whole.

<div data-full-width="true"><figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FeAAP7rDRk2JqskJtK07Y%2F765B55AD-7F61-438E-9470-8DD09AD659DD.png?alt=media&#x26;token=bb722058-f08e-4dc4-9253-72e11cf5bb39" alt=""><figcaption><p>The Donut chart</p></figcaption></figure></div>

## When should this widget be used?

When you want to see at a glance what percentage of a total consumption is used by individual devices.

## Configure Widget

{% @supademo/embed url="<https://app.supademo.com/demo/k-ITYKo5HqN5ga6Li6aW0>" demoId="k-ITYKo5HqN5ga6Li6aW0" fullWidth="true" %}

### Change the order of the displayed assets

You can adjust the order in which the assets are displayed in the Donut chart.

When creating assets: Use **\[A]** to drag and drop the individual assets into the desired order.

You can also make these settings afterward by using the [-> Edit widget option](https://docs.buildings.ability.abb/collection/platform/live-cockpit/widgets/operating-widgets).

<figure><img src="https://3489494878-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9GvUpaatBiReR43XFSMg%2Fuploads%2FJQCCdlkPBTLRuSJUGVF5%2F9FC1AC59-F5E1-4739-9ABA-E13132FB72DA.png?alt=media&#x26;token=c3e32562-762d-4e6d-afe4-654f4f25d218" alt=""><figcaption><p>The order of the displayed assets can be changed.</p></figcaption></figure>