@@ -44,16 +44,16 @@ Since API version 9, this API is supported in ArkTS widgets.
In addition to the [universal attributes](ts-universal-attributes-size.md), the following attributes are supported.
| Name | Type| Mandatory| Description|
| ------------- | ------- | ---- | -------- |
| closeEffect | boolean | Yes| Whether to disable the rotation and shadow effects for the component.<br>Default value: **false**<br>**NOTE**<br> This attribute enables or disables the shadow effect only when **trackShadow** is not set.<br> The shadow effect enabled through this attribute is in the default style.|
| valueColors<sup>10+</sup> | Array<[ResourceColor](ts-types.md#resourcecolor)\|[LinearGradient](#lineargradient10)> | Yes| Array of data segment colors. A value of the **ResourceColor** type indicates a solid color, and A value of the **LinearGradient** type indicates a color gradient.|
| trackBackgroundColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | Yes| Background color.<br>The value is in hexadecimal ARGB notation. The first two digits indicate opacity.<br>Default value: **'#08182431'**|
| strokeWidth<sup>10+</sup> | [Length](ts-types.md#Length) | Yes| Stroke width of the border.<br>Default value: **24**<br>Unit: vp<br>**NOTE**<br>A value less than 0 evaluates to the default value.<br>This attribute does not take effect when the data panel type is **DataPanelType.Line**.|
| trackShadow<sup>10+</sup> | [DataPanelShadowOption](#datapanelshadowoption10) | Yes| Shadow style.<br>**NOTE**<br>If this attribute is set to **null**, the shadow effect is disabled.|
| Name | Type| Description|
| ------------- | ------- | -------- |
| closeEffect | boolean | Whether to disable the rotation and shadow effects for the component.<br>Default value: **false**<br>**NOTE**<br> This attribute enables or disables the shadow effect only when **trackShadow** is not set.<br> The shadow effect enabled through this attribute is in the default style.|
| valueColors<sup>10+</sup> | Array<[ResourceColor](ts-types.md#resourcecolor)\|[LinearGradient](#lineargradient10)> | Array of data segment colors. A value of the **ResourceColor** type indicates a solid color, and A value of the **LinearGradient** type indicates a color gradient.|
| trackBackgroundColor<sup>10+</sup> | [ResourceColor](ts-types.md#resourcecolor) | Background color.<br>The value is in hexadecimal ARGB notation. The first two digits indicate opacity.<br>Default value: **'#08182431'**|
| strokeWidth<sup>10+</sup> | [Length](ts-types.md#Length) | Stroke width of the border.<br>Default value: **24**<br>Unit: vp<br>**NOTE**<br>A value less than 0 evaluates to the default value.<br>This attribute does not take effect when the data panel type is **DataPanelType.Line**.|
| trackShadow<sup>10+</sup> | [DataPanelShadowOptions](#datapanelshadowoptions10)| Shadow style.<br>**NOTE**<br>If this attribute is set to **null**, the shadow effect is disabled.|
## DataPanelShadowOption<sup>10+</sup>
## DataPanelShadowOptions<sup>10+</sup>
| Name | Type| Mandatory| Description|
| ------------- | ------- | ---- | -------- |
| radius | number \|[Resource](ts-types.md#resource)| No| Shadow blur radius.<br>Default value: **5**<br>Unit: vp<br>**NOTE**<br>A value less than or equal to 0 evaluates to the default value.|
Among all the [universal events](ts-universal-attributes-size.md), only **width**, **height**, and **size** are supported.
The [universal attribute](ts-universal-attributes-size.md) methods can be used to set the size, background, and border.
| Name| Type| Description|
| -------- | -------- | -------- |
| verticalAlign | [ImageSpanAlignment](#imagespanalignment) | Alignment mode of the image with the text.|
| verticalAlign | [ImageSpanAlignment](#imagespanalignment) | Alignment mode of the image with the text.<br>Default value: **ImageSpanAlignment.BOTTOM**|