radar-chart-for-double-11

Chart style

The Double 11 radar chart is a basic chart type that only supports data display in a single dimension. It is suitable for displaying the quantity of products sold in each region during the Double 11 period, such as North China and East China.

Style Panel

• Search Configuration: Click the Search configuration items icon in the upper-right corner of the Style panel. In the Search Configuration panel, enter the name of the configuration items that you want to search for and locate the configuration items. Fuzzy match is supported. For more information, see Search configuration items.

  • Size: the width and height of the widget. Unit: pixels.

  • Positioning: the x-axis and y-axis of the component. Unit: pixels. X-coordinate indicates the pixel distance between the upper-left corner of the widget and the left border of the canvas. Y-coordinate indicates the pixel distance between the upper-left corner of the widget and the upper border of the canvas.

  • Rotate: Rotate the widget by degrees.

    • Directly enter the degrees in the Rotation Angle spin box or click the plus sign (+) or minus sign (-) to increase or decrease the value in the Rotation Angle spin box.

    • Click the icon to flip the widget style.

    • Click the icon to flip the widget style.

  • Opacity: Valid values: 0 to 1. If this parameter is set to 0, the widget is hidden. If this parameter is set to 1, the widget is completely displayed. Default value: 1.

• Global level

  Top Offset: the distance between the radar chart and the top of the widget.

• Outer Style

  Parameter	Description
  Edge Color	The color of the outer edge. For more information, see color picker description.
  Edge line width	The width of the outer edge.

• Radar area

  Parameter	Description
  Preset Max Capacity	The maximum preset value for the radar area. A larger preset maximum value results in a smaller radar area proportion when it exceeds the maximum data value.
  Color	The gradient color of the radar chart. Click the or icon to add or delete a color area. Click the or icon to configure the arrangement of multiple color series. Click the icon to copy the current color series configuration and add a new series with the same settings. Position: the position of each color in the gradient band. Color: the color of each location.
  Edge line width	The width of the region edge. Unit: pixels.
  Edge Style	The style of the region edge. Valid values: Curve and Line.
  Curve Radian	The radian of the curve edge, ranging from 0 to 1. When the value is 1, the edge becomes a straight line.

• Text boxes and lines

  Parameter	Description
  Distance from Text Box to Line	The vertical distance between the text box and the line. Unit: pixels.
  Font	The font of text in the widget. Default value: Microsoft YaHei.
  The color of the font. For more information, see Color setting parameters.	The font color of all text in the component.
  Font size	The font size of all text in the component.
  Font weight	The font weight of all text in the widget.
  Line Color	The color of the line.
  Connection Width	The width of the line. Unit: pixels.

• Sweep: the style of the sweep effect. You can click the icon to enable or disable the sweep effect.

  • Image: the image used for the sweep effect. Enter the URL of the image.

  • Animation Duration: the duration of the sweep animation. Unit: seconds.

Data Sources panel

Advanced Panel

This widget does not support interaction events.

Blueprint Interaction

1. Click the icon in the upper-left corner to go to the Blueprint page.

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

3. View blueprint configuration parameters.

   • Event

     Event	Description
     When the data interface request is completed	Triggered with the processed JSON data after a data interface request is responded to and processed by a filter. For data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.

   • Action

     Action	Description
     Import data	Imports processed data into the widget for redrawing without requesting server data again. For data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.
     Request Data Interface	Requests server data again, using the data from an upstream data processing node or layer node as a parameter. For example, if the API data source is https://api.test and the data passed to the request data interface is { id: '1'}, the final request interface is https://api.test?id=1.
     Move	Move a widget to a specified location. For more information, see the data example. { // The positioning type. to indicates absolute positioning, whereas by indicates relative positioning. The default value is to. "positionType": "to", // The location, which is indicated by the x and y coordinates. "attr": { "x": 0, "y": 0 }, // The animation type. "animation": { "enable": false, // The animation delay. Unit: milliseconds. "animationDuration": 1000, // The animation curve, which can be set to linear|easeInOutQuad|easeInOutExpo. "animationEasing": "linear" } }
     Switch Display /Display	Toggles whether the widget is displayed or hidden. No parameters are required.
     Display	Display the widget. For more information, see Data example. { "animationType": "",// The animation method. Valid value: fade. If you do not set this parameter, no animation is available. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     Hide	Hide the component. For more information, see Data example. { "animationType": "",// The animation method. Valid value: fade. If you do not set this parameter, no animation is available. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }
     Update component configurations	Dynamically updates widget style configurations. In the Style panel, click Copy Configuration to Clipboard to obtain the configuration data, then modify the style field for the data processing node in Blueprint Editor.