This topic describes the meaning of each configuration items of the two-dimensional icon layer.
Chart style
The 2D icon layer is a sub-component of the 3D flat map (v3.x version). It supports independent style, data, and interaction configuration, including the shape, size, and color of the icon. It can locate the geographic position in the 3D flat map in the form of a 2D icon. 
Style Template 
Search Configuration: Click the Search configuration items icon
in the upper-right corner of the Style panel. In the Search Configuration panel, enter the name of the configuration items that you want to search for and locate the configuration items. Fuzzy match is supported. For more information, see Search configuration items. General: Set the general configuration items of the 2D icon layer.
Metric
description
Opacity
The opacity of the 2D icon layer. Unit: %. Valid values: 0 to 100. The larger the value, the more opaque the 2D icon layer.
Graphics: Sets the graphics configuration items of the 2D icon layer.
Icon Shape: specifies the shape of the icon that is displayed on the 3D flat map by the 2D icon layer. For more information, see Use the shape mapper.
Icon Size: the size and style parameters of the icons on the 2D icon layer.
Metric
description
Width
The width of the two-dimensional icon layer icon. The value ranges from 0 to 400. Unit: pixels.
Height
The height of the icon on the two-dimensional icon layer. The value ranges from 0 to 400. Unit: pixels.
Label: the style of the label in the 2D icon layer.
Show Label: If you turn on the switch, the 2D icon layer label is displayed. If you turn off the switch, the 2D icon layer label is not displayed.
Display Mode: the display mode of the 2D icon layer. Valid values: Select All and Click.
Content Style: the style of the tag content.
Item
Example value
Style per line
Click the
or
icon on the right side of Style per Line to add or delete a style for each line. Click the
or
icon to configure the arrangement of multiple content styles per row. Click the
icon to copy the current selected content style configuration and add a new line of content with the same configuration. Row Field: the name of the row field, which must match the field in the data panel.
Field Style: Set the field style of the line, including the font style, font size, color, and weight of the field.
Field Prefix: Specify the content, interval, font, font size, color, and weight of the field. Click the
icon to the left of Field Prefix to control the display of Field Prefix. Field Suffix: Specify the content, interval, font, font size, color, and weight of the field suffix. Click the
icon to the left of Field Suffix to control the value of Field Suffix.
Field Width
Sets the width of the field, including the adaptation type of the field and the maximum width of the field. The adaptation type of the field includes adaptive and fixed width.
Row height ratio
The row height ratio of the tag. Valid values: 1 to 2.
Content Stroke
Set the color and thickness of the content edge of the tag. The value of the thickness value ranges from 0 to 5. Click the
icon to the left of Content Stroke to control the display of Content Stroke. Content Shadow
Specifies the shadow of the label content, including the color, thickness, X-direction offset, and Y-direction offset of the shadow. Valid values: 0 to 10. Unit: px. Click the
icon to the left of Content Shadow to control the display of Content Shadow. Background Style
Sets the background style of the label content. Click the
icon to the left of Background Style to control the display of the Background Style. Background Type: Set the background type of the tag content, including Vector and Image. If you set the Background Type parameter to Vector, set the Background Style parameter based on the following parameters:
Background Color: the background color of the tag.
Border Style: Set the border style of the label content, including the line type, line width, and color of the border.
Border Fillet: the rounded corners of the border of the label content. Unit: pixels.
Content Margin: Set the distance between the content in the tag content and the content in the top, bottom, left, and right directions.
If you set the Background Type parameter to Image, set the Background Style parameter based on the following parameters:
Image Template: Specify an image template for the background of the tag content.
Opacity: Set the opacity of the background image, ranging from 0 to 100.
Content Margin: Specify the distance between the content in the tag content and the content in the top, bottom, left, and right directions.
Interaction: the interaction parameters of the two-dimensional icon layer.
Graphic Interaction: On the left side of
Graphic Interaction, you can control the display of the Graphic Interaction style. Multi-Select: If you turn on the switch, the interactive effect is supported. If you turn off the switch, the interactive effect is disabled.
Click Style: The
icon on the left of Click Style allows you to control the display of Click Style. Metric
description
Wireframe thickness
The thickness of the interactive wireframe when the icon is clicked. The value ranges from 0 to 5. Unit: px.
Wireframe Color
Sets the color of the interactive wireframe when the icon is clicked.
Condition: the description of the condition style.
Conditional Style: Click the
or
icon to add or remove a conditional style. Click the
or
icon to configure the arrangement style of multiple conditional styles. Click the
icon to copy the selected conditional style configuration and add a conditional style. For more information about how to configure a conditional tree, see Usage notes. Graphics: specifies the style of the graphics in the 2D icon layer. Click the
icon on the left of Graph to control the display of the corresponding graph in the 2D icon layer under this condition. Icon Shape: Set the icon shape of the two-dimensional icon layer in this condition. Click the icon on the left
to turn the icon shape on or off. Icon Size: the size of the icon in the two-dimensional icon layer, including the width and height of the icon. Valid values: 0 to 400. Unit: pixels. Click the icon on the left
to control the display of the icon size button.
Data Sources panel 
Column | Description |
| The longitude of the 2D icon layer. |
| The latitude of the 2D icon layer. |
| The name of the 2D icon layer. |
| Unique identifier of the 2D icon layer. |
| The custom icon path for the 2D icon layer. |
| The shape mapping field of the 2D icon layer. |
Configure data items | Description |
Data sources | You can use the code editor or visual editor to view the data fields contained in the widget. You can also modify the data type to flexibly configure the component data. |
Data Mapping | If you need to customize chart field configurations, you can set different field mapping content in the Data Mapping module and field mapping these content to the corresponding fields of the widget. This allows you to match data without modifying the fields in the data source. You can also click the |
Configure a filter | Turn on Filter, select an existing data filter or create a data filter, and configure a data filter script to filter data. For more information, see Manage data filters. |
Data Response Result | The Data Response Result section displays widget data in real time. If the data source of the widget changes, this section displays the latest data. If the system response is delayed, you can click the |
Forbid Loading | If you select the check box, you will not see the loaded content during component initialization when you update the component and preview the data kanban. If you select the check box, the opposite is true. By default, the status is deselected. |
Controlled Mode | If you select the check box, the component does not request data in the initialized state, and only requests data by using global variables or the method configured in Blueprint Editor. If you clear the check box, you can use automatic update to request data. By default, the status is deselected. |
Auto Data Request | Select the check box to manually enter the time frequency of polling to set dynamic polling. If you clear the page, the page is not automatically updated. You need to manually refresh the page or use Blueprint Editor and global variable events to trigger a request to update data. |
Advanced Panel 
Turn on the switch to enable the widget interaction feature. When a point is clicked, a data request is triggered and a temporary variable is thrown. This way, data at different points is dynamically loaded when the point is clicked. By default, the lng and lat values of the clicked area are displayed. For more information, see Component interaction configuration.
Blueprint Interaction
Click the
icon in the upper-left corner to go to the Blueprint page. On the Layer Nodes tab, add the widget to the main canvas.
View blueprint configuration parameters.

Event
Event
Description
When the data interface request is completed
The event is triggered with the processed JSON data after a data interface request is responded and processed by a filter. For more information about specific data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.
When you click a point
Throws data when a point within the 2D icon layer is clicked.
Action
Action
Description
Request Data Interface
This action is performed to request the server data again. The data sent by an upstream data processing node or layer node is used as a parameter. For example, if the API data source is
https://api.testand the data passed to the request data interface is{ id: '1'}, the final request interface ishttps://api.test?id=1.Import data
After data of a widget is processed in accordance with its drawing format, the widget is imported for redrawing. You do not need to request server data again. For more information about specific data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.
Switch Show /Show
Specifies whether to show or hide a widget. No parameters are required.
Display
Display the widget. For more information, see Data example.
{ "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }Hide
Hide the component. For more information, see Data example.
{ "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }Update component configurations
Style configurations of widgets are dynamically updated. In the Style panel, click Copy Configuration to Clipboard to obtain the configuration data of the widget. After that, change the style field for the data processing node in Blueprint Editor.
icon to configure the field style.
icon on the right to view the data response result. You can also click the
icon on the right to obtain the latest data of the widget. You can also click View Example to view an example of the response result of the current component.