Package com.jbstrap.ui.components.charts

Class AreaChart

java.lang.Object
com.jbstrap.ui.components.charts.BaseChart<T>
com.jbstrap.ui.components.charts.SeriesBasedChart<T>
com.jbstrap.ui.components.charts.AxesBasedChart<AreaChart>
com.jbstrap.ui.components.charts.AreaChart
All Implemented Interfaces:
DataDescriptorCallback, ClickableChartData<AreaChart>, MultiSeriesChart<AreaChart,AreaSeries>, SupportBrush<AreaChart>, SupportLasso<AreaChart>, SupportZoom<AreaChart>
public class AreaChart extends AxesBasedChart<AreaChart> implements MultiSeriesChart<AreaChart,AreaSeries>, ClickableChartData<AreaChart>, SupportLasso<AreaChart>, SupportZoom<AreaChart>, SupportBrush<AreaChart>

An area chart is a series of data points connected with lines, with a colored area below the lines. An area chart can contain one or more areas. You can specify if an area should be filled with a solid color or a color gradient. An area chart is an axis-based chart that has an X and Y axis. Data points are placed on these two axes. All displayed data series constitute a separate area of different color. Each area is separately displayed in the legend. The legend shows the user the type of data for each series. Users are allowed to enable or disable each area by clicking on legend items. Lines and area colors on a stacked area chart are automatically calculated but can also be specified. Line type can be modified and lines can be displayed as curves, stepped or dashed lines. Line thickness can also be modified.

By default, the markers on the displayed line show the position of each data point, the color, shape and size of which can be modified. You can also turn off the markers. Once turned off, markers are not visible and thus the click events and tooltips also do not work.

You can modify the tooltip type or create a custom tooltip using any JBStrap component. By default, a line chart uses three different tooltip types, each one displaying data points differently. You can use the following tooltip types on a line chart: DOT, LINE and SIMPLE. By default, the simple tooltip is displayed on the chart. If you want to display a different tooltip type, you need to create it on your own using ChartTooltipRenderer. You only need to implement one method which returns the tooltip as a component. In order to do this, you can reuse any JBStrap component. It is possible to display a button, a list or even another chart on the tooltip.

The chart also supports click events. This means that you can implement server-side business logic for the event that is triggered when a user clicks on a data point. This is when a ChartClick event is triggered. This event provides you information on where and which chart the user clicked on. This can be reused in various ways, e.g. to update a list.

The chart also supports the lasso feature. This function is disabled by default. If enabled, the user is allowed to select one or more data points. You can select a data point by circling the data points on the chart. You can make a selection on multiple charts or series at the same time. If a user selects multiple data points on the chart, a Lasso event is triggered on the server side. This event is associated with every selection. If a user selects a data point on a chart, the event is triggered on every chart. The lasso event contains information on the selected chart and series. This piece of information can be then used in any business logic, e.g. to group data points or conduct further analysis.

The chart also supports the zoom feature. This function is disabled by default. If you enable it, the user is allowed to zoom in on a chart area by using the mouse scroll wheel, thereby allowing a closer look at the details. If a user zooms in on the chart while the lasso feature is disabled, it is possible to horizontally move the chart by keeping the mouse button pressed. If the lasso feature is enabled, users are not allowed to move the chart as the lasso feature is active when keeping the mouse button pressed.

This chart supports the brush feature which works with the zoom feature. This function is disabled by default. If you enable it, a miniature version of the chart appears below the chart. Users can zoom in on the chart, but in this case the miniature version of the chart is not zoomed. Instead, a small dark area indicates the area of the chart currently displayed on the normal size chart. Users can move this darker area, at the same time moving the zoomed area on the normal size chart. If you use this feature alongside the lasso feature, users are able to use all functionalities of these features on the chart.

Since:
4.0
Author:
JBStrap
See Also:

  • Constructor Details

    • AreaChart

      public AreaChart(String name)
      Creates an area chart.
      Parameters:
      name - Chart name It is mandatory to specify the chart name and it must be unique within the ChartCanvas. Later on, you can reference the chart with the name specified here.
      Throws:
      NullPointerException - Thrown if the specified name is null or it is an empty string

    • AreaChart

      public AreaChart(String name, DataDescriptor dataDescriptor, String categoryColumnName)
      Creates the area chart component and sets the name of the DataDescriptor and that of the X axis column.
      Parameters:
      name - Chart name It is mandatory to specify the chart name and it must be unique within the ChartCanvas. Later on, you can reference the chart with the name specified here.
      dataDescriptor - The DataDescriptor that contains the chart data
      categoryColumnName - The name of the DataDescriptor containing X axis data If not specified, or null is specified, the framework starts looking for the “CATEGORY” column.
      Throws:
      NullPointerException - Thrown if the specified name is null or it is an empty string
      IllegalArgumentException - Thrown if the column specified in the categoryColumnName parameter is not found in the DataDescriptor or if the categoryColumnName parameter is not specified and no “CATEGORY” column is found in the DataDescriptor.

  • Method Details