LineChart

The LineChart object is used on the form to express the results returned to end users from the data source by enriching them with line visuals. With this object, the user is enabled to view a summary of information at the same time instead of directly viewing it.

While the active screen is a form in the authoring interface, the Toolbox panel lists form objects. The object is added to the form by drag/drop from the toolbox panel.

Clicking on the object displays the "General" and "Events" tabs in the Property Viewer panel, and the properties of the object can be viewed and edited. The inheritance scheme by which the properties of the object are transferred is as follows;

General

Design

'Name' - The name of the object to be used by the system. Inside another object and on the code side, the object is accessed by the value written in the namespace.

Caption

'Title' - The part where the label text of the object is edited.

'Position' - The part of the object label that regulates whether it is positioned on the left, right or above the object.

>Choices Available : Left, Right, Top, Bottom

'Width' - This is where the width of the label field is set.

'Height' - This is the part where the height of the label field is set.

'Font' - The part of the text in the label area where the font, font, font size and color are set.

'Ellipsis' - The portion where the label text is set to appear for the part of the text that does not fit, whether the ellipsis (...) appears.

'Visible' - The part where the label field is set to be hidden or visible.

'Show Colon' - Colon next to label text (:) is the part where the expression is set to appear or not.

'Horizontal Align' - Label text; This is the portion where right-just, left-just, or center-justify settings are performed.

>Choices Can Be Made: Left, Center, Right

'Vertical Align' - Label text; This is the portion where the Justify, Snap Down, or Center settings are performed.

>Choices Available : Top, Middle, Bottom

'Mark Char' - To make the object stand out, enter *, ! is the area where characters such as can be entered.

'Mark Position' - The part where the character designated as the mark character is set to be shown at the beginning or end of the label text.

>Choices Can Be Made: AtFirst, AtLast

Appearance

'Visible' - This is the part where the object is hidden and made visible. When this field is active, the object is visible on the form. When the field is made passive, the object becomes invisible.

'Client Visible' - When the object is not visible when the form is first opened, when it is desired to make the object visible, to make the object visible when a certain condition is met, this field is made passive so that the object is invisible on the client side. When the condition set by the code or the Rules Manager is met, the object can be made visible again. When server visibility is inactive, the client cannot intervene, but the server can intervene when client visibility is inactive.

'Enabled' - The active mode of the object is set from this field. When this feature is active, data entry can be provided to the object and the object can be edited. When the feature is passive, the object is in non-editable mode and appears passive.

'Client Enabled' - When the form is first opened, the object is not active, when a certain condition is met, etc., this field is made inactive so that the object is not active on the client side. Once the condition set by the code or the Rules Manager is met, the object can be activated again. When server activity is inactive, the client cannot intervene, but the server can intervene when client activity is inactive.

'Background Color' - The area used to give the object a background color.

'Title' - Hovering over the object with the cursor while the form is open in the interface, the text typed in this field is shown as a hint. It is a feature used to direct the end user when detailed information about the object is desired.

'ClassName' - The field in which the object visibility can be changed by defining a class written in the CSS file of the form.

Datasource

'DataSource' - The field in the object that will be used to be able to list values from a data source. The data source definition that is added to the DataSource section of the project in Solution Explorer and that compiles successfully becomes selectable from the DataSource portion of the object.

:::d anger WARNING

Insert and Update queries are not used in queries to be used in the LineChart object.

:::

'RunAtServer' - This option determines whether the query connecting to the object is run from the server or the client.

If this option is enabled, when clicking on the form in the web interface, the query is run on the server side before the form is opened, and when the form is opened, the query result is loaded into the object. When the option is made inactive, when the form is clicked in the web interface, the object starts to load the result values of the query after the form is opened.

The wait time for the query result to load takes effect at the time the form is opened with this feature active, and at the time the data is loaded into the object after the form is opened quickly when the feature is passive.

Charts and Activation

'Chart items' - The area in the object where the type of chart to be displayed is selected. Clicking on the Chart Items section opens a window in which the type of chart to be displayed in the object is selected and the selected chart properties are edited.

Clicking the "Insert" button in the window that opens lists the chart types that are desired to be displayed in the Chart object. The following types of charts can be added to the object;

> Line Chart

Clicking the Insert button to add a line chart adds the chart definition to the Charts tab on the left side of the window. On the right side is the area where graphic information is entered.

