GoodData Dashboard plugins enable builders to customise GoodData Dashboards in accordance with their particular person wants or enterprise targets. If you wish to develop your personal plugin, examine the tutorial.

Observe: Missed the second article on this collection overlaying our Gauge Chart plugin? Learn it right here. Additionally, examine the following article from the dashboard plugins collection, which focuses on Polar Space Chart.

This text describes the Perception Teams plugin, which boosts person interface group by permitting a number of widgets to be grouped collectively. This plugin permits customers to pick out a widget from the group utilizing a brand new dropdown bubble within the widget header. Perception Teams is designed to enhance usability by offering an intuitive navigation and interplay expertise, particularly in complicated or intensive dashboards.

Create Your Perception Teams Plugin

If you wish to create your personal perception teams plugin, beneath are the steps to do it.

Step 1: Clone dashboard-plugin-examples repository

git clone https://github.com/gooddata/gooddata-dashboard-plugins.git

Step 2: Navigate to insight_groups_plugin

cd insight_groups_plugin

Step 3: Set atmosphere variables

Ensure you have your .env and .env.secrets and techniques recordsdata with the proper values. After you clone the repository, you will notice a .env.secrets and techniques.template file within the insight_groups_plugin folder. You could take away “template” from the filename to arrange all the things appropriately.

For .env, you have to to outline 4 variables:

# GoodData backend (code title)
BACKEND_TYPE=tiger

# GoodData host
BACKEND_URL=

# GoodData workspace id
WORKSPACE=

# GoodData dashboard id
DASHBOARD_ID=

Should you open a GoodData dashboard, you could find the BACKEND_URL, WORKSPACE_ID, and the DASHBOARD_ID within the URL like this:

https://<BACKEND_URL>/dashboards/#/workspace/<WORKSPACE_ID>/dashboard/<DASHBOARD_ID>

For .env.secrets and techniques, you have to just one variable:

# GoodData API token
TIGER_API_TOKEN=

Examine Create an API token documentation for extra data.

Step 4: Examine dependencies

Be sure that dependencies within the package deal.json file are aligned with the model of the SDK dashboard element you utilize in your challenge (in case you are embedding the dashboards with the GoodData SDK).

{
  ...
  "@gooddata/sdk-ui-dashboard": "^9.2.0" <-- should match within the plugin and your challenge 
  ...
}

Step 5: Construct a manufacturing model

Construct a manufacturing model of the plugin utilizing the command npm run build-plugin, or yarn build-plugin. When you’ve got already constructed this plugin, first delete the dist folder.

Step 6: Add the constructed plugin

Add the constructed plugin to your internet hosting. GoodData doesn’t present internet hosting on your plugin builds. If you construct your plugin, it’s a must to host it your self in a publicly obtainable location supporting HTTPS.

Additionally, be certain the internet hosting of your plugin is included within the allowed plugin hosts by CSP Coverage (documentation).

Step 7: Create plugin metadata object

Create a plugin metadata object utilizing the npm run add-plugin or yarn add-plugin command. For extra data, run the npm run add-plugin –assist or yarn add-plugin –help command.

Copy the plugin object-id famous within the console output for the following step.

Step 8: Hyperlink the plugin to the dashboard

Run npm run link-plugin —–with-parameters, or yarn link-plugin —–with-parameterscommand.

This command will open the textual content editor the place you paste the next string:

{
    //root secret's group title, will be random, just isn't seen anyplace
    "groupName1": [
        //list of all insights identifiers in group
        "insightIdentifier1",
        "insightIdentifier2"
    ],
    "groupName2": [
        "insightIdentifier3",
        "insightIdentifier4",
        "insightIdentifier5"
    ]
}

When you hyperlink the plugin to the dashboard, it turns into seen, and you can begin utilizing it!

Give It a Attempt

If you wish to attempt dashboard plugins, take a look at our free trial. If you need to debate dashboard plugins or no matter you could have in your thoughts, attain out to us on our group Slack.