| Prop | Type | Required | Example | Value Range | Description |
|---|---|---|---|---|---|
| chartType | string | true | - | - | The type of chart to display (e.g., bar, line, pie). |
| chartWidth | number | true | - | - | The width of the chart canvas, in pixels. |
| chartHeight | number | true | - | - | The height of the chart canvas, in pixels. |
| bgColor | string | false | - | - | The background color of the chart, in hex format. |
| bgAlpha | number | false | - | 0 - 1 | The transparency level of the chart background. 1 represents full opacity, and 0 represents full transparency. |
| showAxis | boolean | false | - | - | Whether to display the chart axes. |
| axisColor | string | false | - | - | The color of the chart axes, in hex format. |
| axisWidth | number | false | - | - | The width of the chart axes, in pixels. |
| showGrid | boolean | false | - | - | Whether to display the chart grid. |
| gridColor | string | false | - | - | The color of the chart grid, in hex format. |
| gridAlpha | number | false | - | 0 - 1 | The transparency level of the chart grid. 1 represents full opacity, and 0 represents full transparency. |
| showLabels | boolean | false | - | - | Whether to display chart labels. |
| dataSet | array | false | - | - | An array of data objects used to render the chart. |
Note: The
chartTypedetermines the visualization style, whiledataSetcontains the data to be displayed in the chart.
1{
2 "id": "chart-element-id",
3 "type": "Chart",
4 "start": 0,
5 "duration": 10,
6 "trackIndex": 0,
7 "x": 100,
8 "y": 100,
9 "chartType": "bar",
10 "chartWidth": 800,
11 "chartHeight": 600,
12 "bgColor": "#ffffff",
13 "bgAlpha": 1,
14 "showAxis": true,
15 "axisColor": "#000000",
16 "axisWidth": 2,
17 "showGrid": true,
18 "gridColor": "#cccccc",
19 "gridAlpha": 0.5,
20 "showLabels": true,
21 "dataSet": [
22 { "label": "A", "value": 10 },
23 { "label": "B", "value": 20 },
24 { "label": "C", "value": 15 }
25 ]
26}
27