17 Adding Realtime Charts and Creating Dashboards

17.1 Adding an Area Chart

Area visualization represents data as a filled-in area. Area visualization requires at least two groups of data along an axis. The X-axis is a single consecutive dimension, such as a date-time field, and the data lines are unlikely to cross. Y axis represents the metrics (measured value). X axis can also have non date-time categories. This visualization is mainly suitable for presenting accumulative value changes over time.

To add an area visualization:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Area Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Orientation: select this check box if you want the visualization to appear with a horizontal orientation in the Pipeline Editor. This is optional and you can decide based on your usecase or requirement if you want to change the orientation.

    • Data Series Selection: the column to be used as the data series. This is an optional field.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.2 Adding a Bar Chart

Bar visualization is one of the widely used visualization types which represents data as a series of vertical bars. It is best suited for comparison of the values represented along y axis where different categories are spread across x axis. In a Bar visualization vertical columns represent metrics (measured values). The horizontal axis displays multiple or non-consecutive categories.

To add a bar visualization:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Bar Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Orientation: select this check box if you want the visualization to appear with a horizontal orientation in the Pipeline Editor. This is optional and you can decide based on your usecase or requirement if you want to change the orientation.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.3 Adding a Bubble Chart

A bubble chart is a good option when you want to add an additional dimension to a scatter plot chart. Scatter charts compare two values, but you can add bubble size as the third variable in a bubble chart and thus enable comparison. A good example to use bubble chart is to show marketing expenditures vs revenue vs profit.

To add a bubble chart:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Bubble Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Bubble Size Field Selection: select the field that you want to use as the bubble size. This is a mandatory field.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.4 Adding a Line Chart

Line visualization represents data as a line, as a series of data points, or as data points that are connected by a line. Line visualization require data for at least two points for each member in a group. The X-axis is a single consecutive dimension, such as a date-time field, and the data lines are likely to cross. X axis can also have non date-time categories. Y axis represents the metrics (measured value). It is preferred to use line visualization when data set is continuous in nature. It is best suited for trend-based plotting of data over a period of time.

To add a line visualization:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Line Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Orientation: select this check box if you want the visualization to appear with a horizontal orientation in the Pipeline Editor. This is optional and you can decide based on your usecase or requirement if you want to change the orientation.

    • Data Series Selection: the field that you want to use for data selection series.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.5 Adding a Pie Chart

A pie chart is a circular graph that represents statistical data in slices. The size of each slice is proportional to the quantity of the value it represents.

To add a pie chart:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Pie Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Measure: the field to be used as the measure of the visualization. This is a mandatory field.

    • Group: the field to be used as the group for the visualization. This is a mandatory field.

    • Use 3D rendering: select this check box if you want to render the visualization with a 3D effect. This is an optional field.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.6 Adding a Scatter Plot

Scatter charts are primarily used for correlation and distribution analysis. This type of chart is good for showing the relationship between two different variables where one correlates to another.

To add a scatter visualization:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Scatter Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Data Series Selection: the field that you want to use for data series selection. This is an optional field.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.7 Adding a Stacked Bar Chart

A stacked visualization displays sets of values stacked in a single segmented column instead of side-by-side in separate columns. It is used to show a composition. Bars for each set of data are appended to previous sets of data. The size of the stack represents a cumulative data total.

To add a stacked visualization:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Stacked Bar Chart.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Y Axis Field Selection: the column to be used as the Y axis. This is a mandatory field.

    • Axis Label: a label for the Y axis. This is an optional field.

    • X Axis Field Selection: the column to be used as the X axis. This is a mandatory field.

    • Axis Label: a label for the X axis. This is an optional field.

    • Orientation: select this check box if you want the visualization to appear with a horizontal orientation in the Pipeline Editor. This is optional and you can decide based on your usecase or requirement if you want to change the orientation.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.8 Adding a Thematic Map

A thematic map is used to represent a particular theme in data connected to a geographical area. This type of map depicts the political, cultural, agricultural, sociological, and many other aspects of the geographic region, be it a city, state, country, ore region.

To add a thematic map:
  1. Open a pipeline in the Pipeline Editor.
  2. Select the required stage and click the Visualizations tab.
  3. Click Add a Visualization and then click Thematic Map.
  4. Enter/select values for the following fields:
    • Name: a suitable name for the visualization. This is a mandatory field.

    • Description: a suitable description. This is an optional field.

    • Tags: suitable tags to for easy identification. This is an optional field.

    • Map Type: the map of the region that you want to use. This is a mandatory field.

    • Location Field: the field that you want to use as the location. This is a mandatory field.

    • Data Field: the field that you want to use as the data field. This is a mandatory field.

    • Show Data Value: select this check box if you want to display the data value as marker on the visualization. This is an optional field.

  5. Click Create.
The visualization is created and you can see the data populated in it.

17.9 Updating Visualizations

You can perform the following edit and delete operations on the visualizations:

Edit Visualization

