Charts

View video

This application is designed for creating dynamic charts based on SQL or Procedures.

Inside the Scriptcase Charts can be created also within the Grid application, however the application Chart has more settings options to the end user within the application generated. The idea is to apply the concept of Business Intelligence so the final system users can apply their own settings within the generated charts.

The settings within the development area uses Drag and Drop for the charts creation. You can apply dimensions and metrics dynamically using different date periods and totals.

Dimensions

Dimensions are used to group the data into categories. You can choose more than one field as a dimension, each new field as a subcategory of the previous field.

To select a field, click on its name in the “Chart Fields” area and drag it to the “Dimensions” column.

Once selected the fields, you can sort them using the drag and drop to arrange the dimensions’ final display. You can choose different periods to date fields and use the same date field more than once, with different periods. All the dimensions listed in “Dimensions” can be used by the system final user within the Chart application. You can also define whether dimensions will be displayed or not when you start the application by selecting the checkbox.

Chart dimensions. Field settings

Metrics

The metric is used to quantitatively view the data grouped by dimensions. Choose the fields for the chart’s metrics.

To select a field, click on its name in the “Chart Fields” area and drag it to the “Metrics” column. Once selected the fields, you can sort them using the drag and drop to arrange the metrics’ final display, you can also chose the total function according to the field data type.

All the dimensions listed in “Metrics” can be used by the system final user within the Chart application. You can also define whether metrics will be displayed or not when you start the application by selecting the checkbox.

The checked field value is used to set the default field just when you are not using a combination or stacked chart types, that use more than one field. If you choose more then one field Scriptcase automatically sets a value multiple chart type (Combination). You can change the initial chart inside the option “Charts’ type” within the “Settings”. When you check a single value (bar, line, Spline, step, Area, pie, pyramid, funnel, Radar and Gauge) you have to click and choose only one field to appear as initial value during the first generation.

Chart Metrics.

Sorting

You can select which chart value will be ordered to start the application, and if the sort will be “ascending” or “descending”.

Chart sorting.

• Initial sorting : Using this option you can set the default sorting (ascending or descending). The system final user will also be able to customize it within the generated application.
• Dimension : Application starts with dimension fields sorting (ascending or descending according to the “Initial sorting”).
• Metric : Application starts with metric fields sorting (ascending or descending according to the “Initial sorting”).

Search

In the “Search” option you can choose the fields that will be used as static search on the chart, the application data will be initially filtered according to the settings you apply. The search values are chosen for each selected field during development, the final user will not be able to change that.

You are also able to apply other search options such as the Dynamic Search using the option “Search > Dynamic Search” (located on the left menu) and the “refined” search using the option “Chart > Search”. These two types are dynamic, it means that the end user will be able to manipulate them within the generated application.

Static search.

Chart options

In the ‘Chart’ tab, the developer defines the default settings for the generated chart, choosing the default chart type, color scheme, and other options. Below, each option is detailed.

Chart Type

Defines the type of chart to be used, such as bar, pie, line, gauge, pyramid, tree map, among others.

Export Chart

Allows exporting the chart to different formats, such as PNG, JPG, PDF, and SVG, enabling storage, sharing, and printing of the presented data.

Font Size

Defines the font size used in the chart elements, such as titles, legends, and values.

Abbreviated Value

Determines if the values displayed in the chart should be abbreviated, such as:

• 1000 → 1K
• 1000000 → 1M

Legend

Shows or hides the chart legend, which identifies the data series presented.

Display Values

Enables or disables the display of values directly in the chart elements.

Exception for Display

Chart types that will not display values even when the option to show values is enabled.

Chart Width

Defines the chart width in pixels, ensuring a better visual fit.

Chart Height

Defines the chart height in pixels, allowing proper sizing.

Value Sorting

Controls the order of values displayed in the chart, which can be:

• Ascending
• Descending
• No sorting

Multi-Series or Drill Down

Allows defining whether the chart will use multiple data series or a Drill Down structure, enabling navigation between data levels.

• Multi-Series: Displays multiple data series in the same chart, allowing the comparison of different datasets.
• Drill Down: Enables data interaction, allowing the user to click on a chart element to view more detailed information at a new level.

Expanded Tooltip

Defines whether the tooltip (information displayed when hovering over elements) will expand to show more details.

Adaptive Y-Axis

Automatically adjusts the Y-axis scale according to the values displayed in the chart.

Grand Total

Adds a totalizer value to the chart, displaying the sum of the presented values.

Trend Line

Adds a trend line to the chart, helping to identify patterns and trends in the data.

Can be configured as:

• Line: Displays the data trend in line format.
• Area: Fills the area below the trend line, visually highlighting data variations.
• No Value: No trend line will be applied to the chart.

Trend Line Type

Defines the type of calculation applied to the trend line.

Note: This option is only displayed when the trend line is set as Line.

Can be configured as:

• Fixed: Displays a straight line at a predefined value.
• Average: Calculates and displays the line based on the average of the chart values.
• Linear: Applies a linear calculation to indicate the data trend over time.

Initial Line Value

Defines the numerical value where the trend line will be positioned when using the Fixed type.

This value represents a reference limit within the chart, aiding in data analysis.

Bars - Width (Between 20 and 70)

Controls the width of the bars in a bar chart, ranging from 20% to 70% of the available space.

Bars - Value Orientation

Defines whether the values in the bars will be displayed vertically or horizontally.

Bars - Value Positioning

Determines the position of values inside the bars:

• Inside
• Above

Bars - Stacking

Defines how bars are stacked in the chart.

• Off: Follows the default setting, displaying bars separately.
• On: Displays a standard stacked chart where values are summed vertically.
• Percentage: Generates a stacked chart where bars occupy 100% of the available area, distributing values proportionally.

Pie - Value Format

Defines how values will be displayed in the pie chart, which can be:

• Absolute values
• Percentage (%)

Data Range

Available only for Gauge charts.

When enabled, a list of fields is displayed where the following must be defined:

• Base Value: The starting point for measurement.
• Range: The value range to be considered.
• Color for each range: Defines the color for each interval in the chart.

This configuration highlights different value zones within the Gauge, facilitating visual analysis.

Gauge - Show Scale Marks

Enables or disables the display of scale marks in the Gauge chart.

Pyramid - Value Format

Defines how values will be displayed in the Pyramid chart, as Absolute value or Percentage.

Tree Map - Title

Defines the main title of the Tree Map chart, improving data identification.