developer guide
Anomaly Detection in a JavaScript Data Grid
The grid marks the rows that stand apart from the rest of their column, says how many there are, and filters to them in one click. The flag is an ordinary column, so it sorts, groups and totals like any other.
Developer guide › Statistics and capability › Anomaly Detection in a JavaScript Data Grid
Anomaly summary chip
Give a column an anomalyFlag shadow () and turn on
anomalySummary, and the grid shows a small chip reading how many rows that column
flags. Click it to filter the grid to exactly those rows; click again to clear.
One shadow column, counted and filtered on a click
createGrid(element, {
columns: [
{ field: 'reading', title: 'Reading', type: 'number' },
{ field: 'outlier', title: 'Anomaly', shadow: { kind: 'anomalyFlag', of: 'reading', threshold: 3.5 } },
],
rows,
anomalySummary: true, // or { column: 'reading', label: '…' }
});The count and the filter are the same question. The chip is not a second
detector: it reads the anomalyFlag shadow column, so the number it shows is the
number of rows that column marks, and the click sets a filter on that same column
({ col, op: 'eq', value: true }). The count comes from
grid.statistics.anomalies() over the shadow's base column, so the chip adds no
detection of its own - the score is the API's, shown with its method, never an opaque verdict.
Off by default, and it draws nothing unless a column carries an anomalyFlag
shadow. When more than one does, column names the base to summarise.
Headings without the controls
A dense grid often wants the heading and nothing else. showColumnFunctions: false
leaves each heading as its label, with no sort, filter or menu control, they are not drawn
rather than hidden, so the label has the whole cell. Sorting, filtering and the column menu
stay reachable through the API, the keyboard and the tool panel; only the furniture goes. The
resize grip stays, since dragging a column wider is a view adjustment rather than a function
of the column.