AppMaster.io
HomeStudioJobsSuggest Feature
Search…
English
What is AppMaster.io?
Getting Started
App Architecture
Quickstart
Best Practices
FAQ
Projects
Creating a Project
Project sharing
MODULES (INTEGRATIONS)
Modules
Setup
Modules List
Data Design
What are data models
Data Models Designer
Data types
Relation types
Auto-generation of data models
Business Logic
Business Processes Editor
Best Practices for BP Separation
Blocks List
Global Variables
External API Requests
FAQ
Endpoints (API)
Endpoints Configuration
Middleware
Access & Permissions
WEB APPS
Web Applications Designer
Working with Components
Signup and Login Forms
Workflow in web applications
Components list
Container
Button
Dropdown
Table
View
Tabs
Switch
Label
Image
Video
Chart
Form
Input (string)
Input (text)
Input (integer)
Input (float)
Input (email)
Input (password)
Input (phone)
RichText Editor
Time Span
Date Picker
Time picker
DateTime Picker
Select
Select (enum)
Relselect
MOBILE APPS
Mobile Applications Designer
Creating a Mobile App
Mobile Designer Interface
Working with Screens
Working with Widgets
Publishing a Mobile App
DEPLOYMENT
Deployments Configuration
AppMaster.io Cloud Services
Data Export
Logs
How-To
Import CSV/Excel File
Buttons Setup
User Interface Layout
Powered By GitBook
Chart
Element for displaying graphs and charts

Initial setting:

Model - data model for the chart.
Endpoint - data source for the chart.
Field X - to be shown in the initial settings when Model is specified only.
Field Y - to be shown in the initial settings when Model is specified only.

Look&Feel Settings:

Title (not mandatory) - chart title.
Type size (mandatory) - chart type.
X axe caption (not mandatory) - x-axis title.
Aggregate by (not mandatory) - sort by date.
Y axe caption (not mandatory) - y-axis title.
Method (not mandatory) - counting method.
Name (mandatory) - name of the chart.

Data:

In this section, you can control the chart axes.
​

Workflow triggers:

  • onCreate – fires when the component is created on the page;
  • onShow – fires when the component changes its state to visible (displayed on the page);
  • onHide – fires when the component changes its state to hidden (stops being displayed);
  • onDestroy – fires when the component is destroyed;
  • onDataUpdate – fires by the Chart Update Data block.

Component Actions:

Chart Get Properties:

Gets chart's properties
Input parameters:
  • Component Id [string] - chart component's identifier.
Output parameters:
  • Aggregate by [enum] - selected method of aggregation by date;
  • Method [enum] - selected counting method;
  • X axe caption [string] - x-axis title;
  • Y axe caption [string] - y-axis title;
  • Visible [boolean] - state of visible;
  • Loading [boolean] - state of loading.
​

Chart Set Properties:

Sets chart's properties
Input parameters:
  • Component Id [string] - chart component's identifier;
  • Aggregate by [enum] - selected method of aggregation by date;
  • Method [enum] - selected counting method;
  • X axe caption [string] - x-axis title;
  • Y axe caption [string] - y-axis title;
  • Visible [boolean] - state of visible;
  • Loading [boolean] - state of loading.
​

Chart Update Properties:

Update chart's properties
Input parameters:
  • Component Id [string] - chart component's identifier;
  • Aggregate by [enum] - selected method of aggregation by date;
  • Method [enum] - selected counting method;
  • X axe caption [string] - x-axis title;
  • Y axe caption [string] - y-axis title;
  • Visible [boolean] - state of visible;
  • Loading [boolean] - state of loading.

Chart Get Data

Gets data from chart
Input parameters:
  • Component Id [string] - view component's identifier.
Output parameters:
  • Data [Data Model] - Data Model element to be used. Available in the business process when Component ID is specified only.
​

Chart Set Data

Sets data for chart
Input parameters:
  • Component Id [string] - chart component's identifier.
  • Data [Data Model] - Data Model element to be used. Available in the business process when Component ID is specified only.
​

Chart Update Data

Update data for chart
Input parameters:
  • Component Id [string] - chart component's identifier.
  • Data [Data Model] - Data Model element to be used. Available in the business process when Component ID is specified only.

Usage example:

This element is suitable for displaying data and relationships between them. For example, the number of orders, from the date
Previous
Video
Next
Form
Last modified 3mo ago
Copy link
Outline
Initial setting:
Look&Feel Settings:
Data:
Workflow triggers:
Component Actions:
Chart Get Properties:
Chart Set Properties:
Chart Update Properties:
Chart Get Data
Chart Set Data
Chart Update Data
Usage example: