Dashboard

There is a single react component that renders the dashboard. The method parameter required depends on the value of the type property you provide it.

The available types include are in-browser, self-hosted and custom.

Self-hosted

Results are fetched from the Vizzly query engine deployed to your cloud environment. The code snippet below is ready to be copied & pasted into your project!

import Vizzly from '@vizzly/dashboard';
 
<Vizzly.Dashboard
  type='self-hosted'
 
  // e.g 'https://analytics.example.com'
  vizzlyDockerImageEndpoint='<< The endpoint of your Vizzly query engine >>'
 
  // https://docs.vizzly.co/callbacks/identity
  identityCallback={async () => {
 
    // Opens a guide... replace this when you're ready!
    throw new Vizzly.NewVizzlyImplementation();
 
  }}
/>

Custom

If you have complex query or authentication requirements, then this option is for you. The following React code is mixed with some typescript type definitions to get you started.

import Vizzly from '@vizzly/dashboard';
 
<Vizzly.Dashboard
  type: 'custom'
 
  // https://docs.vizzly.co/callbacks/identity
  identityCallback: VizzlyComponents.identityCallback;
 
  // https://docs.vizzly.co/callbacks/runQueriesCallback
  runQueriesCallback: VizzlyComponents.runQueriesCallback;
 
  // https://docs.vizzly.co/callbacks/loadDataSetsCallback
  loadDataSetsCallback: VizzlyComponents.loadDataSetsCallback;
/>

In-browser

If each of your users have very small amounts of data < 3mb in total, then this option is for you. The following React code is mixed with some typescript type definitions to get you started.

import Vizzly from '@vizzly/dashboard';
 
<Vizzly.Dashboard
  type: 'in-browser'
 
  // https://docs.vizzly.co/callbacks/identity
  identityCallback: VizzlyComponents.identityCallback;
 
  // https://docs.vizzly.co/callbacks/loadDataCallback
  loadDataCallback: VizzlyComponents.loadDataCallback;
 
  // https://docs.vizzly.co/callbacks/loadDataSetsCallback
  loadDataSetsCallback: VizzlyComponents.loadDataSetsCallback;
/>

Last updated on December 22, 2022

Setup Config File Identity