Feature	Description
Name	The name to be given to the chart is written in this field.
Argument Field	The values that can be selected within the related fields come from the fields in the query that were added in the datasource option of the chart. The Argument Field field selects the column of the description field that is desired to be used in the chart.
Value Field	The values that can be selected within the related fields come from the fields in the query that were added in the datasource option of the chart. The Value Field field selects the value column that is desired to be used in the chart.
Color	The selection of the graphic color is made. The color selection panel is shown by clicking on the color to the left of the RGB code. Color selection can be made with the mouse pointer on the palette or by entering the desired RGB code or HEX code. The A expression to the right of the RGB code refers to the Alpha Channel and is used to adjust the opacity, and the range of values is from 0 to 100. Apart from these options, one of the 15 colors that come by default can be selected.

After the data is entered, the chart should be saved by pressing the "Save" button in the window.

'Rotate enabled' - Replaces the X and Y axes where data is displayed in the object. The default state comes passively. In the passive state, the argument field is shown on the X-axis and the value field is shown on the Y-axis. When activated, these axes are shifted and the argument field is shown on the Y axis and the value field on the X axis.

> Display of graph when Rotate Enabled option is inactive > Display of graph with Rotate Enabled enabled

'Animation enabled' - Allows the data in the chart object to be loaded in animation form when the form is opened while active. When it's closed, it comes loaded with data, and when it's on, it's loaded and loaded in motion, like a gif.

'Selection enabled' - allows the selection of any data on the Chart. When this option is on, it is hand when the mouse pointer hovers over the data, and selecting it changes the corresponding field to the selected state.

'Hover enabled' - Hover change the style of that region when hovering over data with the mouse cursor; it becomes shady.

'Tooltip enabled' - Displays the value when the data is hovered over. For example, in the Number of users by department chart, it can show the number of users when the mouse pointer is hovered over Software department on the argument axis.

Legend

'Enabled' - Used to indicate which chart shows what in the charts shown in the chart. When the Enabled option is activated, these are indicated in a tooltip next to the chart.

> Chart view without Legend option enabled > When activated, the view on the chart, which color represents which chart is shown on the left side

'Position' - A property that opens for selecting where in the graph information appears when the Enabled property is active. The options listed are Left (left), Right (right), and Top (bottom).

>Choices That Can Be Made: Left, Right, Bottom, Top

Stack

'Enabled' - Used to display if more than one Chart item has been added within the Chart object.

'Series' - This is the property that appears when the Enabled property is active. The property from which charts created in Chart Items in Charts and Activation are selected. Multiple charts are shown on the chart by selecting from the charts in the list.

Zoom and Pan

'Enabled' - Used to zoom in and out of values in the chart. When it is active, three more features become active.

'Interaction with arguments' - This is the property that appears when the Enabled property in Zoom And Pan is active. According to the data in the argument area, both (both), none (none), zoom out (pan) and zoom (zoom) operations can be performed. If both are selected, both zoom (Zoom) and pan (Pan) are active on the argument axis. The None option prevents any operation on this axis. If Pan is selected, the chart can be shifted to the right or left along the argument axis. If Zoom is selected, the chart is zoomed along the argument axis so that the value axis remains constant when zoomed in.

>Choices Can Be Made: Both, None, Pan, Zoom

'Interaction with values' - This is the property that appears when the Enabled property in Zoom And Pan is active. According to the data in the Value field, both (both), none (none), zoom out (pan) and zoom (zoom) operations can be performed. If both are selected, both zoom (Zoom) and pan (Pan) feature are active on the value axis. The None option prevents any operation on this axis. If Pan is selected, the chart can be shifted to the right or left along the value axis. If Zoom is selected, the chart is zoomed along the value axis while the argument axis remains constant when zoomed in.

>Choices Can Be Made: Both, None, Pan, Zoom

'Zoom region key' - This is the feature that appears when the Enabled property in Zoom And Pan is active. In the items listed, the key to be selected can be zoomed in by holding down the key on the keyboard and selecting an area on the chart with the mouse. Shift, Alt, or Ctrl options can be selected.

>Possible Selections : Shift, Alt, Ctrl

Argument Axis

'Enabled' - When active, the headings on the argument axis are shown in the graph. If it is closed, the headings on this axis will not be brought.

> Values on the argument axis are hidden while passive > Headings on the argument axis become visible while active

