HUAWEI CLOUD low-code platform Astro Canvas builds a large car display screen——Experimental Instruction Manual

Experimental background

The large-screen application Astro Canvas is one of the sub-services of Huawei Cloud's low-code platform Astro. It is based on data visualization, easy layout on the screen, and multi-screen adaptation visualization. Users can easily build professional-level Data visualization big screen. For example, car display screens, monitoring screens, project development screens, and data analysis boards.

All operations in this experiment are based on the HUAWEI CLOUD Astro platform. Through this experiment, users can become familiar with the development process of the HUAWEI CLOUD Astro low-code platform.

The experimental resources need to open Astro free trial:

Click to try Astro Canvas Basic Edition for free :

Purpose

This experiment guides the use of HUAWEI CLOUD Astro to develop large-screen applications. Through this experiment, you will be able to:

Familiar with Huawei cloud services, understand the basic functions, some components and application templates of Astro Canvas;
Understand the overall process of Astro Canvas large-screen application development, data creation-component application-add interaction-application release;
Use the template resources of HUAWEI CLOUD Astro Canvas to complete the operation of the personalized visualized large screen.

Experiment introduction

Project name: Astro Canvas car display large screen construction
Project Introduction: Perform personalized operations on the Astro Canvas car large-screen template
Development language: not required
Cloud service involved: HUAWEI CLOUD Astro
project example

prerequisite

This experiment needs to be carried out on HUAWEI CLOUD, so users need to log in with a HUAWEI ID; users without a HUAWEI ID should first register a HUAWEI ID and activate HUAWEI CLOUD, and complete real-name authentication at the same time. During the experiment, please use the Chrome browser to complete relevant operations.

For HUAWEI ID registration steps, please refer to:

Registering a HUAWEI ID and Activating HUAWEI CLOUD_Account Center_User Guide_HUAWEI CLOUD

For real-name authentication steps, please refer to:

https://support.huaweicloud.com/usermanual-account/zh-cn_topic_0077914254.html

Users who already have an account or have completed registration log in to the official website of HUAWEI CLOUD: [ https://www.huaweicloud.com/]

For HUAWEI CLOUD login, please refer to:

Logging In to HUAWEI CLOUD_Unified Identity Authentication Service IAM_User Guide_HUAWEI CLOUD

Operating procedures

Operation guide

Open Astro Canvas Basic Edition Free Trial

This experiment can be completed using the basic version of Astro Canvas. Click the link " Apply for a free trial of Astro Canvas " to complete the collection of free resources.

After the payment is completed, click to enter the home page

Create static data dataset

Before downloading the car template, we need to prepare the data first. Here we will use the Excel table import of static data. You can first download the Excel table template provided in the attachment of this article : car parameter table

On the main menu, choose Data Center, and in the left navigation bar, choose Datasets > All. On the Dataset Management page, click New Dataset.

On the New Dataset page, select "Static Data" for "Data Source".

Select "Preset Category" for "Catalogue", and "Dataset Name" can be customized. Here you can write "Car Parameter Table".

Then click Add Static Data, drag the local Excel file (the file size cannot exceed 512KB) into "Upload Files", and click "Save".

After the upload is complete, you can see the data configuration on the right, click Save.

Remarks: In addition to Excel import, static data can also be entered manually: On the data configuration page, click

Enter the corresponding data. If you need to add columns or rows, you can click "Add Column/Row" to add columns and rows, or modify the imported data. >>View more introductions to data access methods

Create Astro Canvas data big screen project

After the dataset is created, in the main menu, select "Project List" to return to the Astro Canvas project list page. Select the "View All" template, find the "Car Showcase" template, and click "Use this template"

Enter the "Project Name" and "Page Title" to enter the template application.

Personalized large screen creation

First, we learn how to use datasets in components

Double-click the basic column chart with the mouse, and some components will appear on the top, click the "Data" component button

Select "Data Type" - "Dataset", select the car parameter table

Then click the component preview, you can see the table fields, put the table fields on the left into the X-axis data and Y-axis data of the configuration item, you can see the preview effect, click Save.

Then, the histogram style can be edited. Reference: Introduction to Astro Basic Bar Chart Components

In this way, your personalized large screen is completed.

In the same way, we can also edit and create the general form of quotation. Interested friends can play freely, so I won’t repeat them here. Remarks: For more product components, please refer to Component Management

Next, we can add interactive events: click "Book a Test Drive" on the canvas, then click the layer in the upper left corner, find "Text Editing", and click the interactive button to enter the interactive event page.

According to the figure below, enter the required parameters and other options, click "OK" and "Finish" to save and exit.

After clicking Save, click Preview to see whether the interaction event takes effect. The following three buttons are Save, Preview and Publish

After the interaction event takes effect, click "Publish" and check "Publish Link" to publish successfully.

After the page is published successfully, you can click the upper left corner to exit to the project list page, and select your own project to publish. Project release can fill in the version number for project management.