Class NumberRangeFilterBuilder

AI-generated Key Takeaways

• The NumberRangeFilterBuilder helps create interactive number range filter controls for your charts, which are essentially sliders for selecting numeric value ranges.

• This builder allows you to customize the filter's minimum and maximum values, orientation (horizontal or vertical), display of range values, and the number of ticks on the slider.

• Use this builder to refine data visualization by filtering out rows that fall outside the specified numeric range, enhancing user interaction with the chart.

• By chaining the builder's methods, you can easily configure various aspects of the number range filter and seamlessly integrate it into your Google Charts.

NumberRangeFilterBuilder

A builder for number range filter controls.

A number range filter is a slider with two thumbs that lets the user select ranges of numeric values. Given a column of type number and matching options, this control filters out the rows that don't match the range that was selected.

For more details, see the Gviz documentation.

Methods

Method	Return type	Brief description
setMaxValue(maxValue)	NumberRangeFilterBuilder	Sets the maximum allowed value for the range lower extent.
setMinValue(minValue)	NumberRangeFilterBuilder	Sets the minimum allowed value for the range lower extent.
setOrientation(orientation)	NumberRangeFilterBuilder	Sets the slider orientation.
setShowRangeValues(showRangeValues)	NumberRangeFilterBuilder	Sets whether to have labels next to the slider displaying extents of the selected range.
setTicks(ticks)	NumberRangeFilterBuilder	Sets the number of ticks (fixed positions in a range bar) a number range filter slider thumbs can fall in.

Detailed documentation

setMaxValue(maxValue)

Sets the maximum allowed value for the range lower extent. If undefined, the value is inferred from the contents of the DataTable managed by the control.

// Builds a number range filter and sets the maximum value to 100.
const numberRangeFilter = Charts.newNumberRangeFilter()
                              .setFilterColumnLabel('Col2')
                              .setMaxValue(100)
                              .build();

Parameters

Name	Type	Description
maxValue	Integer	The maximum value of the slider.

Return

NumberRangeFilterBuilder — This builder, useful for chaining.

---

setMinValue(minValue)

Sets the minimum allowed value for the range lower extent. If undefined, the value is inferred from the contents of the DataTable managed by the control.

// Builds a number range filter and sets the minimum value to 10.
const numberRangeFilter = Charts.newNumberRangeFilter()
                              .setFilterColumnLabel('Col2')
                              .setMinValue(10)
                              .build();

Parameters

Name	Type	Description
minValue	Integer	The minimum value of the slider.

Return

NumberRangeFilterBuilder — This builder, useful for chaining.

---

setOrientation(orientation)

Sets the slider orientation.

// Builds a number range filter and sets it to have a horizontal orientation.
const numberRangeFilter = Charts.newNumberRangeFilter()
                              .setFilterColumnLabel('Col2')
                              .setOrientation(Charts.Orientation.HORIZONTAL)
                              .build();

Parameters

Name	Type	Description
orientation	Orientation	The slider orientation to set.

Return

NumberRangeFilterBuilder — This builder, useful for chaining.

See also

• Orientation

---

setShowRangeValues(showRangeValues)

Sets whether to have labels next to the slider displaying extents of the selected range.

// Builds a number range filter and enables showing of the number range values.
const numberRangeFilter = Charts.newNumberRangeFilter()
                              .setFilterColumnLabel('Col2')
                              .setShowRangeValues(true)
                              .build();

Parameters

Name	Type	Description
showRangeValues	Boolean	If true, enables showing of labels next to the slider.

Return

NumberRangeFilterBuilder — This builder, useful for chaining.

---

setTicks(ticks)

Sets the number of ticks (fixed positions in a range bar) a number range filter slider thumbs can fall in.

// Builds a number range filter and sets the number of ticks for the range
// to 10.
const numberRangeFilter = Charts.newNumberRangeFilter()
                              .setFilterColumnLabel('Col2')
                              .setTicks(10)
                              .build();

Parameters

Name	Type	Description
ticks	Integer	The number of ticks on the slider.

Return

NumberRangeFilterBuilder — This builder, useful for chaining.