Dashboard Control

Change your dashboard dynamically with VizzlyState. This functionality allows you to make changes to the Dashboard from outside the component, enhancing flexibility in data presentation.

Integrating State with Your Component

Synchronize your component with VizzlyState using the component's unique id. This identifier enables the state management services to apply changes to the component's properties or to enable interaction between different components.

To modify the state through VizzlyState, include the component's id as the first parameter:

import { VizzlyState } from '@vizzly/dashboard';
 
VizzlyState.set("example-identifier", {
    ... state changing here
})

<Vizzly.Dashboard
  id="example-identifier"
  // ... more props here
/>

Please note

For VizzlyState functionalities to be operational, the Dashboard must be fully loaded in the DOM. Utilize the onDashboardLoad callback to ensure that the new state is applied once the dashboard is completely initialized.

Core functions

Filters

Customize your dashboard's filters dynamically.

Learn more

Controls

It enables swift reload() or save(), optimizing dashboard interactivity.

Learn more