The Reset button clears the report beside the chart you were reviewing. Assign related dc.js charts to a named chart group, then pass that same group to reset and redraw. A page containing two independent reports should not rely on an unqualified global reset.
Use a fictional dispatch report with four records: North quantities six and four, South quantities five and three. A North selection represents two records and ten units; clearing the selection restores four records and eighteen units. Place a second, independent exercise report beside it so an accidental global reset is visible.
Open the complete example · Download the full HTML source
Register related charts together
The dc.js README describes dimensional charts built with Crossfilter and D3. It also states that dc.js version four is compatible with D3 versions four and five. Choose a compatible set instead of mixing whichever browser scripts happen to be newest.
The dc.js API reference documents chart-group registration and the group argument on global operations. With the required libraries and application model already loaded, create the charts with an explicit group:
const reportGroup = 'dispatch-reading';
const regions = new dc.RowChart('#regions', reportGroup);
const quantities = new dc.BarChart('#quantities', reportGroup);
Each chart still needs its own dimension, reduction, and display configuration before rendering. The two constructors establish membership; they are not a complete chart implementation. Give the independent report a different group name and separate Crossfilter model.
Reset the intended group and refresh its charts
function resetDispatch() {
dc.filterAll(reportGroup);
dc.redrawAll(reportGroup);
}
The reset operation removes chart filters in the named group, while redraw refreshes that group's chart displays. Pass the same group to both operations. Leaving out an argument can broaden which registered charts receive the operation; a local-looking button should not hide that scope.
Check the result through the data model as well as the chart appearance. A bar returning to its original color is not sufficient evidence that the selected count and total were restored. Read the appropriate top-level reductions and compare them with four records and eighteen units for the supplied fixture.
The existing Crossfilter count guide explains why a dimension's own group can ignore that dimension's filter. Keep that distinction when choosing a selected-record readout. A category chart can continue showing available alternatives while the all-filter reduction reports the current selection.
If the next task is selecting which source rows belong in the briefing, the CSV-to-dashboard guide explains that preparation step. Keep that choice separate from a chart filter: resetting the chart should restore the report’s supplied rows, not silently redefine the source extract.
Prove that the neighboring report stays selected
Select North in the dispatch report and a category in the independent report. Reset dispatch. Require dispatch to return to four records and eighteen units, while the other report retains its category filter and its own previously calculated result. Then reset the second report separately.
Also test repeated reset when no filters are active. Its result should remain the unfiltered fixture, without creating duplicate chart instances or appending another SVG on every click. Keep model creation separate from an action that only clears filters and redraws.
Label the button “Reset dispatch filters” rather than “Reset everything.” Keep that scope in the implementation and the reading instructions. The final handoff should include the compatible library versions, the group names, and the two independent expected results so a reviewer can repeat the isolation check.