This form tool allows you to view data reports in graphical form.
| Appearance in Toolbox | Appearance in Free Form | Appearance in Responsive Form |
|
|
|
Compatibility
| Free Form | Responsive Form | Mobile |
Properties of the Graphic tool:
Type: Indicates the field type of the added form tool. The value here cannot be changed.
Name: The name of the field to be created in the database is written.
Text: The title to be added to the graphic element added to the form is written.
Field Style: It is possible to change the way the graphics are displayed from the ‘field style’ field in the properties section. Graphic representations such as column, area, line, pie, funnel, bar, bar cluster, column, cluster etc. are available.
Some representation types are exemplified below.
Serial: This is the field where the area to be displayed on the graph is determined. The value to be written here is fed from the values in the query in the SQL Query field. If ALIAS is used in the query, the value in ALIAS should be written.
The ALIAS definition may contain letters and numbers.
Category: It is the field where the values will be categorized according to which field on the chart.
Height: Adjusts the height and width of the form widget (the width field has been removed from Responsive Forms).
SQL Query: In this example, we have a PRODUCTS table and data has been added to it. Let's call this table with its related fields in the SQL query field.
When you save the form and go to the Client screen with the Run button, the graph that will appear is as follows.
Background Picture: It is the feature that allows displaying a picture in the background of the graphic form element.
Display: When checked as ‘Yes’, it ensures that the Form widget is not visible on the Client screen.
| In order for the Graphic component to work and the graphic data to appear on the Client screen, the graphic must be triggered by adding the update action when the form is opened. |
Actions that can be used in Graphic tool:
To view the actions defined for the Graphic tool, first select the Graphic field and then open the actions menu in the right panel.
When Clicked: When clicked, it works according to the selected operation.
Example Action
When a value in the chart is clicked, the ‘$PChartDataGroup’ expression can be used to write the group name to the form or to perform an operation with it. In the example below, the name of the group that appears in the chart is written in the text box on the form.
After editing the chart on the Studio screen, editing operations can also be done on the Client screen.
Click on the properties button at the bottom right corner of the Graph tool opened on the Client screen and the ‘Graph Customization’ screen opens.
From this interface, the type of the graph, the values to be displayed and the values you want to see are selected.
Col List: It contains the fields in the query you wrote in Studio. It will be enough to drag and drop from this field to the Series, Category and Group fields.
Series: The fields to be seen in the Series field are dragged to the Col List field. If the Serial property in the Studio field is filled, this field will be filled with that value.
Category: If you want to categorize the values sent to the chart, drag and drop the values to this field. More than one value can be sent to this field.
Group: When the values sent to the chart are to be grouped, the desired field types should be dragged and dropped to this field. More than one value can be sent to this field or this field can be left blank.
Series Settings: In cases where changes are desired to be made in the incoming graphic values, edits should be made in this field. Before editing, a value must be selected from the Series field. If not selected, the chart will not be affected by the changes made.
Type: Select the type of the chart.
Process: Select the value operation to be displayed in the graph. Ex; Sum, min,max
Label Position: Select the position of the label inside the chart tool.
Name Position: Select the position of the title of the chart.
| Click on the “View Save All Users” button to save the visual changes made to the chart object for all users. Visual changes are deleted with the “View Delete” button. |
Export:When you want to export the graphic object, click on the desired format (PDF, IMG, SVQ) button and download operations are performed.
| It will be enough for the user to click on the cross icon to save the change on their screen. |
A few examples of editing the Graphic View on the Client screen are shared below.
Example 1:
After switching from the Studio screen to the Client screen, the type of the chart tool is changed.
After clicking the Settings button, first select the value from the Series field and then select the Donut property from the Type field. After the change, the chart element will look like below.
| If the selection is made from the Type field without clicking on the value in the Series field, the appearance of the chart will not change. |
Example 2:
After clicking the Settings button, first select the value from the Series field and then select the Count feature from the Process field. Count property will give information about how many data entries are made for each product. After the change, the chart element will look like below.
Example 3:
After clicking the Settings button, first select the value from the Series field and then select ‘Top’ from the Label Position field. Some label positions in the chart view will be located above. Likewise, when ‘Outside End’ is selected instead of Top, labels will be positioned on the outside.
Example 4:
After clicking the Settings button, first select the value from the Series field and select Below from the Name Position field. After the change, the chart element will look like below.
Example 5:
It is desired to display the chart values according to the Salesman field in the Col List. For this, the Salesman value in the Col List is dragged and dropped to the Group field. After the change, the chart element will look like below.
Example 6:
After clicking the Settings button, first select the value from the Series field and then select Above option from the Name Position field. After the change, the chart element will look like below.
Example 7:
It may be desired to remove the values that are not wanted to be shown among the grouped values from the chart tool instantly. In these cases, it will be enough to click once on the values that are not wanted to be shown from the Name values in the chart tool.
When the clicked value is deactivated, the background color will change to gray as in the first picture below. After the change, the chart tool will look like the 2nd picture.