Dendogram

@nivo/dendogramhierarchy

Dendogram

Actions Logs
Start interacting with the chart to log actions
Base
objectrequired

The hierarchical data object.

string | Functionoptionaldefault:'id'

The key or function to use to retrieve nodes identity.

top-to-bottom | right-to-left | bottom-to-top | left-to-right | radialoptionaldefault:'top-to-bottom'
top-to-bottom

Defines how to get label text, can be a string (used to access current node data property) or a function which will receive the actual node data.

numberrequired

Chart width.

numberrequired

Chart height.

objectoptional
px
px
px
px

Chart margin.

Style
Themeoptional

Define style for common elements such as labels, axes…

Interactivity
booleanoptionaldefault:true
   

Enable/disable interactivity.

(node, event) => voidoptional

onMouseEnter handler.

(node, event) => voidoptional

onMouseMove handler.

(node, event) => voidoptional

onMouseLeave handler.

(node, event) => voidoptional

onClick handler.

(node, event) => voidoptional

onClick handler.

Customization
NodeComponentoptional

Override the default node component.

('nodes' | CustomSvgLayer | CustomHtmlLayer | CustomCanvasLayer)[]optional

Define layers, please use the appropriate variant for custom layers.

Accessibility
stringoptional

Main element role attribute.

stringoptional

Main element aria-label.

stringoptional

Main element aria-labelledby.

stringoptional

Main element aria-describedby.

Motion
booleanoptionaldefault:true
   

Enable/disable transitions.

string | objectoptionaldefault:'gentle'
gentle

Motion config for react-spring, either a preset or a custom configuration.