Line Chart Widget

Last modified on 2022/05/28 10:53

Apps - Widget - Line Chart icon.png This type of widget belongs to the Dashboards category in the widget library. It enables you to represent, for a given measure, the trend as a line with different dimension values. It is particularly suitable for chronological dimensions.

Notes

    Open url.png  see General remarks on widgets

  • The data source must contain one Dimension column, usually a chronological series, and one or more Measure: Observed value columns.
  • Different measures that are related to the same dimension can be processed simultaneously, e.g. the number of incidents handled by Fred Leblanc and by Fabien Pachelbel for a given 12-month period.
    • Select the measures you want using the Data Transformer. If you do not do so, all of the measures will automatically be processed.
    • Each measure is represented by a line placed in the same chart.
  • In execute mode, the legend displayed at the top right of the chart is a dynamic data filter (Chart Label -/- Legend > Legend). Infotips appear when you move the mouse over each segment.
  • If the chronological series includes several values, labels will be partially displayed to improve readability.
  • Measure axis values can start from 0 or from the minimum value of the measures selected. They end with the maximum value of the measures selected. To improve the readability of different ranges between these two limits, you can increase the height of the widget.

Best Practice big icon.pngBest practice

  • You should use the Line Chart widget to display the trend for one or more measures over a period of time using values from a chronological series.
  • If you only have one measure, you can use the KPI widget that provides a more compact display of the trend.

Example

You want to view the trend for incidents handled by Fred Leblanc (measure) over the 12 months of 2013 (dimension with a chronological series of 12 months).

Data source Widget Kpi

Note: The data source contains several measures. You select the measure you want (number of incidents for Fred Leblanc) using the Data Transformer.

EVApps - widget Line Chart - Example DataSource.png

Download Zip icon.png Download Example (CSV file)

EVApps - widget Line Chart - Example Chart.png

List of properties

Content

DataSource

Data Source: External data source associated with the widget. 

  • The drop-down list displays all of the data sources available in the app. 
  • To modify the data source or to view its contents, you should click Apps - Edit icon.png. The Apps - datasources Properties - Preview button.png button below the Preview property shows the number of rows (max. 15) and columns extracted.
  • To define a new data source, click Apps - Add datasource icon.png Add Data Source in the Objects pane.
DataTransformer

Data Transformer: Used to define the structure and scope of the data source, apply statistical aggregate functions and modify the order of the measures displayed.

  • Click Setup / Preview Data below the Data Transformer property to open the dedicated window. Open url.png See the description.

Data

FirstRowContainsDimensionElements

First Row Contains Dimension Elements: Used to specify the structure of the data source by indicating if dimension elements are found in the first column (box is not checked: standard data source structure) or in the first row (box is checked). Note: This property does not affect the behavior of the Data Transformer.

SortByValueDescending

Sort By Value Descending: Used to sort dimension elements in descending order (if the box is checked, from highest to lowest value) or in the order in which they are read in the data source (box is not checked). Note: The order applied is determined by the dimension elements of the first measure in the data source.

: Charts for incidents and requests per employee

The data source contains the Department dimension with three elements. Sort By Value Descending - Example - Datasource.png

Box is checked Box is not checked

Sort By Value Descending - Example - Sort value - On.png

The dimension elements of each measure are sorted in descending order.

Sort By Value Descending - Example - Sort value - Off.png

The dimension elements of each measure are displayed according to the sort order of the data source.

MaximumNumberOfData

Maximum Number Of Data: Used to indicate the maximum number of dimension elements to be loaded from the data source for each measure selected in the data source.

Best Practice icon.png  You should use this property to prevent loss of performance when data volume is large.

  • The count is always performed from the first dimension element.
  • When the number of dimension elements to be loaded is greater than the number of dimension elements in the data source, all of the data is loaded.
  • To view the data source, click Apps - Edit icon.png next to the Data source property, then click Apps - datasources Properties - Preview button.png button below the Preview property which shows the number of measures and the number of dimension elements for each measure.

: Charts for incidents and requests per employee

The data source contains the Department dimension with three elements. Sort By Value Descending - Example - Datasource.png

Maximum Number Of Data = 20 (default value) Maximum Number Of Displayed Data = 20 (default value)
Maximum Number Of Data = 2 Maximum Number Of Displayed Data = 20 (default value)
Maximum Number Of Data = 20 (default value) Maximum Number Of Displayed Data = 1

Sort By Value Descending - Example - Number Data - All.png

All dimension elements are loaded and displayed for each measure, i.e. the three departments.

Sort By Value Descending - Example - Number Data - Part.png

Only the first two dimension elements are loaded and displayed for each measure, i.e. the first two departments.

Sort By Value Descending - Example - Displayed Data - Part.png

