Chart components
Visualize table data on a page with bar, line, pie, and progress charts.
Use chart components on a page to turn table data into a quick visual summary.
Choose the chart type based on the question you want to answer:
Bar chart for comparing values across categories
Line chart for showing changes over time
Pie chart for comparing proportions
Progress chart for tracking progress toward a goal
Before you add a chart component, make sure you have:
A clear question the chart should answer
Numeric values and grouped records to visualize
Fields to filter the records if the chart should show only relevant ones
Add a chart component to a page
Shared chart component settings
In Settings, all chart components share these options:
Label for the title shown on the component
Internal name is filled automatically. Change it only if needed and carefully. When you script, you use Internal name, not Label.
Visibility to show, hide, or conditionally display the component on the page
Use Visibility to choose one of these options:
Visible to show the component on the page
Hidden to hide the component on the page
Conditional to define a Visibility condition that controls when the component is shown or hidden.
This only affects what is shown on the page. It does not change records or permissions.
Chart-specific settings
Bar chart component settings
Under Source, configure the chart data:
Type to choose Bar chart, Line chart, or Pie chart
Table to choose the source table
X-axis to choose how Ninox groups the records
Y-axis to add one or more number data fields with an aggregation, and color. If you do not select a field here, Ninox uses the X-axis field and applies Count as the default aggregation.
Use + Add data set to compare more than one value in the same chart.
Under Display, configure how the chart appears:
Label position to show labels Inside or Outside
Bar orientation to show bars Vertical or Horizontal
Under Behavior, configure how the chart behaves:
Stacked bars to combine data sets into one bar per group
Show title to show or hide the chart Label
Show labels to show or hide labels in the chart
Show legend to show or hide the legend
Show tooltips to show values when users move over chart elements
Show data table to show or hide the chart values in a table below the chart
Line chart component settings
Under Source, configure the chart data:
Type to choose Bar chart, Line chart, or Pie chart
Table to choose the source table
X-axis to choose how Ninox groups the records
Y-axis to add one or more number data fields with an aggregation, and color. If you do not select a field here, Ninox uses the X-axis field and applies Count as the default aggregation.
Use + Add data set to compare more than one value in the same chart.
Under Display, configure how the chart appears:
Label position to show labels Inside or Outside
Under Behavior, configure how the chart behaves:
Smooth lines to connect values with curved lines
Show data points to show or hide markers on the line
Show title to show or hide the chart Label
Show labels to show or hide labels in the chart
Show legend to show or hide the legend
Show tooltips to show values when users move over chart elements
Show data table to show or hide the chart values in a table below the chart
Pie chart component settings
Under Source, configure the chart data:
Type to choose Bar chart, Line chart, or Pie chart
Table to choose the source table
Category to choose one field for how Ninox splits the pie into segments
Data source to choose the field and aggregation for the values. Available aggregations are Sum, Average, Median, Minimum, Maximum, or Count Use None when you do not want to aggregate a field.
Under Display, configure how the chart appears:
Label position to show labels Outside, Inside, or Center
Style to choose Default, Rounded corner, Semicircle, or Pie with pad angle
Under Behavior, configure how the chart behaves:
Donut to show the chart as a donut
Show title to show or hide the chart Label
Show labels to show or hide labels in the chart
Show legend to show or hide the legend
Show tooltips to show values when users move over chart elements
Show data table to show or hide the chart values in a table below the chart
Progress chart component settings
Under Display, configure how the chart appears:
Color to choose a fixed or dynamic color for the progress ring
Under Behavior, configure how the chart behaves:
Total to define the full target value For example:
sum((select invoices where creation_date > today() - 90).gross_total)Value to define the current progress value For example:
sum((select invoices where creation_date > today() - 30).gross_total)
To remove a component from a page, select the component, then click Delete component in the blue menu above it.
Last updated
Was this helpful?