@reincharts/core
Chart engine, ChartCanvas, panes, scales, hooks and themes.
npm install @reincharts/coreEverything here is also re-exported by the umbrella package reincharts.
Components
| Name | Description |
|---|---|
| ChartCanvas | The chart root. |
| ChartOverlay | Absolutely positioned DOM layer over a pane (legends, buttons, custom HTML). |
| Pane | A vertically stacked chart area with its own price scales. |
Hooks
| Name | Description |
|---|---|
| useChart | The chart engine of the closest <ChartCanvas>. |
| useChartEvent | Listens to chart events (pointer events in chart coordinates, keydown, rangechange, crosshair...). |
| useChartState | Subscribes to chart state (layout, visible range, crosshair...). |
| useHitTarget | Registers an interactive object (hover, click, drag) such as a drawing or a draggable price line. |
| usePaneId | Id of the closest <Pane> (or "main" when there is none). |
| useRenderable | Registers a canvas renderable with the chart. |
Classes
| Name | Description |
|---|---|
| ChartEngine | The chart engine: data mapping, viewport, panes, layout, render loop and events. |
| PriceScale | Maps prices to pixels for one scale inside a pane. |
| TimeFormatter | Time zone aware date utilities with a per-instance cache. |
Functions
| Name | Description |
|---|---|
| accessor | Turns an Accessor into a function. |
| applyStroke | Sets stroke color, width and dash on a context. |
| clamp | Limits a value to [min, max]. |
| computeTimeTicks | Picks time axis ticks among visible bars: most significant boundaries first, skipping any that would sit closer than minSpacing pixels to an accepted tick. |
| contrastText | Picks black or white text for a given background color. |
| createTheme | Creates a theme by deep-merging overrides into a base theme (defaults to lightTheme). |
| crisp | Aligns a coordinate to the pixel grid so 1px lines are crisp. |
| dashArray | Canvas dash pattern for a LineDash style at a line width. |
| decimalsFor | Number of decimals needed to display a step without losing precision. |
| drawLabel | Draws a text label inside a filled rounded box; returns the box rect. |
| font | CSS font string from the theme (size and weight optional). |
| formatCompact | Compact number formatting, e.g. |
| formatNumber | Formats a number with a fixed number of decimals and thousands separators. |
| formatPercent | Signed percentage, e.g. |
| formatPrice | Price formatting with automatic precision: more decimals for small prices. |
| functor | Turns a Functor (a static value or a function of the datum) into a function. |
| horizontalLine | Strokes a crisp horizontal line at y from x1 to x2. |
| isFiniteNumber | True for numbers that are not NaN or ±Infinity (type guard). |
| lowerBound | First index whose value is >= target (values must be ascending). |
| nearestIndex | Index of the value closest to target (values must be ascending, non-empty). |
| niceStep | The "nice" step (1, 2, 2.5, 5 × 10^n) nearest to span / count. |
| niceTicks | Evenly spaced nice ticks covering [min, max]. |
| resolveTheme | Resolves the theme prop: a preset name, a full theme, or partial overrides of the light theme. |
| shallowEqual | Shallow equality of two values or plain objects (for useChartState selectors). |
| upperBound | First index whose value is > target (values must be ascending). |
| verticalLine | Strokes a crisp vertical line at x from y1 to y2. |
| withAlpha | Returns a color with the given alpha. |
Constants
| Name | Description |
|---|---|
| darkTheme | The built-in dark theme. |
| lightTheme | The built-in light theme. |
Types
| Name | Description |
|---|---|
| Accessor | A field name or a function reading a value from a datum, e.g. |
| AxisRegistration | |
| ChartCanvasProps | Props of the ChartCanvas component. |
| ChartEventMap | |
| ChartEventType | |
| ChartOptions | |
| ChartOverlayProps | Props of the ChartOverlay component. |
| ChartPointerEvent | |
| ChartState | Immutable snapshot consumed by React (useChartState). |
| Clamp | |
| CrosshairState | |
| DeepPartial | |
| DrawScope | Everything a renderable needs to draw one frame. |
| Functor | A static value or a function of the datum, e.g. |
| HitTarget | |
| HitTargetSpec | |
| LabelOptions | |
| Layer | |
| Layout | |
| LegendItem | |
| LegendValue | |
| LineDash | Canvas helpers shared by series, axes, coordinates and drawings. |
| PaneLayout | |
| PaneOptions | |
| PaneProps | Props of the Pane component. |
| PriceScaleMode | |
| PriceScaleOptions | |
| PriceTick | |
| Region | |
| Renderable | |
| RenderableSpec | |
| StrokeStyle | |
| Theme | Visual theme shared by every Reincharts component. |
| TimeFormatterOptions | |
| TimeParts | |
| TimeTick | |
| VisibleRange | |
| XMode | |
| XType | |
| ZoomAnchor |