What is the meaning of each configuration items when the pie chart is fully selected? - DataV

This topic describes the meaning of each configuration items when you select all data in a pie chart.

Chart style

A pie chart divides a pie into multiple blocks based on the proportion of categories. The entire pie represents the total amount of data. Pie charts are widely used in various fields to indicate the proportions of different categories. You can compare the proportions of different categories based on the radian size to help you quickly understand the proportions of data.

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: The widget is rotated around the center of the widget. Unit: 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.

Graphics

Metric	description
Chart Margins	Click the icon to control the display of the chart margins. If you turn on the switch, you can configure the distance between the pie chart area and the four boundaries of the widget. Unit: px by default.
Pie Chart Radius	The radius of the pie chart, including the inner diameter and outer diameter, in %.
Pie Chart Color	For more information about the color of the pie chart, see Use the color mapper.
Pie Stroke	The stroke style of the pie chart, including the type, weight value, and color of the stroke line. Note When the line type is selected as dotted line or dotted line, the value of the break length of the line and the distance between each break line can also be configured.
Pie Chart Glow	The lighting style of the pie chart. Click the icon to control the display of the lighting configuration items of the pie chart. Emitting Color: Includes following sector switch and opacity. When the switch following sector is turned off, the luminous color can be set separately. Blur Coefficient: the blur coefficient of the pie chart. The value ranges from 0 to 50. The larger the value, the more blurred the glow range between pie charts.
Decimal Merge	Limits the number of slices to be displayed and merges the remaining slices into a total slice. You can also set the name of the merged category. Click the icon to turn decimal consolidation on or off.
Center Content	The text content in the center of the pie chart. This field is displayed only when the inside diameter of the pie chart radius is greater than 0. Click the icon to turn central content on or off. Area Type: Set the type of the central content area, including text type and graphic type. Title: the title of the content. Title Text: Specify the font style, weight, font size, and color of the title text. Title Offset: specifies the offset of the content in the horizontal and vertical directions. Unit: pixels. Value Format: Specify the value format of the content in the center. You can select Default, 11 (integer), 11.1 (floating point), 11.11 (floating point), 11%(percentage), 11.1%(percentage), 1,111 (thousands separator), and 1,111.1 (thousands separator). For more data display formats, see Data display formats. Content Prefix and Suffix: the prefix and suffix of the content. Content Text: Specify the font style, weight, font size, and color of the content in the center. Content Offset: the horizontal and vertical offset of the content in the center. Unit: pixels. Image Link: the image link of the central content. This parameter is displayed when you set the Area Type parameter to Graphic Type. Image Style: Set the width, height, transparency, and rounded corners of the image in the center. The image is displayed when the area type is set to Graphic Type. Offset: Set the horizontal /vertical position and horizontal /vertical offset of the center content image. This parameter is displayed when the area type is set to Graphic Type.
Pie Chart Label	The label style of the pie chart. Click the icon to control the display of the pie chart label configuration items. Label Format: the format of the label content. Format: Select Default or Percentage. Label Field: the position of the label field. Valid values: Inside, Outside, and Spider. data format: specifies the numeric format of the tag. Valid values: Default, 11 (integer), 11.1 (floating point), 11.11 (floating point), 11%(percentage), 11.1%(percentage), 1,111 (thousands separator), and 1,111.1 (thousands separator). For more data display formats, see Data display format description. This parameter is displayed only when you set the Default Value parameter for the Label field. Pre-Suffix: the prefix and suffix of the pie chart tag. Tag Leader: the leader style of the pie chart tag. Click the icon to control the display of the pie chart tag leader configuration items. Threshold: the thickness of the leader. This parameter is available only when you select Spider or Outside for the Label Field parameter. Length: the length of the leader. Unit: pixels. This parameter is available only when you select Spider for the Tag field. Text Style: the text style of the pie chart label, including the font style, weight, font size, and color of the text. Text Stroke: the stroke style of the pie chart label, including the thickness and color of the stroke line.
Map	The map style of the sector area. Click the icon to control the visualization of the map configuration items. Note The background of the map does not support gradient color. Type: the type of the sticker. Valid values: Point, Line, Square, and Image. Fill Style: the fill style of the texture map. See the color picker instructions to configure the color style of the map. Stroke Style: Specify the stroke style of the map. See the color picker instructions to configure the color style of the map. This parameter is displayed when you set Type to Dot or Square. Extra Style: Other styles of the map, including Graphics Size, Graphics Spacing, Line Spacing, Rotation Angle, and Interlace. If you set Type to Image, you can set the Image Address, Tile Width, Tile Height, Tile Spacing, and Rotation Angle parameters.

Animation: the animation effect style of the pie chart.

Metric	description
Animation Switch	Turn on the switch to configure the animation effect of the pie chart.
Animation	The type of the animation. The system provides multiple common animation effects, including Horizontal Growth, Vertical Growth, Moving, Zooming, and Fanting. You can configure these effects only after you turn on the switch.
Animation Duration	The duration of the widget animation effect. Unit: ms. This value is configurable only after you turn on the Animation switch.

