Help Center/ Huawei Cloud Astro Canvas/ User Guide/ Widgets/ Maps/ 3D Earth
Updated on 2025-11-28 GMT+08:00
View PDF
Share

3D Earth

This widget renders the Earth model in 3D space and supports adding layers via ECharts-GL.

On the large screen design page, drag the 3D Earth widget from Map to the blank area of the canvas, as shown in Figure 1.

Figure 1 3D Earth
Figure 2 Margin style

Card

A card wraps a chart widget. A widget consists of card elements (card title, chart, card background, and card border) and chart elements.

Figure 3 3D Earth card
Table 1 Card parameters

Parameter

Description

Background
  • Background color: Background color of the widget card.
  • Border: Border of the widget card. Options: no border, full border, and corner border. For full border and corner border, you can set the line type and rounded corners of the outer border of the widget.
  • Style: Image display style. The options are normal, center, stretch, and tiled.
  • Choose image: Use a local image as the widget background. Directories and subdirectories can be added to facilitate image management by category. JPG, JPEG, PNG, or GIF images are recommended. The size of each image cannot exceed 50 MB.

Effect

Whether the widget is highlighted. The widget can be displayed by default or when the page is displayed.

Padding

Distance between the chart in the widget and the four sides (top, bottom, left, and right) of the widget (see Figure 2). The default value is 0, indicating that the chart spreads across the widget.

Configuration

In the configuration, you can set the basic settings, boundary, view angle, and map controls of the widget. For example, you can choose whether to display the atmosphere and whether to enable zooming and dragging.

Figure 4 3D Earth configuration
Table 2 Configuration parameters

Parameter

Description

Basic Setting
  • Base texture: texture on the surface of the sphere.
  • Height texture: The height texture can be used to display the light and dark details on the surface of the Earth.
  • Background color: Background color of the widget.
  • Show atmosphere: Whether to show the atmosphere.

Boundary Settings
  • Show boundary: Whether to show the boundary.
  • Choose GeoJSON: After uploading a GeoJSON file, you can use the data or select existing data. The GeoJSON file cannot not exceed 10 MB. The uploaded content is publicly accessible. Avoid uploading private information.
  • Boundary border: Set the border of the boundary.
  • Area color: Set the area color.
  • Hover settings: Whether to display the boundary when you move the pointer over it.
  • Boundary border highlight: Set the highlight of the boundary border.
  • Area highlight color: Set the highlight color of the area.

Viewing Settings
  • Center longitude: Set the longitude of the 3D Earth center point.
  • Center latitude: Set the latitude of the 3D Earth center point.
  • Auto rotate: Whether the 3D Earth rotates automatically.
  • Rotation speed: Set the rotation speed of the 3D Earth.
  • Viewing distance: Set the distance between the default view and the main body.
  • Minimum viewing distance: Set the minimum distance between the view and the main body.
  • Maximum viewing distance: Set the maximum distance between the view and the main body.

Map Operations
  • Drag and drop: Whether the map can be dragged.
  • Zoom: Whether the map can be zoomed in or out.

Graphic

A graphic is a specific graphical expression element that visualizes data in a widget, for example, a slice in a pie chart, a bar in a bar chart, a line or a kink point in a line chart.

Figure 5 Graphic

Layers: Click Add Layer to create a scatter chart.

Figure 6 Creating a scatter chart
Table 3 Layer parameters

Parameter

Description

Basic Configuration
  • Type: The option is fixed to Scatter Plot.
  • Layer: Whether to display a layer.

Layer Style
  • Scatter shape: The options are circle, rectangle, rounded rectangle, triangle, diamond, pin, and arrow.
  • Opacity: Transparency of scatter points in a scatter chart. The value ranges from 0 to 1.
  • Display type: Display type of the icon. The options are Unified Settings and By range.
  • Symbol size: size of a scatter.
  • Symbol color: color of a scatter.
  • Symbol hover color: Hover color of a scatter.
  • Animation: The animation effect can be enabled or disabled. When the animation is enabled, the interaction action becomes invalid.

Data

In the data settings, you can set the data source of the 3D Earth widget. For more information, see Data Access.

Interaction

In the interaction settings, you can configure interactions between the background widget and other widgets or pages. For details, see Interaction Configuration.

Parent topic: Maps