Documentation menu

The Toolbar

Our reporting tool comes with the Toolbar, which gives you access to the most useful features. This article explains how to use the Toolbar.

Show the Toolbar

By default, the Toolbar is hidden in WebDataRocks.

To show the Toolbar, follow the steps below:

Step 1. Include the webdatarocks.toolbar.min.js file to the webpage:

<script src="https://cdn.webdatarocks.com/latest/webdatarocks.toolbar.min.js"></script>

Step 2. Specify the toolbar: true parameter when creating a WebDataRocks instance:

let pivot = new WebDataRocks({
container: "#pivot-container",
toolbar: true
});

Hide the Toolbar

If you want to display the component without the Toolbar, you can remove toolbar: true from your code or set the toolbar parameter to false:

let pivot = new WebDataRocks({
container: "#pivot-container",
toolbar: false
});

Available functionality

The Toolbar contains the following tabs:

menu_connect
Connect
Allows connecting to your JSON or CSV data source.
menu_open
Open
Allows opening locally or remotely saved reports.
menu_save
Save
Saves your current report configuration into a local JSON file.
menu_export
Export
Allows printing the current report or exporting it into various formats.
menu_format
Format
Provides access to number formatting and conditional formatting.
menu_options
Options
Opens the Layout options pop-up window, where you can show/hide totals or switch between the classic, compact, and flat forms.
menu_fields
Fields
Opens the Field List, where you can select which data is shown in rows, columns, measures, and report filters.
menu_fullscreen_open
Fullscreen
Switches WebDataRocks between the fullscreen and windowed mode. You can also exit fullscreen by pressing Esc.

Adjust the Toolbar to your needs

You can customize the standard view and functionality of the Toolbar (e.g., add new tabs or remove the ones you don’t need). If you are interested in such an option, follow this tutorial: Customize the Toolbar.

See also