Interactive: the interactive style of the pie chart widget.

Carousel: After you enable the carousel feature, the dialog box settings are applied and the dialog box is no longer triggered by interactions. Click the icon to display or hide the carousel effect.
Center Text Interaction: This parameter is displayed only when the inner radius of the graphics module is greater than 0. If you turn on the switch, the center text interaction takes effect. If you turn off the switch, the center text interaction does not take effect.
Note
When the center text interaction takes effect, the dialog box becomes invalid.

dialog box: The style of the dialog box that appears when you move the pointer over or click a fan on the preview or publish page. Click 开关图标 the icon to turn the dialog box on or off.

Metric	description
Mode	dialog box selection modes, optional, include concise and universal.
Trigger	The method by which the dialog box is triggered. You can select Hover or Click.
Display Position	The position style of the dialog box display. Validation values: Top, Bottom, Left, and Right.
Title Spacing	The spacing between titles in the dialog box. Unit: px.
Title Text	The style of the title text in the dialog box, including the font style, weight, font size, and color.
Content Display	Click the or icon on the right to add or delete a dialog box content series. Click the or icon to configure the arrangement style of multiple dialog box content display series. Click the icon to copy the current dialog box content display series configuration and add a dialog box content display series with the same configuration. Field Name: the name of the field in the dialog box content. The name must match the field in the data panel. Display Name: the display name of the dialog box content. Suffix: the suffix of the dialog box content.
Content Spacing	The spacing between the text of the dialog box content. Unit: px.
Content Text	The style of the content text in the dialog box, including the font style, text weight, font size, and color.
Frame Background	dialog box the background style of the bullet box. Background Margin: dialog box the horizontal and vertical margins of the pop-up background. Background Color: The background color of the dialog box. Border Style: dialog box the style of the border, including the border line type, rounded corner size, line width size, and border line color.
Axis indicator	The style of the dialog box axis indicator line, including the axis indicator line type, thickness value, and axis indicator line color. Note When the line type is selected as dotted line or dotted line, the value of the break length of the line and the distance between each break line can also be configured.

Selected State: the selected state of the pie chart. You can click the 开关图标 icon to enable or disable the selected state.

Metric	description
Trigger	The trigger mode of the sector in the pie chart. Valid values: Hover and Click.
Select Method	The method that you want to use to select a sector in the pie chart. You can select Single Select or Multiple Select.
Fan Color	The color of the selected sector.
Fan Stroke	The style of the stroke line in the sector, including the type, thickness, and color of the stroke line. Note When the line type is selected as dotted line or dotted line, the value of the break length of the line and the distance between each break line can also be configured.

Legend: the legend style of the pie chart.

Metric	description
Legend Switch	If you turn on the switch, you can configure the legend style. If you turn off the switch, you cannot configure the legend style.
Legend Position	The position of the legend relative to the start coordinates of the widget. Valves include Top Left, Top Center, Top Right, Bottom Left, Bottom Center, Bottom Right, Left Top, Left Center, Left Bottom, Right Top, Right Center, and Right Bottom.
Text Style	The font style, text weight, font size, and color of the legend text.
Category Legend	The style of the sub-type legend. The legend is displayed as a category legend only when the Pie Chart Color Mapping Type parameter is set to Noun Category in the Component Style panel. Legend Marker: the size and shape of the legend marker. Legend Spacing: the horizontal and vertical distance between the legends of different categories. Maximum Width: the maximum width of the legend. Unit: pixels. Page Flip Allowed: If you turn on the switch, the page number style and arrow style of the legend are enabled. If you turn off the switch, the legend content is displayed on one page and cannot be flipped. Maximum Rows: the maximum number of rows that can be turned. Unit: rows. Style: the style of the page number, including the font, weight, font size, and color of the page number. Arrow Style: the size, default color, and disabled color of the arrows in the page-turning style.
Continuous Legend	The style of the continuous legend. The legend is displayed as the Continuous Legend only when you set the Pie Chart Color Mapping Type parameter to Numeric Continuous or Numeric Partition in the Component Style panel. Rail Style Type: the type of the sliding track. Valid values: Rectangle and Triangle. Length: the length of the legend slide. Height: the height of the sliding track in the legend. Background Color: the background color of the legend track. Slider Style: the style of the slider on the slide track in the legend. Minimum Value: the minimum value of the slider. You can specify a custom value. You can also select Auto to obtain the minimum value. Maximum Value: the maximum value of the slider. You can specify a custom value. You can also select Automatic to obtain the maximum value. Size: the size of the slider. Color: the color of the slider. Dimension Style: the style of text dimensions on the legend. Alignment: the alignment of legend text dimensions relative to the slide track, including Top Alignment, Center, and Bottom. Spacing: the distance between the legend text dimension and the slide.

