You can embed visualizations, dashboards, or even the Analytical Designer into your web applications with the help of the GoodData.UI library and iframes.
With GoodData.UI, you can:
- Display visualizations or existing visualizations from the GoodData platform using visual components.
- Create your new visual components to address your specific analytical needs.
You can find more information in GoodData.UI documentation. and a more in-depth look at GoodData.UI is available in GoodData.UI SDK GitHub repository.
Ensure that you work with GoodData.UI versions >= 8.3.1 when you use it with GoodData.
In the examples, you can find basic components such as
Bar chart or
Column chart and more complex components such as
DashboardView. The examples contain code samples that allow you to copy & paste components into your application.
To see mentioned components and more, visit the Example Gallery.
First Steps With GoodData.UI
Use Accelerator Toolkit to create your first analytical application. The Accelerator Toolkit contains
create-gooddata-react-app CLI-based tool that will guide you step by step through the process of creating an application in your terminal.
npx @gooddata/create-gooddata-react-app --backend tiger
The following section contains an example of how to use the tool within GoodData. For more details about the tool itself, go to gooddata-create-gooddata-react-app GitHub repository.
If you are embedding GoodData analytics into web application hosted under a different domain, you may need to set up CORS. See Enable CORS For an Organization.
Check out the following articles to get started with embeding of your visualizations, dashboards and Analytical Designer:
If you just want to pull data from GoodData platform to your web application, you have an option to use the GoodData.UI Execute component.
To learn more about GoodData.UI, check out these courses on our GoodData University:
- GoodData.UI - Starting from Scratch - you will learn how to implement, build and deploy your first custom analytics application by following step-by-step instructions.
- GoodData.UI Demo - Building Basic Dashboards - you will learn basic principles of how to build a custom dashboard using GoodData.UI SDK.
- GoodData.UI Demo - Making Dashboards Interactive - you will learn how to build and improve a custom dashboard using GoodData.UI SDK.
- GoodData.UI Demo - Building Custom Visualizations - you will learn how to build custom React components with the GoodData.UI SDK.