2.2.1

React JSX Highstock update only

• Adds support for click events on RangeSelector buttons #79 (See Highcharts docs here)

<RangeSelector>
  <RangeSelector.Button count={1} type="day" onClick={() => alert('Clicked 1 day!')}>1d</RangeSelector.Button>
  <RangeSelector.Button count={7} type="day" onClick={() => alert('Clicked 7 days!')}>7d</RangeSelector.Button>
</RangeSelector>

2.2.0

Bug fix

• Stop events being removed when a Series is updated #77

Highcharts 6 Support

New Features

Highcharts 6 support

Long awaited support for Highcharts 6 added, see our Sankey and Stream Graph examples!

Add Reflow and Loading support

New features

Loading component

Added a <Loading /> component to display a message while awaiting for some task to complete (#30). See example

Reflow (via callback)

Added support for reflow via a new callback prop (#43). See example

The callback prop expects a function, which will be called with the Highcharts chart object once the chart is created.

Example

getChart = chart => {
  this.chart = chart;
}

render () {
  return (
    <HighchartsChart callback={this.getChart}>
      // omitted...
    </HighchartsChart>
  );
}

Reflow could then be achieved by adding a function which interacts with the chart object directly.

// Extending the above example
resize = () => {
  this.chart.reflow();
}

This pattern could also be used to utilize Highcharts features not yet supported by React JSX Highcharts, like printing or exporting.

2.0.2 & 1.4.2

Bug fix release.

• <Chart /> component not updating when props changed #45
• <RangeSelector.Input /> boxes were not clickable #40

These fixes have also been back ported to the 1.x version as 1.4.2

2.0.1 & 1.4.1

Bug Fix

Fix #38 - Fixes an issue where unmounting an axis did not remove the axis properly from the chart.

2.0.0

Version 2 is here!

This is a major version bump, so of course there are...

Breaking changes

withHighcharts HOC introduced, which is required

Issue #20 highlighted the need to support Highcharts in "styled" mode, which presented a few challenges with the existing NPM module dependency structure.

Therefore we now have a new higher order component withHighcharts which allows you to inject your own Highcharts global.

This means we can simplify the peer-dependencies and make all the NPM packages only need to require highcharts.

So if you're using the Highstock package - react-jsx-highstock - instead of requiring a peer dependency of highstock-release, we can now use highcharts instead.

react-jsx-highcharts

• Minimal changes excepting requiring withHighcharts to inject the Highcharts global

import { withHighcharts, HighchartsChart, Chart, /* etc... */ } from 'react-jsx-highcharts';
import Highcharts from 'highcharts';

const MyChart = () => (
  <HighchartsChart>
    <Chart />
    // etc
  </HighchartsChart>
);

export default withHighcharts(MyChart, Highcharts); // Injecting the Highcharts global

react-jsx-highstock

• Requires withHighcharts, as above
• Requires the peer-dependency highcharts instead of highstock-release
• This means you import Highstock using...

import { withHighcharts, HighchartsStockChart, Chart, /* etc... */ } from 'react-jsx-highstock';
import Highcharts from 'highcharts/highstock';
const MyChart = () => (
  <HighchartsStockChart>
    <Chart />
    // etc
  </HighchartsStockChart>
);
export default withHighcharts(MyChart, Highcharts); // Injecting the Highstock global

All this means we can add...

New features!

Support for Highcharts in styled mode (Highcharts styled by CSS)

As documented in Highcharts itself, Highcharts in styled mode requires a slightly different Highcharts import path

import Highcharts from 'highcharts/js/highcharts'; // Highcharts in styled mode
// or
import Highcharts from 'highcharts/js/highstock'; // Highstock in styled mode

See the example

1.4.0

New Features

React 16 support

As Fiber supports rendering arrays we can stop rendering junk hidden wrapper divs! Yay!

Custom className

The root <HighchartsChart /> / <HighchartsStockChart /> now accept a className prop. Thanks @will-stone!

Bug fixes

Fixed an error when unmounting a Stock chart with a navigator, event handlers on the document object were not removed (#32)

1.3.4

Bug fixes

Fixes numerous issues when unmounting charts or sub-components of a chart

1.3.3

Bug fixes

Fix #15 - Removing of plot lines and plot bands now works
Fix #16 - Make plot line and plot bands updatable
Fix #17 - Remove 'addedSeries' event used by Series Provider when series is unmounted
(Thanks @geforcefan!)

Fix #19 - <BarSeries /> should invert the chart