Skip to main content
Version: 1.2.0

Refs

Refs provide support for filtering, sorting and any data manipulation of K2 components you can think of in a painless manner. It enables you to get and set the data state out-of-box. Passing a ref prop to a k2 component will give you following props:

  1. data: Response object received from the URL or the prop value passed by user as data to the component.
  2. viewData: Data which is used by view, and if mapData is provided by the user, is transformed and is the output of mapData function.
  3. setViewData: Callback for setting transformed/manipulated data for a K2 component.
  4. status: Current status of data.
    • LOADING: Data fetching from API endpoint is in a pending state.
    • SUCCESS: Fetched data successfully.
    • ERROR: Error while fetching data.
    • INVALID_DATA: Data validation error when passed to dataValidator.
    • EMPTY_DATA: When blankStateValidator returns true.

Usage

  1. Import any component from @k2/d3-viz or @k2/rv-viz.
import { BubbleChart } from "@k2/d3-viz";
  1. Create a ref and pass it to component
const ref = React.useRef() // React.createRef();
<BubbleChart ref={ref} url="server/api/data" />;

Example

Live Editor