Skip to content

Adding support for edge placement as well as override for Hint

Compare
Choose a tag to compare
@alee8 alee8 released this 31 Dec 00:25
· 540 commits to master since this release

This release adds two new props (and set of illustrative examples) to Hint component: align and getAlignStyle. align (replacing orientation prop) is an object with two props — horizontal and vertical — and set of values that support existing and new hint placement:
a) around a data point in one of four quadrants (imagine the point bisected by two axes — vertical, horizontal — creating 4 quadrants around a data point).
b) New: pin to an edge of chart/plot area and position along that edge using data point's other dimension value.

Developers wanting total control can use the getAlignStyle(align, x, y) function that returns an inline style object with one or more of the following props (left, right, top, bottom).

The orientation prop is supported for backwards compatibility but will be deprecated in future release.

See the following figure explaining the two props (horizontal, vertical) for the align prop object.
react-vis-hint