Chart

This element can be used to display an application's values graphically. The chart control offers a wide range of templates, allows you to limit the number of data points, integrate dependencies, customize all chart properties, and export charts as JPG, PNG, SVG, and PDF files.

The "Chart" application element belongs to the "Images and Files" element category.

You can find the chart element in the "Applications" module under "Elements. " You can create a new chart by dragging and dropping the element from here onto the workspace.

For more information on creating elements, click here.

The Properties dialog box for a diagram element opens automatically when a new diagram is created. You can open the Properties dialog box for an existing diagram by double-clicking the element on the workspace, selecting "Properties" from the context menu, or choosing "Edit / Properties" from the main menu when the diagram is selected on the workspace.

General

In the diagram's Properties dialog box, you can set the title—including multilingual titles—on the "General" tab.

Chart Type

When you select one of the chart types on the left (column, bar, line, pie, area, and other types), the corresponding options will appear in the right-hand pane.

Data

This is where you configure the chart's data source and the layout of its components.

Data

Application

The current application is already selected here.

Filter

Opens a dialog box where you can set up a filter to filter the application data before it is displayed in the chart.

Data Group

Select the data group here whose values you want to display in the chart.

Add a Subordinate Data Group

Opens a dialog box where you can select child data groups whose data will be included in the chart.

Subordinate data groups

In the "Available" column, you can see all the subdata groups that can be selected. Move the desired data group to the "Selected" list by clicking "Move to the right" under " ." "Move Up/Down" changes the order of the selected sub-data groups.

Click "OK" to save your changes and close the dialog box.

Show Dependent Rows

This setting causes the system to display the records that have a parent-child relationship with the currently selected parent record.

Values

In this section, you'll see an illustration of the chart type you selected earlier.

Values

You should select a field here that contains a meaningful value. The values in this field are automatically totaled. Depending on the chart type, this value determines the height of the columns, the length of the bars, or the size of the areas in the chart. Negative values can also be displayed; in this case, the individual rows are shown below the row axis in the bar chart.

Series

This section specifies the criteria according to which the values on the x-axis (horizontal axis) should be grouped. When you select "[A Series]"—which is available for all chart types except pie charts—the values are summed.

Categories

Here, you can select a field by which values in the chart will be grouped.

Unit

If a data field with the "Date" data type is selected as the category, you can select a corresponding unit (second, minute, hour, day, week, month, quarter, or year) here for display in the chart.

Sorting

Category

With this setting, the chart is sorted by category.

Series

With this setting, the chart is sorted by the series values.

Value

With this setting, the chart is sorted according to the values you specified in the Values pane.

Sort Ascending / Descending

Here, you can specify whether to sort in ascending or descending order.

Special Feature: XY Chart Type

For the XY chart, which can be selected under the "Other" chart type, you can edit the description of the values.

To do this, click " " and then "Change Description."

Here, you can enter the text to be displayed as a description of the individual values in the XY chart.

Static value

Enter a static title here. You can find information about multilingual titles here.

Data Field Title

With this option, the title is retrieved from the selected data field.

From data field

Allows you to select a data field whose content will be used to describe the values.

Settings

Maximum number of records

Sets the maximum number of data points displayed in the chart. Enter the value -1 to display all records.

Number of records initially displayed

This setting determines how many data points are displayed when the chart is first loaded. Enable the "Show Scrollbar" setting on the "Interaction" tab so that you can access the additional values in the chart.

Show Legend

Shows the chart legend.

Display text if no record exists

Displays a message when no data is available.

Use Global Text

The text used is the multilingual text stored in the country settings of the portal properties, specifically in the global language constant "DR_NO_RECORD. "

Text to display if no record is found

If the "Use Global Text" setting is not enabled, you can enter static text here.

Enable Export

With this setting, a button appears next to the chart in the browser that allows you to select the desired export format. The chart can be exported as a JPG, PNG, SVG, or PDF file.

Value Axis / Row Axis

Label the axis

Here, you can enter labels for the value and series axes.

Rotate the scale label by an angle of ... degrees

The scale labels on the row axis are rotated by the angle entered here.

Interaction

Jump when clicking on a data point

Edit

Opens a dialog box where you can specify a page to load when a data point is clicked.

Show a vertical line at the data point closest to the mouse cursor

For better orientation, a vertical line can be displayed at the data point closest to the current mouse position.

Display all data information at once

When you hover over a data point, displays all categories at once in a tooltip on the chart area.

Enable zoom

With this setting, you can use the mouse to select an area of the chart and zoom in on it.

Show scrollbar

In addition, a scroll bar can be displayed at the top of the chart. This allows you to reduce the size of a section of the chart.

Display the graph in the scrollbar

Also shows which area is currently restricted.

Enable moving

This option is available only if "Enable Zoom" has not been enabled.

Adjust to the maximum available width

With this setting, the width of the element is adjusted to match that of the nearest surrounding element.

Colors

No requirement

This option does not change the existing colors.

From data field

Here, you can select a data field that contains hexadecimal color values. For example, if all the columns in the chart for Employee A are to be displayed in green, the hexadecimal value for green must be entered for each data record created for that employee.

Fixed

The colors listed here are used in order for the row element of the diagram.

"Preview" Column

Here you can see the predefined colors.

"Hexadecimal" Column

Displays the hexadecimal color value.

/ Edit Color

Opens a dialog box where colors can be selected.

Remove Paint

Removes the currently selected color from the list.

Guides

Guides can be used to highlight areas of the diagram with color. Guides can be defined for all chart types except pie charts, funnel charts, and XY charts.

Guides' Values

"From" / "To" / "Background Color" Columns

In the first two columns, specify the range you want to highlight. You can select the color in the third column.

Create a Guide

Adds a new row to the list. You can edit all values directly by clicking in the corresponding cell.

Delete Guide

Removes a guide from the list.

Guide Categories

Dynamic

This option is available when a data field with "Date " as the category is selected on the "Data" tab. When this option is set for the first time, a dialog box opens automatically where you can configure the GUID series.

Edit Guide Series

Opens a dialog box where you can specify the color, pattern, and duration of the guide.

Guide Series

Color

Select a color

Here, you can select the color for the guide, for example, to highlight the month of June in the chart.

Fill the entire area with color

The entire area will be colored.

Production samples

Set the interval for the repeating pattern here.

Series Run

Ends after

Here, you can specify the number of repetitions after which the marker should no longer be displayed.

No end date

If no end date is selected, the selection covers the entire chart.

Click "OK" to save the changes and close the dialog box.

Static

Here, you can apply colors to static sections for categories.

"From" / "To" / "Background Color" Columns

In the first two columns, enter the date values for the range you want to highlight. You can select the color in the third column.

Create a Guide

Adds a new row to the list. You can edit all values directly by clicking in the corresponding cell.

Delete Guide

Removes a guide from the list.

Options

Show XML Name

Displays the diagram's layout properties in XML.

Show real names

Displays the names of the diagram's individual layout properties.

This is where you can define line color, line size, graphs, guide lines, background images, and much more. For more information on customization options, see the API for the third-party solution amCharts.