Published on

How to Create Dashboards with Multiple Charts using One Charts

Authors

    How to Create a Dashboard

    Creating a dashboard to visualize multiple interactive charts can be a powerful way to present complex data in a clear and intuitive way. In this article, we will discuss how to create a dashboard that displays multiple interactive charts at once.

    Introduction

    Consider a scenario where you intend to visualize the win and lose statistics of multiple teams as a pie charts.

    TeamWonLost
    RR30
    LSG31
    GT22
    KKR03

    Let us create 4 pie (doughnut) charts for each of the 4 teams. The tutorial on how to create a pie chart and customizing it is described in this article.

    For this article, we have already created the charts as listed below.

    TeamChart ID
    RRXluO24KaM-6TyP
    LSGgqa224KtM-CuIc
    GTv3p72fKtp-44u8
    KKRfMe724daM-87vf

    Prepare the dashboard

    To create a dashboard using the above charts, head over to New Dashboard. Click on Add Chart button. A popup appears asking for a Chart ID as shown below. Add Chart In Dashboard Button

    Let us start by adding the chart for RR. Enter the ID of the chart that we have created, which is XluO24KaM-6TyP and then click on Add button. Once the chart has been added, the dashboard should appear as shown below. Add RR Chart In Dashboard

    Similarly add the remaining 3 charts corresponding to LSG, GT, and KKR one-by-one. After adding all the charts, the dashboard should like as shown below Dashboard Doc All Charts Demo

    Customize the Dashboard

    The dashboard can be customized to display the custom title, subtitle and the number of charts to be displayed per row. Let us customize the dashboard by changing the title to IPL 2023 teamwise stats and the subtitle to Number of win and lose matches of the teams in IPL 2023. Also, let us update the number of charts per row to 3 instead of 2.

    To customize the dashboard, click on settings button. As popup appears as shown below and enter the details Dashboard settings demo

    After adding the details and clicking on Apply button, the dashboard should appear like this

    Dashboard after settings demo

    Save the Dashboard

    The dashboard can be saved by clicking on save button. This will create a dashboard with an ID, like this DoxP74KtM-mHAm, which can be used to visualize the multiple charts.