Radar Chart

  • Last update:December 18, 2020
  • I. Overview

    1) Radar charts are also known as spider diagrams which map multi-dimension data to coordinate axes with the same center.

    2) Radar charts are applicable to the comparison of different records in multiple dimensions, or the comparison of them with standard values, e.g., competitor analysis. However, a radar chart contains a limited number of polygons, so it is not applicable to the comparison in too many dimensions. Additionally, radar charts cannot display specific values directly.

    3) Please read: Chart DataChart Style, Chart Special Effects.

    You will learn
    • Data preparation

    • Select and insert a chart

    • Data binding

    • Set styles

      • General styles

      • Series

      • Polar angle axis

      • Polar axis

    • Set special effects

    • Preview

    II. Steps

    1. Data preparation

    1) Create a new common report and a new dataset ds1

    JWX7earJKnvuyQGS__original.png

    2) Use the default data connection FRDemo. Input the following data query statement:

    SELECT * FROM Product join ProductCategory on
    Product.CategoryID=ProductCategory.CategoryID 
    where ProductCategory.Category_name!="Daily necessities"
    /*Here exclude daily necessities because it contains abnormal value*/

    vDWIUufdwkTBjjQi__original.png


    2. Select and insert a chart

    1) Here, we take floating charts for example. Please refer to Insert Floating Charts, select [Radar Chart].

    ADAbEiWf6ZlLzfde__original.png

    2) You can choose from two types of radar charts:

    • [Radar Chart]: compare different dimensions by polygon areas and axis coordinates, and display the overall situation of an enterprise, strengths and weaknesses of a project, or display individual capabilities.

    • [Stacked Column Radar Chart]: compare different dimensions by heights of sectors in different colors; moreover, the height of the total sector can reflect the sum of the corresponding dimension. Stacked column radar chart is especially suitable to observe the sum of each dimension and the proportion of each series of values.

    3) Here, we take radar chars for example. Click [Radar Chart] and then [OK].

    4) Stretch the floating chart to appropriate length and width.

    1juUCmwSPLslNKzS.gif


    3. Data binding

    1) Click the floating chart and then [Data] in the right-hand pane to enter the data binding interface.

    UYW3U16Jk4dXVZbj.gif

    2) [Data Source]: select [Dataset Data], [Dataset]: select [ds1] as the source of chart data.

    QaSzhZMjZteDTXKu__original.png

    3) [Category]: select the dataset field [Category_name] as chart category. [Category] is used to group data. Each category serves as a dimension of the radar chart. Here, product [Category_name] (e.g., beverages, desserts, etc.) will be displayed as dimension labels on polar axes of the radar chart.

    4) [Series]: select [Enable Field Name], add [Inventory_quantity], [Order_quantity] and [Re_order_quantity] to [Field Name], select [Sum] as the summary method for all of the three.

    • [Series] represents the meaning of different data in each dimension, and each series and its color are displayed in the legend. Here, inventory quantity, order quantity and re-order quantity, as series, are displayed as areas in different colors in the radar chart.

    • In [Series Name], you can modify series names manually. [Summary Method] options include none, average, maximum, count, etc.; if [Sum] is selected, series values in the same category will be added up and the sums will be displayed in the chart.

    5) Save the chart and click [Preview]. The current radar chart with all data set is displayed below.

    pfoxvBCZIfcvODue__original.png


    4. Set styles

    1) Click [Style] in the right-hand pane to enter the style editing interface. Despite various types of charts, most style settings are common. For settings, please refer to Chart Style.

    2) Here we will simply introduce how to set the title of a chart. Click the [Title] tab and input chart title [Product Category Radar] at [Content]>[Text]. The title will be displayed on the top of the chart.

    DBFMuQgo1sNSJvA4__original.png


    5. Set series styles

    1) Click the [Style]>[Series] tab in the right-hand pane to enter the series style editing interface. Here we will introduce the differences of radar series styles from general styles.

    2jWM6QOj5CY2GnbD__original.png

    2) Color: you may change the color scheme of a radar chart. There are in-built predefined color schemes and custom ones.

    • [Predefined Color]: choose different predefined color schemes and you can see variations in the left-hand chart preview area.

    • [Custom Combination Color]: you can customize a color combination.

    • [Custom Gradient Color]: you can display different series by colors on the gradient color.

    sX4p5La6jwJqDczq.gif

    3) Display:

    • [Shape]: you can change the contour of a radar chart. Options include circle and polygon.

    fs7sQbwNqySznDrH.gif

    4) Line:

    • [Line Style] and [Line Width]: you can choose a border line and its thickness for a radar chart.

    • [Null Value Disconnection]: if you choose [On], when there is no data in a certain category, then the contour of the chart will be disconnected at that point; if you choose [Off], the two data points nearest to the disconnection will be connected seamlessly.

    KXHhlw5GnGflZBOK.gif

    5) Marker point:

    • [Point Style]: you can choose either rule or custom. In the former case, you can set type, fill color, radius and so on; in the latter case, you can upload an image.

    • [Type]: there are nine types of data points on a radar chart.

    • [Fill Color]: the fill color of data points on the radar chart, and options include series color and custom color.

    • [Radius]: it controls the size of a data point on the radar chart, with an increase or decrease of 0.5 for each click.

    orAicvnM2XhlCqn2.gif

    6) Area:

    • [Fill Color]: the fill color of data areas on a radar chart. Options include series color and custom color.

    • [Opacity]: you can set the transparency of data areas on the radar chart, which ranges from 0~100%.

    u607OKwjG4YafYwF.gif


    6. Set polar angle axis styles

    1) Click the [Style]>[Axis]>[Polar Angle Axis] tab in the right-hand pane to enter the polar angle axis style editing interface. Polar angle axis refers to the outermost circular or polygonal circumference in a radar chart and represents different data dimensions. This is different from general styles and will be introduced separately here.

    AkJj05khckvIUQoI__original.png

    2) Label:

    • [Axis Label]: it controls whether to display or hide polar angle axis category values.

    • [Character]: you can set label font, size, color, tilt and bold font.

    • [Rotation]: it controls the rotation direction of axis labels, which ranges from -90 to 90.

    • [Interval]: it can be set as either an automatic value or a fixed value.

    PQRP5cOIKBJw5vMq.gif

    3) Axis line style

    • [Type]: you can set the thickness of polar angle axis line.

    • [Color]: you can set the color of polar angle axis, which is by default grey.

    2300CUG2qduIfmRj.gif

    4) Format:

    • [Axis Label Format]: you can set the format of polar angle axis labels to common or custom.

    NMp5HK0YgbwAwbAN.gif


    7. Set polar axis styles

    1) Click [Style]>[Axis]>[Polar Axis] tab in the right-hand pane to enter the polar axis style editing interface. Polar axis refers to lines radiating from the center of a radar chart and represents different scales in different dimensions. This is different from general styles and will be introduced separately here.

    ydwLVkH1eslJE43m__original.png

    2) Label:

    • [Axis Label]: it controls whether to display or hide polar axis category values.

    • [Character]: you can set label font, size, color, tilt and bold font.

    • [Rotation]: it controls the rotation direction of axis labels, which ranges from -90 to 90.

    • [Interval]: it can be set as either an automatic value or a fixed value.

    lw2q2gbO03nGyXGY.gif

    3) Value definition:

    • [Value Definition]: including [Unified Count] and [Specified Separately]. Through [Unified Count], you can set custom minimum value, custom maximum value, custom main unit and custom log base; through [Specified Separately], you can select a dataset, set max value and min value for each category.

    • [Custom Minimum Value]: it controls the minimum length of polar axis. [Custom Maximum Value]: it controls the maximum length of polar axis

    • [Custom Main Unit]: it controls the main scale unit of polar axis, for which a formula can be configured.

    • [Custom Log Base]: it controls changes in the log scale of polar axis, e.g., if you set it to =10, then the axis scale is 1, 10, 100, 1,000, etc.

    mZkHEJSoKHbf9TXV.gif

    4) Axis line style:

    • [Type]: you can set the thickness of polar axis line.

    • [Color]: you can set the color of polar axis line, which is by default grey.

    ha6IE0eW5csLqVEU.gif

    5) Format:

    • [Axis Label Format]: you can set the format of polar axis labels to common or custom.

    vWbFxu4KoMJUeVaU.gif


    8. Set special effects

    For details on how to set special effects for a radar chart, please refer to Chart Special Effects for setting of general special effects.


    9. Preview

    The styled radar chart is shown below. You may choose whether or not to display a series by clicking the legend.

    1607410157346912.gif



    Attachment List


    Theme: Chart
    Already the First
    Already the Last
    • Helpful
    • Not helpful
    • Only read

    滑鼠選中內容,快速回饋問題

    滑鼠選中存在疑惑的內容,即可快速回饋問題,我們將會跟進處理。

    不再提示

    10s後關閉

    Get
    Help
    Online Support
    Professional technical support is provided to quickly help you solve problems.
    Online support is available from 9:00-12:00 and 13:30-17:30 on weekdays.
    Page Feedback
    You can provide suggestions and feedback for the current web page.
    Pre-Sales Consultation
    Business Consultation
    Business: international@fanruan.com
    Support: support@fanruan.com
    Page Feedback
    *Problem Type
    Cannot be empty
    Problem Description
    0/1000
    Cannot be empty

    Submitted successfully

    Network busy