- Service Overview
-
User Guide
- Preparatory Work
- Introducing the DLV Console
- How-Tos
- Managing Workspaces
- Creating Data Connections
- Creating Screens
- Developing Screens
- Managing Screens
- Managing Layers
-
Data Connection Management
-
Creating Data Connections
- Data Connection Overview
- Using Static Data Sources
- Creating API Data Connections
- Creating CSV File Data Connections
- Creating Object Storage Service Data Connections
- Creating Data Warehouse Service Data Connections
- Creating Data Lake Insight Data Connections
- Creating MRS Hive Data Connections
- Creating MRS SparkSQL Data Connections
- Creating ClickHouse Data Connections
- Creating RDS for MySQL Data Connections
- Creating RDS for PostgreSQL Data Connections
- Creating RDS for SQL Server Data Connections
- Creating RDS for GaussDB Data Connections
- Creating GeminiDB Influx API Data Connections
- Creating Cloud Search Service Data Connections
- Creating DDM Data Connections
- Creating Oracle Data Connections
- Creating MySQL Data Connections
- Creating PostgreSQL Data Connections
- Creating SQL Server Data Connections
- Creating Elasticsearch Data Connections
- Editing Data Connections
- Searching for Data Connections
- Deleting Data Connections
-
Creating Data Connections
- Managing Components
- Component Guide
- Screen Combination
- Integrating DLV into Third-Party Systems
- Change History
- Developer Guide
- API Reference
-
FAQs
- What Is DLV Used For?
- Regions and AZs
- Can I Quickly Create a DLV Screen Using a Template?
- Can DLV Connect to Data Sources Through APIs?
- What Types of Data Connections Are Supported in DLV?
- How Do I Configure a CSV Data Source?
- How Do I Use the Interaction Function?
- What Can I Do If a Component Cannot Be Completely or Normally Displayed?
- How Do I Query Data Formats Supported by Different Components?
- What Can I Do When the WebGL Component Breaks Down?
-
More Documents
-
User Guide (ME-Abu Dhabi Region)
- Service Overview
- Preparatory Work
- Introducing the DLV Console
- How-Tos
- Managing Workspaces
- Creating Data Connections
- Creating Screens
- Developing Screens
- Managing Screens
- Managing Layers
-
Data Connection Management
-
Creating Data Connections
- Data Connection Overview
- Using Static Data Sources
- Creating API Data Connections
- Creating API Gateway Data Connections
- Creating CSV File Data Connections
- Creating Object Storage Service Data Connections
- Creating Data Warehouse Service Data Connections
- Creating Data Lake Insight Data Connections
- Creating MRS Hive Data Connections
- Creating MRS SparkSQL Data Connections
- Creating ClickHouse Data Connections
- Creating RDS for MySQL Data Connections
- Creating RDS for PostgreSQL Data Connections
- Creating RDS for SQL Server Data Connections
- Creating RDS for GaussDB Data Connections
- Creating GeminiDB Influx API Data Connections
- Creating Cloud Search Service Data Connections
- Creating a DAYU Data Connection
- Creating DDM Data Connections
- Creating Oracle Data Connections
- Creating MySQL Data Connections
- Creating PostgreSQL Data Connections
- Creating SQL Server Data Connections
- Creating Elasticsearch Data Connections
- Editing Data Connections
- Searching for Data Connections
- Deleting Data Connections
- Managing VPC Connections
-
Creating Data Connections
- Managing Components
- Component Guide
- Screen Combination
- Integrating DLV into Third-Party Systems
-
FAQs
- What Is DLV?
- What Is DLV Used For?
- Regions and AZs
- How Many Screens Can I Create in DLV?
- Can I Quickly Create a DLV Screen Using a Template?
- Can DLV Connect to Data Sources Through APIs?
- What Types of Data Connections Are Supported in DLV?
- How Do I Configure a CSV Data Source?
- How Do I Use the Interaction Function?
- What Can I Do If a Component Cannot Be Completely or Normally Displayed?
- How Do I Query Data Formats Supported by Different Components?
- What Can I Do When the WebGL Component Breaks Down?
- API Reference (ME-Abu Dhabi Region)
- Developer Guide (ME-Abu Dhabi Region)
-
User Guide (ME-Abu Dhabi Region)
- General Reference
Show all
Copied.
Configuring Component Data
This section uses a line component as an example to describe how to configure component data parameters.

Data Source Type
After selecting the data source type of a chart, you can view or edit the corresponding content in the data area. You can click in the lower right corner of the data area to zoom in the data area window. This helps you view and edit data.

The system provides the following data sources for users to select:
- Static data
The following displays a data format example. You can adjust the data values according to your specific requirements, or paste the prepared JSON data.
[ { "x": "01/01 09:17:56", "y": 375, "s": 1 }, { "x": "01/01 09:20:07", "y": 200, "s": 1 }, { "x": "01/01 09:28:07", "y": 25, "s": 1 }, { "x": "01/01 09:34:07", "y": 190, "s": 1 }, { "x": "01/01 09:40:07", "y": 90, "s": 2 }, { "x": "01/01 09:49:07", "y": 233, "s": 2 }, { "x": "01/01 09:55:07", "y": 150, "s": 2 }, { "x": "01/01 10:30:07", "y": 233, "s": 2 } ]
- API
DLV can connect to data sources through APIs. For details about the data format, see the example in the Static data pane. For details about how to add API data sources, see Creating API Data Connections.
- Database, CSV file, API Gateway, DAYU DLM, Elasticsearch, and OBS
If you select this type of data source, you need to select the corresponding data connection. For details about data connections, see Creating Data Connections. For details about the data format, see the example in the Static data pane.
Data Mapping
The system allows you to customize field mappings.
Data Field Settings


- Series Name: name of the series the field belongs to
- Color: color of the field in a chart
Data Series
The s field is a data series field. Data is grouped based on the value of the s field. As shown in Figure 3, the data whose value of s is 1 belongs to one group and the data whose value of s is 2 belongs to another group.
- Adding a data series
- Configuring a data series
Click
in front of a data series. On the displayed page, configure the following data series parameters.
- Series Name: name of the data series.
- Pattern: coordinate shape of the data series. The value can be Circle, Rectangle, Triangle, or others.
- Color: curve color of the data series.
- Width: curve width of the data series.
- Opacity: fill color transparency of the data series.
- Value Tag: If this option is selected, the value of the corresponding point is displayed in the chart. You can set the font size, color, font width, and position of the value tag.
- Link: Set the hyperlink of the data series.
- Link Mode: Possible values are New window, Current page, and Floating panel.
Automatic Update
If you select Automatic Update and set Update Interval, the data is automatically updated based on the interval.
Preview Result
You can click Update Query to manually update the component data when the data source changes. Click Preview Result to view the information about the selected data source.
A data request will time out in 60s. You need to allow for factors such as network latency and SQL execution efficiency to ensure that the data request is successful.
Converter
Convert the data into the data that meets the display requirements. For details, see Using a Converter.
Feedback
Was this page helpful?
Provide feedbackThank you very much for your feedback. We will continue working to improve the documentation.See the reply and handling status in My Cloud VOC.
For any further questions, feel free to contact us through the chatbot.
Chatbot