This topic demonstrates how to use DataV templates to develop visualization application projects by building a Epidemic Situation Control visualization application.
Background information
This example uses Static Data Source, allowing you to directly paste prepared data in the widget's data configuration area. If your data source is CSV File, Database, or another type, you need to add a data source first.
If you need to use an API data source, you can directly enter the API address in the data configuration bar. When configuring, if you need to enable operations such as Server Proxy Request, see Configure cross-domain data.
Effect display
Operation flow
You can quickly experience DataV-Board features by completing the following steps to create a template visualization application.
Step 1: Create a visualization application
Log on to the DataV console.
On the Projects page, click PC Creation. Select a suitable template. This example uses the Epidemic Situation Control template. Click Create Project.
In the Create Project dialog box, enter the visualization application name and select a project group. If no group has been created, you can select Ungrouped.
Click Create.
After the application is created successfully, you will be redirected to the canvas editor page, where you can see a well-designed template that meets the display requirements for enterprise new retail business data.
Step 2: Configure widget styles
After creating the visualization application, you can modify widget styles through the following methods.
Click to select a widget in the Layers panel on the left, and then adjust its style configuration through the style panel on the right.
NoteYou can double-click the widget name in the canvas editor layer to rename the current widget.
Use the same method to adjust the configuration of other widgets according to your requirements.
Step 3: Adapt widget data
You can modify widget data content through the following methods according to your actual needs.
In the Layers panel on the left, click to select a widget. For example: Double 11 bubble chart.
Select the Data tab in the style panel on the right, and click Configure Data Source. In the Data Source dialog box, select Static Data for Data Source Type.
In the data configuration area below, modify the existing data in the template according to your requirements, or paste the prepared JSON format data.
NoteThe field names when adding data must be consistent with the system settings.
After completing the data configuration, you can click the
icon after Data Response Result on the Set Data Source page to refresh the data response result.After a successful data response, Configuration Complete and Matched Successfully will be displayed on the Data page.
Use the same method to configure the data for all widgets in the visualization application.
Step 4: Preview and publish the visualization application
After configuring widget styles and data sources, you can preview and publish the visualization application to enable online playback and demonstration of the dashboard. This step introduces how to preview and publish a visualization application.
Click the
icon in the upper-right corner of the canvas editor to preview the visualization application in a new page.After successfully previewing, you can publish the visualization application by following these steps.
Click the
icon in the upper-right corner of the canvas editor, and then click Publish Project in the dialog box to open the publish page.On the publish page, click the
icon to the right of Sharing URL to copy the link.NoteOn the publish page, you can perform publication information and snapshot management as needed.
Copy and paste the URL to the address bar of a browser to view the published visualization application online.