All dimension elements are loaded but only the first element is displayed. This corresponds to the Sales department. The Others dimension element groups values from the Marketing and Administration departments.

MaximumNumberOfDisplayedData

Maximum Number Of Displayed Data: Used to indicate the maximum number of dimension elements to be displayed for each measure selected in the data source. This improves chart readability.

example   You want to display the chart for incidents and requests per employee. Open url.png See the Maximum Number Of Data field.

  • The count is always performed from the first dimension element.
  • When the number of dimension elements to be displayed is less than the number of dimension elements to be loaded, the Others dimension element will automatically be added to the chart. It will aggregate all of the values from non-displayed dimension elements.

Chart

ColorTheme

Color Theme: Color theme applied to the chart. This affects the color of Bar Chart widgets, Line Chart widgets and Pie/Donut Chart widgets as well as the color of the buttons for each legend.

  • The list is provided by EasyVista.
  • The number of theme colors is indicated next to the theme name, e.g. Brown (6), Default (12), EasyVista (7).

          Apps - widgets Dashboards - Color theme.png

MeasureAxisDataType

Measure Axis Data Type: Used to define the display of values in the axis and infotips. Note: The number format, e.g. comma or period for the decimal symbol, depends on the configuration settings of the platform used by the logged-in user. In Windows, this is specified in the Control Panel > Regional and Language Options.

  • Integer: Used to display whole numbers rounded up or down to the nearest unit.

    example   152200.10 ==> 152200

  • Float: Used to display values with 2 decimal places.

    example   152200 ==> 152200.00

  • Big Number: Used to display values converted to thousands (k), millions (m), billions (G) followed by the unit symbol. Numbers are rounded up or down to the nearest unit.

    example   152200 ==> 152k

Chart Label -/- Legend

ChartLabelLegendBarLineChart

Properties of the legends.

Property Description Representation
Element Object to format EVApps - Graphic Properties - Chart Label Element Bar Line Chart.png
(1) Axis: Values of the axis
(2) Axis Legend: Legend of the axis
(3) Legend: Legend displayed at the top right of the chart
Graphic properties of the selected object
PageGeneralFormat
Font Family (Inherit) Font of the text, selected via Select Font Graphic properties - General format.png
Size Font size, selected via the slide or specified directly in the field
Alignment (Inherit) Alignment of the text (Left/Center/Right/Justified)
Style (Inherit) Font style of the text Bold/Italic/Underline)
Background Color (Inherit) Background color of the widget
Text Color (Inherit) Color of the text displayed by the widget

Note: Priority is given to the font and color defined using the text editor

RotateDimensionAxisLabel

Rotate Dimension Axis Label: Used to indicate if the dimension axis labels are rotated (box is checked) according to the angle defined in Rotate value or if they are displayed horizontally (box is not checked).

RotateValue

Rotate Value (Note: Only when the Rotate Dimension Axis Label box is checked): Value defining the direction of dimension axis labels.

  • A negative value rotates text to the right.
  • A positive value rotates text to the left.
  • When the value is zero, the labels are not rotated.
             Apps - widgets Dashboards - Rotate value.png
BottomMargin

Bottom Margin (Note: Only when the Rotate Dimension Axis Label box is checked): Value of the margin between the bottom of the chart and the bottom of the widget border. This defines the space available for displaying the dimension axis labels.
         Apps - widgets Dashboards - Bottom margin.png

StartFromMinValueOfData

Start From Min Value Of Data: Used to indicate if measure axis values start from 0 (box is not checked) or from the minimum value in the data source (box is checked).

Legend

Legend: Used to indicate if the chart legend should be displayed (box is checked) or not (box is not checked).
         Apps - widgets Advanced Dashboards - Common display legend.png

  • Each legend is made up of the name of the dimension element preceded by a button.
  • The color of the buttons is defined by the color palette applied to the chart (Common > Color Palette property).
  • Define the position of the legend using the Layout, Position, Horizontal and Vertical properties.

   Depending on the selected options, the chart will automatically be resized to allow legends to be fully displayed.

Best Practice icon.png  The legend can be used as a dynamic data filter in execute mode. When you click a button or name, you can display or hide the corresponding values in the chart.

DisplayDimensionAxisLabel

Display Dimension Axis Label: Used to indicate if a title should be displayed below the dimension axis (box is checked) or not (box is not checked). To display the title, enter the title in Dimension Axis Label.

DisplayMeasureAxisLabel

Display Measure Axis Label: Used to indicate if a title should be displayed to the left of the measure axis (box is checked) or not (box is not checked). To display the title, enter the title in Measure Axis Label.

Theme

    Open url.png  see Properties description

Tags:
Powered by XWiki © EasyVista 2022