'Show tick' - This is the property that appears when the Enabled property in the Argument Axis is active. Used to activate the Tick Size field in which the value is entered when subtracting a marker line from the headings on the argument axis to the outside of the chart. The line length is adjusted with Tick size.

'Tick size' - This is the feature that appears when the show tick feature is active. Used to subtract a pointer line from the headings on the argument axis out of the chart.

> Tick Size is 0 (zero) and no line emerges from the argument axis > Entering 50 as an example value for Tick Size has pointer lines removed from the argument axis

'Indent from axis' - This is the property that appears when the Argument Axis Enabled property is active. It is used to determine the gaps between the bottom of the graph and the argument headings.

> For Indent from axis, the value 50 is entered as an example, according to which the spacing between the titles and the bottom of the chart can be adjusted

'Position' - The property that appears when the Argument Axis Enabled property is active. The listed properties are Top and Bottom. Makes the argument axis appear Bottom (bottom) or Top (top).

>Choices That Can Be Made: Top, Bottom

> Appearance when Bottom is selected > View when Top option is selected

'Show grid' - This is the property that appears when the Argument Axis Enabled property is active. While selected, gridlines shown from argument titles into the chart become visible.

> View with Show Grid selected > View with Show Grid deselected

'Show line' - This is the property that appears when the Argument Axis Enabled feature is active. When selected, a line continues along the argument axis from the point of origin is shown. If deselected, this line does not appear.

> When the show line is selected, the line from the point of origin is visible. > When show line is not selected, the line from the point of origin is removed.

'Show labels' - This is the property that appears when the Argument Axis Enabled property is active. If selected, the headings on the argument axis appear visible.

> When Show Label is selected, the titles on the argument axis are visible. > If Show Label is not selected, these titles will not appear

Value Axis

'Enabled' - The headings on the value axis are shown in the chart when active. If it is closed, the headings on this axis will not be brought.

> When Enabled is selected, the values on the value axis are returned as visible > When the Enabled option is turned off, the value on the value axis will not be displayed

'Show tick' - This is the property that appears when the Enabled property in the Value Axis is active. Subtracting a marker line from the headings on the Value axis to the outside of the chart is used to activate the Tick Size field where the value is entered. The line length is adjusted with Tick size.

'Tick size' - This is the feature that appears when the show tick feature is active. Used to subtract a pointer line from the titles on the value axis out of the chart.

> Tick Size is 0 and no line from the value axis is visible > Entering a sample value of 50 for Tick Size has marker lines removed from the value axis

'Indent from axis' - Value Axis This is the property that appears when the Enabled property is active. Used to specify the gaps between the left part of the chart and the value headers.

> For Indent from axis, the value 50 is entered as an example, according to which the spacing between the titles and the left part of the chart can be adjusted

'Position' - Value Axis This is the property that appears when the Enabled property is active. The properties listed are Left and Right. Makes the value axis appear Left or Right.

>Choices That Can Be Made: Left, Right

> View when Left is selected > Appearance when Right is selected

'Show grid' - This is the property that appears when the Value Axis Enabled property is active. When selected, gridlines from value headers into chart become visible.

> View with Show Grid selected > View with Show Grid deselected

'Show line' - This is the property that appears when the Value Axis Enabled property is active. When selected, a line is shown that continues along the value axis from the point of origin. If deselected, this line does not appear.

> When the show line is selected, the line from the point of origin is visible. > When show line is not selected, the line from the point of origin is removed.

'Show labels' - This is the property that appears when the Value Axis Enabled property is active. When selected, a line is shown that continues along the value axis from the point of origin. If deselected, this line does not appear.

> Titles on the argument axis are visible when Show Label is selected > If Show Label is not selected, these titles will not appear

Events

The events owned by the object are located in the "Events" tab in the Property Viewer panel. Each event is triggered at different runtime moments, performing its own unique operations. Code written by the developer to these events is also executed at the time the corresponding event is triggered.

When the events in the "Client" field are double-clicked, the screen is directed to the form code editor section called "Formedi.ts" where TypeScript coding can be done and the method block for the clicked event is automatically created.

When the events in the "Server" field are double-clicked, the screen is directed to the form code editor section called "Formadı.cs" where C# coding can be done and the method block for the clicked event is automatically created.

The developer can construct any code block within these methods. Next to the event whose method is created on the code side by clicking from the Events tab, the method name information is automatically generated and the relationship between the event and the method is specified.