Extended Chart - 3D Globe

Extended charts-globe can display map data on the earth in a 3D way. It provides three ways to display map data: 3D column on globe, 3D Scatter on globe and 3D Line on globe.

1. Add a 3D column on globe

1) Click [Floating Element] > [Chart], and select [Extended Chart-Globe] > [3D column on globe].

2) Adjust the size of the chart.

2. Prepare data

You can directly use the built-in data in the template provided at the end of this section. The data shows the gross profit and net profit of a company in different regions.

3. Set the “Data” for the chart

1) Set the “Data” for the chart as shown in the figure below.

2) After the data are set as above, the column height reflects the [Value].

4. Set title

1) Select [Style] > [Title], and enter the title text: “ Gross Profit”. Set the text color as “white”.

2) Effect of Title under a preview mode

5. Set the legend section

1) [Legend] can be selected to customize the maximum and minimum values.

2) The color of each section in the Legend can control the color of the column. The column displays the color corresponding to the section where the value represented by the column falls. The form is set as “Gradient color” by default. You can customize the theme color and partitioning phases of the gradient color. If there is no custom maximum value or custom minimum value, the upper and lower bounds of the Legend are the maximum and minimum values of the data in the [Value].

3) You can manually set the range of the section and the corresponding color. It is recommended to set [Format] as [Number], and specify the specific format effect. For example, if the section contains a decimal, then the [Format] should be set as #0.00.

6. Set the orientation and position of the Legend

1) You can set the orientation and position of the Legend The orientation is set as “vertical” by default, which is displayed in the bottom left of the chart.

2) You can also customize the orientation as “horizontal”, which is displayed in the bottom middle of the chart.

7. Set the text format and background of the Legend

Set the text color as white, the background color as white, and the opacity as 30.

8. Set the column style

1) You can set the “Bevel” and “Opacity” of the column, which are 100% by default.

2) When “Bevel” is 100%, the top of the column turns into a smooth arc, which needs to be zoomed in for visual clarity.

3) When “Bevel” is 0%, the top of the column turns into a sharp angle.

9. Set the color of the elected column

The color is dark red by default. You can customize the color.

10. Set the earth radius and observation distance

1) Select [Globe]. The radius is [Automatic] by default, that is, the size of the earth will automatically change according to the size of the chart. [Depth] refers to the distance between the current observer and the earth, and its value is 200 by default.

2) If the Radius and Depth are adjusted, you will get a different preview result.

11. Set the layer color of the globe

1) The color of the Layer can be set as: Fluorescence, Blue, Black, and Red. The default color is fluorescence.

When the color of the Layer is set as blue:

When the color of the Layer is set as black:

When the color of the Layer is set as Red:

2) If the Height Texture is set as “Display” by default, there will be shadows on the surface of the globe under the preview mode, so as to indicate the local altitude.

If the Height Texture is set as “Hidden” by default, the surface of the globe will be flat under the preview mode, and the change of altitude cannot be reflected.

3) The [3D effect] is set as [Realistic] by default. There will be an obvious side light under the preview mode.

If [3D effect] is set as [Luminance], the light direction is even and there is no obvious side light.

12. Set the view control

[Automatic rotation] is on by default, and the “Rotate direction” is [Clockwise]. You can customize the rotation center to get different rotation effects.

13. Set the Light

1) The Light is white by default, with the intensity being 1. You can customize the light to yellow, and increase the intensity to 3.

2) [Shadow] refers to the shadow of the column on the area when there is side light. [Shadow] is “on” by default.

14. Set BG style

Select [BG] tab to select: No Background, Color, Gradient Color or Image. By default, a built-in star image is used as the background

15. Set the Tooltip

1) Select [Tootip], where only [Name] and [Value] will be displayed by default.

2) You can set the style of the Tootip, including text, border and background.

3) The default effect of the Tootip is as follows

16. Final effect

1) The globe rotates automatically.

2) The globe can be rotated and zoomed in/out with the mouse.

3) A prompt box pops up when the column is clicked.

Download template

3D Column on Globe.cpt

Note: The configuration method of 3D Scatter on globe is basically similar to that of 3D column on globe, so some of the settings are not described in detail.

1. Add a 3D scatter on globe

1) Click [Floating Element] > [Chart], and select [Extended Chart-Globe] > [3D scatter on globe].

2) Adjust the size of the chart.

2. Prepare data

Use the same data as introduced in the previous section. The dataset has been built into the sample template.

3. Set the “Data” for the chart

1) Set the “Data” for the chart as shown in the figure below.

2) The sphere on the globe surface reflects the size of the [Value] under the preview mode. The larger the Value, the larger the radius of the sphere.

4. Set title

Enter the title text: “ Gross Profit"

5. Set the legend

1) Manually set 3 sections, with the theme color being yellow

2) Set [Format] of the legend as [Number] in a specific format of #0.00. The orientation of the legend is set as “horizontal”, which is displayed in the bottom middle of the chart.

6. Set the Series

1) The point shape includes Circle, Rectangle, Triangle, Diamond, Drop and Arrow.

Rectangle:

Triangle:

Diamond:

Drop:

Arrow:

2) You can set the maximum and minimum radius of the circle. Set the border as 1px and the color as yellow.

3) Final effect of the series

7. Set the overlay effect of points

The overlay effect is set as [Highlight], that is, the overlaid points will be highlighted. If the overlay effect is set as [Normal], the spheres in front will block those behind.

8. Set the color of the elected points

The color is set as dark red by default.

9. Set the style of globe

The Light is set as yellow, with the intensity being 3. Others can adopt the default settings.

10. Set BG style

Select [BG] tab to select: No Background, Color, Gradient Color or Image. By default, a built-in star image is used as the background

11. Set the Tooltip

You can save the default settings.

12. Final effect

1) The globe rotates automatically.

2) The color of the points selected turn to dark red, and a prompt box will pop up.

Download template

3D Scatter on Globe.cpt 

1. Add a 3D Line on globe

1) Click [Floating Element] > [Chart], and select [Extended Chart-Globe] > [3D Line on globe].

2) Adjust the size of the chart.

2. Prepare data

You can directly use the built-in data in the template provided at the end of this section. The data shows the volume of exports to different regions.

3. Set the “Data” for the chart

1) Set the “Data” for the chart as shown in the figure below.

2) The arc on the globe surface reflects the size of the [Value] under the preview mode.

4. Set title

1) Enter the title text: “ Export Volume"

2) Effect of Title

5. Set the legend

1) Custom 3 sections, with the theme color being blue by default. Set [Format] of the Legend as [Number] in a specific format of #0.00.

2) The orientation of the legend is set as “horizontal”, which is displayed in the bottom middle of the chart.

6. Set the Series

1) You can set the width of the arc to 5, making the arc more obvious. The opacity of the arc is set as 10 by default.

2) Effect of arc after modification

7. Set the overlay effect of points

The overlay effect is set as [Highlight], that is, the overlaid points will be highlighted. If the overlay effect is set as [Normal], the arcs in front will block those behind.

8. Set the trail effect

1) The trail effect is set as “on” by default, and the dynamic effect period is 4. You can customize the width, opacity and color of the trails.

2) Effect of trails after modification

9. Set the style of globe

The Light is set as yellow, with the intensity being 3. Others can adopt the default settings.

10. Set BG style

Select [BG] tab to select: No Background, Color, Gradient Color or Image. By default, a built-in star image is used as the background

11. Final effect

Download template

3D Line on Globe.cpt