Scatter layer

更新时间:
复制 MD 格式

Configure the scatter layer to display point-based geospatial data on a 3D Earth.

Chart style

The scatter layer is a child component of 3D Earth that visualizes point-based geospatial data. You can configure the size, color, type, longitude, and latitude of scatter points.image.png

Style paneimage.png

  • Search Configuration: Click the Style icon image in the upper right corner of the panel to enter the name of the configuration item you wish to locate in the search field. The system supports fuzzy matching. For more information, see Search configuration item.

  • Height: The height of the scatter layer relative to the globe's surface. Valid values: 2 to 100.

  • Breathing rate: The speed of the scatter layer's gradient animation. Valid values: 0 to 0.1.

  • Opacity: The opacity of the scatter layer. Valid values: 0 to 1.

  • Data ranking: Divides data into 2 to 7 levels based on the value field using natural breaks, preventing rendering issues from large data variations.

  • Scatter texture: Sets the texture style for scatter points using a URL.

  • Scatter size (from small to large): Click the image or image icon to add or remove a scatter size type. Click the image or image icon to arrange multiple scatter size types. Click the image icon to copy the current scatter style configuration and create a new one with the same settings.

    Value: The maximum value for scatter points of this type.

    Important

    This configuration option is an array used for data classification. The settings for each tier, from Type 1 to Type n, are configured in ascending order. For example, if Type 1 is set to 10, data with a value from 0 to 10 is displayed as 10. If Type 2 is set to 20, data with a value from 11 to 20 is displayed as 20. If the data classification option is configured for three tiers, the value of Type 3 becomes the display value for data with a value greater than 20.

  • Default Color: The color applied to scatter points whose type field does not match any Scatter Type (type) configuration.

  • Scatter type: Click the image or image icon to add or remove a scatter type. Click the image or image icon to arrange multiple scatter types. Click the image icon to copy the current scatter type configuration and create a new one with the same settings.

    Parameter

    Description

    type

    The value of type corresponds to the type field in the data.

    Color

    The color for scatter points of this type.

    Note

    This configuration option can be an array where you can configure multiple series. Data points are rendered using the color from the series that corresponds to the type field in the data. If the type field in the data does not exist in this configuration, the point is rendered in the default color.

Data source paneimage.png

Field

Description

type

The scatter point type and the Scatter Point Type (type) option together determine the color of the scatter point.

value

The value of a scatter point, together with the Scatter Point Size Value setting, determines the size of the point.

lng

The longitude of the scatter point.

lat

The latitude of the scatter point.

Data Item Configuration

Description

Data Source

The component's data source displays the data fields contained within the component using code editing or visual editor. You can also modify the data type to flexibly configure the component's data.

Data Mapping

When you need to customize chart field configurations, you can set different field mappings in the Data Mapping module to map these fields to the corresponding fields of the component. This allows for real-time data matching without altering the data source fields. Additionally, click the image icon to configure field styles individually.

Filter

Open the Filter to select an existing data filter or create a new one, and configure the data filter script to achieve data filtering capabilities. For more information, see manage data filters.

Data Response Result

This feature displays the component's data in real-time. When the component's data source changes, the data response result will display the latest data accordingly. In case of a delayed system response, you can click the image icon on the right to check the current data response result, or click the image icon on the right to obtain the most recent data for the component. You can also click to view examples to see sample response results for the current component.

Disable Loading State

Check the check box to hide the loading content during component updates and data dashboard previews. Unchecking will display the loading content. The default setting is unchecked.

Controlled Mode

Check the check box to prevent data requests upon the component's initialization. Data requests will only be initiated through global variables or methods configured in the blueprint editor. Unchecking allows for automatic update requests. The default setting is unchecked.

Automatic Update Request

Check the check box to manually set the polling frequency for dynamic polling. Clearing this option disables automatic updates, requiring manual page refreshes or data request triggers through the blueprint editor and global variable events for updates.

Advanced pane

No interactive events are available for this component.

Blueprint interaction

  1. Click the image icon in the upper-left corner of the page to open the Blueprint page.

  2. On the Layer Nodes tab, add this component to the main canvas.

  3. View the Blueprint configuration parameters.{AE09F358-A6A3-4A9C-B559-739E537120DF}

    Note

    Click the image icon in the anchor point area on the right to view event and action parameter tooltips.

    • Events

      Event

      Description

      On data update

      Triggered after a data request completes and all filters are applied. Returns the processed data as a JSON object. For the data structure, see the Data response section on the Data Source pane.

      On data request status change

      Triggered when a data request status changes. Returns the current request status as a callback parameter.

    • Actions

      Actions

      Description

      Import data

      Imports and re-renders data in the component format without requesting new data from the server. For a data example, see the Data response section on the Data Source pane.

      Request data

      Re-requests data from the server, using data from upstream processing nodes or layer nodes as parameters. For example, if a scatter layer uses the API data source https://api.test and the data passed to the Request Data action is { id: '1'}, the final request URL is https://api.test?id=1.

      Toggle visibility

      The Toggle visibility, Show, and Hide widget actions do not require parameters by default. You can add animation configurations as needed. See the reference data example.

      {
        // Animation type. Options: appear, fade, slideToUp. Default: fade. If left blank, there is no animation.
        "animationType": "fade",
        // Animation duration. Default: 1000. Unit: ms.
        "animationDuration": 1000,
        // Animation curve. Options: linear, easeInOutQuad, easeInOutExpo. Default: linear.
        "animationEasing": "linear"
      }

      Show

      Hide

      Update component configuration

      Dynamically updates the component style. Pass an object with the style parameters to change. To get the full configuration structure, click Copy Configuration to Clipboard in the Style pane.