To edit a visualization:

  1. On the stage that has visualizations, click the Visualizations tab.

  2. Identify the visualization that you want to edit and click the pencil icon next to the visualization name.

  3. In the Edit Visualization dialog box that appears, make the changes you want. You can even change the Y Axis and X Axis selections. When you change the Y Axis and X Axis values, you will notice a difference in the visualization as the basis on which the graph is plotted has changed.

The following are the other updates you can make to the visualizations:
  • Maximize Visualizations: You can open the visualization in a new window/tab using the Maximize Visualizations icon in the visualization canvas.

  • Change Orientation: Based on the data that you have in the visualization or your requirement, you can change the orientation of the visualization. You can toggle between horizontal and vertical orientations by clicking the Flip Chart Layout icon in the visualization canvas.

  • Delete Visualization: You can delete the visualization if you no longer need it in the pipeline. In the visualization canvas, click the Delete icon available beside the visualization name to delete the visualization from the pipeline. Be careful while you delete the visualization, as it is deleted with immediate effect and there is no way to restore it once deleted.

  • Delete All Visualizations: You can delete all the visualizations in the stage if you no longer need them. In the visualization canvas, click the Delete All icon to delete all the visualizations of the stage at one go. Be careful while you delete the visualizations, as the effect is immediate and there is no way to restore the deleted visualizations.

17.10 Adding a Dashboard

  1. On the Catalog page, click Create New Item and selectDashboard from the drop-down list.
  2. On the Type Properties screen, enter the following details:
    • Name
    • Description
    • Tags
  3. Click Next.
  4. On the Source Details page, enter the following details:
    • Begin: Select this option to build a dashboard from Beginning or Latest offset. Available options are latest and earliest. If you select the latest option, the dashboard shows only the new records that have been received after opening the dashboard. If you select the earliest option, then the records are read from the beginning of the OSA pipeline topics.
    • CSS: Enter a custom stylesheet for the dashboard.
  5. Click Save.

17.11 Editing a Dashboard

  1. On the Catalog page click the dashboard that you want to edit.

    The dashboard opens in the View Mode.

    Description of edit_dashboard.png follows
    Description of the illustration edit_dashboard.png

  2. Click Edit Dashboard to view the dashboard editing options under Actions.

    Edit Dashboard Options

  3. Click Force Refresh to force refresh the dashboard.
  4. Click Set autorefresh to select the refresh frequency for the dashboard. This is applicable only for cube based visualizations not applicable for streaming charts created out of pipeline.

    This is just a client side setting and is not persisted.

    Note:

    The Refresh options work only for druid-based visualizations, and not for streaming visualizations because they have continuous data flow.
  5. Click the Save icon to save the changes you have made to the dashboard.

  6. Click the Edit CSS icon to edit and apply a CSS to the dashboard. You can also edit the CSS in the live editor.

    You can email the dashboard link to someone using the Email the link icon.

  7. Click Add visualizations to see a list of existing visualizations. Visualizations from the pipelines and as well as from the cube explorations appear here. Go through the list, select one or more visualizations and add them to the dashboard.

  8. Hover over the added visualization, click the Explore chart icon to open the chart editor of the visualization.

    Explore Chart icon

    Description of explore_chart.png follows
    Description of the illustration explore_chart.png

    You can see the metadata of the visualization. You can also move the chart around the canvas, refresh it, or remove it from the dashboard.

    A cube exploration looks like the following:

    Description of cube_exploration.png follows
    Description of the illustration cube_exploration.png

    The various options like time granularity, group by, table timestamp format, row limit, filters, and result filters add more granularity and details to the dashboard.

  9. Click Save as, to make the following changes to the dashboard:

    • Overwrite the visualization

    • Overwrite the current visualization with a different name

    • Add the visualization to an existing dashboard

    • Add the visualization to a new dashboard

17.12 Sharing a Dashboards with Peers

To share a dashboard:
  1. On the Catalog page, click the dashboard you want to share.
  2. Copy the URL of the dashboard from the browser's address bar. Share this URL with users who want to access the dashboard.

17.13 Deleting a Dashboard

To delete a dashboard:
  1. Go to the Catalog page and hover the mouse over the dashboard that you want to delete.
  2. Click the delete icon that appears to your right side on the screen.
  3. On the Delete Confirmation screen, click Delete.

17.14 Exporting a Dashboard with all its Dependencies

  1. On the Catalog page, hover the mouse over, or select the dashboard that you want to export another GGSA instance.
  2. Click the Export option that appears to your right side on the screen.
  3. The selected dashboard and its dependent artifacts are exported as a JSON zip file, to your computer's default Downloads folder.

You can share, or import this zip file on the required user instances, to add the dashboard with all its dependencies.

17.15 Importing a Dashboard with all its Dependencies

  1. On the Catalog page, click Import.
  2. In the Import dialog box, click Select, to locate and select the exported zip file on your computer.
  3. Click Import.
The imported dashboard and its dependent artifacts are available on the Catalog page.