Components
charts
pie-chart
5min
the component can be used to display statistics related to data records mostly used in jig default docid\ rtomyji3uoxiqxdultz3o or jig list docid 5uifnxycbeewhizctnjqm pie chart preview we are currently experiencing issues with the legend of the pie chart component we are working hard to fix this issue configuration options configuration options some properties are common to all components, see common component properties docid\ llntd rxe8fmh7wpc5czb for a list and their configuration options core structure chart title its text and verticalalign series data values to be used in the chart layout pie or arch the availabe types of chart other options chart title and subtitle name and a short description of your chart height and width the parameters of the chart displayed (in pixels) legend ishidden the setting of a boolean value if the legend (naming of the series) should be displayed under the chart series name the naming of the actual series color select a color from the color palette actions onpress the ability to add any of the actions (please refer to the list of actions) this action(s) will be triggered as a reaction to the press event examples and code snippets examples and code snippets pie chart pie chart this jig displays a complete pie chart in this example, these are issues where green shows resolved issues, yellow issues in progress, and red unresolved issues examples see the full code sample using static data in github see the full code sample using dynamic data in github datasources see the full datasource code sample for dynamic data in github pie chart (static) children \ type component pie chart options chart title text issues verticalalign center width 180 height 180 legend ishidden true series \ data =\[{"y" 1, "color" "color4"}, {"y" 2, "color" "color2"}, {"y" 3, "color" "color3"}] datalabels \ isenabled true layout pie pie chart (dynamic) children \ type component pie chart options chart title text issues verticalalign center width 180 height 180 legend ishidden true series \ data =@ctx datasources pie chart dynamic datalabels \ isenabled true layout pie datasources (dynamic) datasources pie chart dynamic type datasource sqlite options provider data provider dynamic entities \ entity default/charts query | select id, json extract(data, '$ seriesy') as y, '$ color', '$ category', json extract(data, '$ seriesx') as x, '$ subtitle', '$ title' from \[default/charts] where '$ category' = "pie chart" pie chart type arch pie chart arch this jig displays an arc pie chart this example shows the occupancy in a warehouse; the green color shows available space and the red color indicates occupied space examples see the full code sample using static data in github see the full code sample using dynamic data in github datasources see the full datasource code sample for dynamic data in github arch chart (static) children \ type component pie chart options chart title text stock verticalalign center width 180 height 180 legend ishidden true series \ data =\[{"y" 1, "color" "color4"}, {"y" 2, "color" "color2"}] datalabels \ isenabled true layout arch arch chart (dynamic) title arch pie chart type jig default children \ type component pie chart options chart title text stock verticalalign center width 180 height 180 legend ishidden true series \ data =@ctx datasources pie arch chart dynamic datalabels \ isenabled true layout arch datasources (dynamic) datasources pie arch chart dynamic type datasource sqlite options provider data provider dynamic entities \ entity default/charts query | select id, json extract(data, '$ seriesy') as y, '$ color', '$ category', json extract(data, '$ seriesx') as x, '$ subtitle', '$ title' from \[default/charts] where '$ category' = "arch chart"