Skip to main content

Free Brush

Basic Configuration​

Free Brush is an extention of Brush, an interactive component that is designed to work inside an XYContainer. See brush docs to learn about basic configuration and usage.

Mode​

You can change the axis alignment of your Free Brush by setting the mode property to "x", "y" or "xy":

<VisFreeBrush mode="y"/>
Loading...

Auto Hide​

Disabling the autoHide property will keep the Free Brush selection visible after the onBrushEnd event has triggered:

<VisFreeBrush autoHide={false}/>
Loading...

CSS Variables​

All supported CSS variables and their default values
--vis-free-brush-selection-fill-color: #0b1640;
--vis-free-brush-selection-fill-opacity: 0.4;
--vis-free-brush-selection-stroke-color: #acb2b9;
--vis-free-brush-handle-fill-color: #6d778c;
--vis-free-brush-handle-stroke-color: none;
 
/* Dark Theme */
--vis-dark-free-brush-selection-fill-color: #344174;
--vis-dark-free-brush-selection-stroke-color: #0b1640;
--vis-dark-free-brush-handle-fill-color: #6d778c;

Component Props​

NameTypeDescription
* required property