@ahrefs/bs-highcharts-react

Bucklescript bindings for highcharts-react-official

Usage no npm install needed!

<script type="module">
  import ahrefsBsHighchartsReact from 'https://cdn.skypack.dev/@ahrefs/bs-highcharts-react';
</script>

README

bs-highcharts-react

These are Bucklescript bindings for highcharts-react, the official Highcharts wrapper for React. 🚧 They are not complete. Types can change in a backwards incompatible way between minor versions. 🚧

Install

# Needs @ahrefs/bs-highcharts to be installed, to define the chart options
yarn add @ahrefs/bs-highcharts
yarn add @ahrefs/bs-highcharts-react

Setup

Add bs-highcharts and bs-highcharts-react to bs-dependencies in your bsconfig.json.

{
  /* ... */
  "bs-dependencies": [
    "reason-react",
    "@ahrefs/bs-highcharts",
    "@ahrefs/bs-highcharts-react"
  ],
  /* ... */
}

Usage Example

In your Component.re module:

let options =
  Highcharts.Options.(
    make(
      ~title=Title.make(~text="My chart", ()),
      ~series=[|Series.line(~data=[|1, 2, 3|], ())|],
      (),
    )
  );

let component = ReasonReact.statelessComponent(__MODULE__);

let make = _children => {
  ...component,
  render: _self =>
    <div> <HighchartsReact highcharts=Highcharts.default options /> </div>,
};