Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@float-capital/rescript-recharts) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

rescript-recharts

This library provides ReScript bindings for Recharts.

It is a fork of ahrefs/bs-recharts, updated to the new ReScript syntax.

Installation

npm install @float-capital/rescript-recharts --save-dev

Setup

Add rescript-recharts to bs-depenencies in your bsconfig.json:

{
  "bs-dependencies": ["@float-capital/rescript-recharts"]
}

Usage Example

@react.component
let make = (~data) => {
  open Recharts;

  <ResponsiveContainer height={Px(200.)} width={Px(300.)}>
    <BarChart
      barCategoryGap={Px(1.)}
      margin={"top": 0, "right": 0, "bottom": 0, "left": 0}
      data>
      <Bar name="Some bar" dataKey="pv" fill="#2078b4" stackId="a" />
      <Bar name="Other bar" dataKey="uv" fill="#ff7f02" stackId="a" />
      <Tooltip />
      <Legend align=#left iconType=#circle />
    </BarChart>
  </ResponsiveContainer>
}

Helpers

Some of polymorphic params are represented as a variant, list below:

module AxisInterval = {
  type arg =
    | PreserveStart
    | PreserveEnd
    | PreserveStartEnd
    | Num(int)
};

module PxOrPrc = {
  type arg =
    | Px(int)
    | Prc(int)
};

module StrOrNode = {
  type arg =
    | Str(string)
    | Node(React.reactElement)
};

you will use it like this:

<XAxis
  interval=PreserveStart
  label=Str("text") />
<XAxis
  interval=Num(12)
  label=Node(
    <span>
      (React.string("text"))
    </span>
  ) />

Check the Recharts documentation for available props.