The 2D icon layer is a data mapping layer in 3D City Builder. It supports independent style and data configurations, such as blending modes, style mappings, and statuses. This topic describes the configuration items for the 2D icon layer.
In the layer list on the left side of the scene editor, click the 2D Icon Layer to open the configuration panel and configure the style and data for the 2D Icon Layer.
If the 2D Icon Layer is not in the layer list, you have not yet added the 2D Icon Layer. To add it, see Add a widget.
Style panel
-
Search Configuration: To quickly find a specific configuration item, click on the Configuration panel in the upper right corner and enter the item's name in the Search Configuration field. The system utilizes a fuzzy match to assist in locating items. For more information, see search configuration items.
The following tables describe the parameters on the configuration panel for the 2D icon layer.
General
Parameter
Description
Blending mode
Sets the blending mode for the 2D icon layer. Options are Additive and Normal.
Fixed size
Turn on the switch to keep the screen space size of the 2D icons constant, regardless of the camera distance. Turn off the switch to make the icon size change with the camera distance. The closer the camera, the larger the icon.
Depth write
Turn on the switch to enable depth write for the 2D icon layer. Turn off the switch to disable it.
Depth test
Turn on the switch to enable depth test for the 2D icon layer. Turn off the switch to disable it.
Graphics
Parameter
Description
Icon style
The style of the icon. Options include General Icon, Industrial Icon, Medical Icon, Aviation Icon, Firefighting Icon, or Transportation Icon. For more information about how to modify the style, see Use the shape mapper.
Icon color
Sets the default color of the 2D icons. For more information about how to modify the color, see Use the color mapper.
Icon size
Drag the slider to set the size of the 2D icons. The value range is 0 to 100. You can use this parameter with the Fixed size parameter to control the icon size. For more information about how to modify the size, see Use the size mapper.
NoteClick the
switch to enable visual mapping. This lets you configure visual mapping effects for the icon color, style, and size. If visual mapping is disabled, the standard configuration options are used instead.Animation: Configure the animation effect for the 2D icon layer.
Parameter
Description
Breathing speed
Drag the slider to set the speed of the breathing animation for the 2D icons. The value range is 0 to 30.
Interaction
Parameter
Description
Mouse interaction
Turn on the switch to enable mouse interaction for the 2D icons. Turn off the switch to disable it.
Callback ID
Sets the callback ID for the 2D icons.
Highlight mode
Sets the highlight mode for the 2D icon layer. Options are Normal, Overwrite, and None.
Selected color
Sets the color of a 2D icon when it is selected.
Opacity
Drag the slider to set the opacity of the 2D icons. The value range is 0 to 1.
Data panel
Field |
Description |
lng |
The longitude of the 2D icon. |
lat |
The latitude of the 2D icon. |
altitude |
The height of the 2D icon from the ground surface. |
colorField |
Sets the color of the 2D icon. |
markerField |
Sets the icon style of the 2D icon. |
sizeField |
Sets the size of the 2D icon. |
Configuration Item |
Description |
Controlled Mode |
Turn on the switch to prevent the widget from requesting data upon initialization. Data is requested only through a callback ID or a method configured in the blueprint editor. Turn off the switch to allow automatic data update requests. The switch is off by default. |
Automatic Update Request |
Select this option to enable dynamic polling and manually set the polling frequency. If you clear this option, data is not updated automatically. You must manually refresh the page or trigger data update requests using the blueprint editor or callback ID events. |
Data Source |
Click Configure Data Source. In the Set Data Source panel, you can modify the data source type and data query code, preview the data source return results, and view the data response. |
Data Result |
Displays the response result of a data request. When the data source changes, click the |
icon on the right to view the real-time data response.You can also use the layer data API as a block data API to configure more data source types in the data dashboard or to interact with data from common chart widgets. For more information, see One-click generation of block APIs.
If you created your 3D City Builder project in Spatial Data Project mode and the project contains data primitive layer content, you can use the Spatial Build Data Source to obtain spatial map data when you configure the data panel in the scene editor. The steps are as follows:
In the layer configuration panel, select the Data tab. Click the Data Source Type drop-down list at the bottom of the panel and select Spatial Build Data Source.
From the Data Project drop-down list at the bottom of the panel, select an existing data project from the spatial build platform.
After you select a data project, select a matching dataset from the Dataset drop-down list.
NoteIf no configurable data types are available for the Data Project and Dataset configuration items, click Go to Spatial Build Platform to Manage Data in the panel to configure data in the spatial build platform. For more information, see Overview of spatial data management.
Blueprint interaction
On the Scene Editor page, in the layer list on the left, click the
icon to the right of 2D Icon Layer.Click the
icon in the upper-left corner of the page.On the blueprint editor configuration page, click the 2D icon layer in the imported nodes bar. The configuration parameters for the layer appear on the canvas, as shown in the following figure.
Events
Event
Description
When a data API request is complete
This event is triggered after the data API request is returned and processed by the filter. The processed data is also returned in JSON format. For a data example, see the Data Response Result section on the Data tab of the widget's configuration panel in the canvas editor.
Click event
This event is triggered when you click a 2D icon. It returns the click position and the raw data item.
Actions
Action
Description
Request data API
Requests server-side data again. Data from input data processing nodes or layer nodes is used as parameters. For example, if a 2D icon layer uses the API data source
https://api.testand the data passed to the Request data API action is{ id: '1'}, the final request is sent tohttps://api.test?id=1.Import data API
Processes data based on the component's drawing format, then imports the data to redraw the component. This action does not request server-side data again. For data examples, see the Data Response area on the Data tab. This tab is in the component's configuration panel on the right side of the canvas editor.
Show component
Shows the component. No parameters required.
Hide component
Hides the component. No parameters required.