Updated on 2024-06-21 GMT+08:00

3D China Map (2019)

This section describes parameters of a 3D China map (2019).

Pattern

  • Size/Position
    • Size: width and height of the component. Unit: pixel.
    • Position: position where the component is located in the canvas. Unit: pixel.
  • Global Style
    • Map Center: location of the map center on the canvas.
    • Globe Rotation: to set Scaling, Horizontal, and Vertical of the map.
    • Map Color: fill color of the area blocks on the map.
    • Borderline: color and width of the borderline on the map.
  • Subcomponents

    You can add subcomponents Flying Lines, Scatters, and Columns to a 3D China map (2019).

    The operations can be performed on those subcomponents:
    • Adding subcomponents

      In the Pattern panel, click Add Subcomponent. In the displayed menu, select a subcomponent. After the subcomponent is added, the name of the added subcomponent is displayed under Add Subcomponent, for example, fly line.

    • Editing subcomponents

      After clicking a subcomponent, you can edit it.

    • Deleting subcomponents

      To delete a subcomponent, click .

Data

The following figure shows the data of a 3D China map (2019):

  • Field and Mapping: The data format contains the following fields by default:
    • adcode: administrative area code. This is a reserved field.
    • name: name of the area displayed on the map component.
    • value: value of the area displayed on the map. It determines the map color together with Max. Value, Min. Value, and No Data in Map Color under Global Style.
  • Data Source Type: to select the data source of the chart. Multiple data sources are provided for you to select. You need to add data sources first. For details, see Data Connection Overview.
  • Automatic Update: If you select Automatic Update and set Update Interval, the data is automatically updated based on the interval.
  • View Response Result: to view the data information of the selected data source.

Interaction

For details about whether the component supports the interaction function and how to use the interaction function, see Configuring Component Interaction.

Flying Lines

A flying line dynamically connects two geographical locations on the map.

  • Pattern
    • Dotted Line: style of dotted lines.
    • Height: curve height of flying lines. When the value is 1, a flying line is approximately a straight line.
    • Speed: speed of flying lines
    • Width: width of flares. Unit: pixel.
    • Color: color of flying lines.
  • Data
    • Field and Mapping: The data format contains the following fields. Set the field names in the data source to which each field is mapped. If the field names are left empty, the field names are the same as those in the data source to which each field is mapped.
      • from: longitude and latitude of the start point of a flying line. The longitude and latitude are separated by commas (,).
      • to: longitude and latitude of the end point of a flying line. The longitude and latitude are separated by commas (,).

      The data source is in JSON format. The following is an example:

      [
        {
          "from": "116.85059,31.69078",
          "to": "118.69629,36.20882"
        },
        {
          "from": "120.89355,37.09024",
          "to": "116.93848,31.61597"
        }
      ]
    • Data Source Type: to select the data source of the chart. Multiple data sources are provided for you to select. You need to add data sources first. For details, see Data Connection Overview.
    • Automatic Update: If you select Automatic Update and set Update Interval, the data is automatically updated based on the interval.
    • View Response Result: to view the data information of the selected data source.
  • Interaction

    For details about whether the component supports the interaction function and how to use the interaction function, see Configuring Component Interaction.

Scatters

Data information about geographical locations on the map can be displayed by scatters.

  • Pattern
    • Size: size of scatters.
    • Color: color of scatters.
  • Data
    • Field and Mapping: The data format contains the following fields. Set the field names in the data source to which each field is mapped. If the field names are left empty, the field names are the same as those in the data source to which each field is mapped.
      • lon: longitude of a scatter.
      • lat: latitude of a scatter.
      • value: value of a scatter. The value and the scatter size in the style determine the scatter size together. A larger value leads to a larger scatter.

      The data source is in JSON format. The following is an example:

      [
        {
          "lat": 62.103883,
          "lon": -106.523438,
          "value": 51
        },
        {
          "lat": 50.064192,
          "lon": -74.179688,
          "value": 94
        }
      ]
    • Data Source Type: to select the data source of the chart. Multiple data sources are provided for you to select. You need to add data sources first. For details, see Data Connection Overview.
    • Automatic Update: If you select Automatic Update and set Update Interval, the data is automatically updated based on the interval.
    • View Response Result: to view the data information of the selected data source.
  • Interaction

    For details about whether the component supports the interaction function and how to use the interaction function, see Configuring Component Interaction.

Columns

Data information about geographical locations on the map can be displayed by column.

  • Pattern

    Height: height of columns. Unit: pixel.

    Color: color of columns.

  • Data
    • Field and Mapping: The data format contains the following fields. Set the field names in the data source to which each field is mapped. If the field names are left empty, the field names are the same as those in the data source to which each field is mapped.
      • lon: longitude of a column.
      • lat: latitude of a column.

      The data source is in JSON format. The following is an example:

      [
        {
          "lat": 31.8998,
          "lon": 102.2212
        },
        {
          "lat": 28.6542,
          "lon": 120.079
        }
      ]
    • Data Source Type: to select the data source of the chart. Multiple data sources are provided for you to select. You need to add data sources first. For details, see Data Connection Overview.
    • Automatic Update: If you select Automatic Update and set Update Interval, the data is automatically updated based on the interval.
    • View Response Result: to view the data information of the selected data source.
  • Interaction

    For details about whether the component supports the interaction function and how to use the interaction function, see Configuring Component Interaction.