Fan Style: Click the or icon to add or remove a conditional style. Click the or icon to configure the arrangement style of multiple conditional styles. Click the icon to copy the selected data series and add a conditional style. For more information about how to configure conditional styles in each series, see Use conditional trees.
- Fan Color: If you turn on the switch, you cannot configure the color of the sector in the pie chart. If you turn off the switch, you cannot configure the color of the sector in the pie chart.
- Text Labeling: the style of text labeling under the current conditions.
  - Text Content: specifies the text annotation content.
  - Offset: the horizontal and vertical offsets of the text annotation. Unit: pixels.
  - Orientation: the orientation of the text annotation relative to the text annotation point, including top, right, bottom, and left.
  - Text Background: specifies the background of the text annotation, including the color of the background and the radius of the rounded corners.
  - Text Style: the text style of the text content.
  - Text Line: specifies the line style of the text annotation, including the line type, color, weight, and length.
  - Text Label Point: Set the Fill Color and Radius of the text label point.
    Note
    The stroke style is the same as the line style.

Data Sources panel

Column	Description
`type`	The category of each arc block in the pie chart.
`value`	The value of each arc block in the pie chart.
`colorField`	Optional. The Color Mapping field is used to set the mapping configuration style of each color of the arc block.

Configure data items	Description
Data sources	You can use the code editor or visual editor to view the data fields contained in the widget. You can also modify the data type to flexibly configure the component data.
Data Mapping	If you need to customize chart field configurations, you can set different field mapping content in the Data Mapping module and field mapping these content to the corresponding fields of the widget. This allows you to match data without modifying the fields in the data source. You can also click the icon to configure the field style.
Configure a filter	Turn on Filter, select an existing data filter or create a data filter, and configure a data filter script to filter data. For more information, see Manage data filters.
Data Response Result	The Data Response Result section displays widget data in real time. If the data source of the widget changes, this section displays the latest data. If the system response is delayed, you can click the icon on the right to view the data response result. You can also click the icon on the right to obtain the latest data of the widget. You can also click View Example to view an example of the response result of the current component.
Forbid Loading	If you select the check box, you will not see the loaded content during component initialization when you update the component and preview the data kanban. If you select the check box, the opposite is true. By default, the status is deselected.
Controlled Mode	If you select the check box, the component does not request data in the initialized state, and only requests data by using global variables or the method configured in Blueprint Editor. If you clear the check box, you can use automatic update to request data. By default, the status is deselected.
Auto Data Request	Select the check box to manually enter the time frequency of polling to set dynamic polling. If you clear the page, the page is not automatically updated. You need to manually refresh the page or use Blueprint Editor and global variable events to trigger a request to update data.

Advanced Panel

Interaction	Description
When a data item changes	Turn on the switch to enable the widget interaction feature. When a data item changes, a temporary variable is thrown, and the `type` and `value` fields in the data are thrown by default. For more information, see Component interaction configuration.
When the legend is clicked	Turn on the switch to enable the widget interaction feature. A temporary variable is thrown when a legend is clicked. By default, the `value` and `checked` fields in the data are thrown. For more information, see Component interaction configuration.

Blueprint Interaction

Click the icon in the upper-left corner to go to the Blueprint page.
On the Layer Nodes tab, add the widget to the main canvas.

View blueprint configuration parameters.

Event

Event	Description
When the pie chart interface request is completed	The event is triggered with the processed JSON data after a data interface request is responded and processed by a filter. For more information about specific data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.
When a data item changes	The event that is thrown when the data of the arc block of the pie chart changes, and the data item corresponding to the arc block is thrown at the same time.
When the legend is clicked	The event that is raised when the legend of the pie chart is clicked, and the data item corresponding to the arc block is also raised.

Action

Action	Description
Import a pie chart	After data of a widget is processed in accordance with its drawing format, the widget is imported for redrawing. You do not need to request server data again. For more information about specific data examples, see the Data Response Result section of the Data Source tab in the right-side configuration panel of the canvas editor.
Request pie chart operation	This action is performed to request the server data again. The data sent by an upstream data processing node or layer node is used as a parameter. For example, if the API data source is `https://api.test` and the data passed to the Request Pie Chart API action is `{ id: '1'}`, the final request interface is `https://api.test?id=1`.
Highlight	data: the data item to be highlighted. Single highlight `{ type: 'Category 1 ', value: 12 }` Bulk Highlight `[ { type: 'Category 1 ', value: 12 }, { type: 'Category 2 ', value: 22 } ]` style: Select a style. such as fillStyle, stroke, and opacity. If you do not specify the highlight style, the default style is used. Reference data example `{ "data": {}, "style": {} }`
Reset selections	Clear the selection item data of the reset component. No parameters are required.
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 /Hash	Specifies whether to show or hide a widget. 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 specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }`
Hide	Display the widget. For more information, see Data example. `{ "animationType": "",// The animation method. Valid value: fade. If you do not specify this parameter, no animation is generated. "animationDuration": 1000,// The animation delay. Unit: ms. "animationEasing": ""// animation curve }`
Update component configurations	Style configurations of widgets are dynamically updated. In the Style panel, click Copy Configuration to Clipboard to obtain the configuration data of the widget. After that, change the style field for the data processing node in Blueprint Editor.