Problem: Uncaught TypeError: Cannot read property 'yAccessor' of undefined

[trevorbernard]

A runtime error happens when I try to load the following code that worked in 0.1.6

<ChartCanvas width={this.state.width} height={400} margin={{left: 35, right: 50, top:10, bottom: 30}}
                         data={candles}>
  <Chart id={1}>
    <XAxis axisAt="bottom" orient="bottom" ticks={6}/>
    <YAxis axisAt="left" orient="left" ticks={5}/>
    <DataSeries yAccessor={CandlestickSeries.yAccessor} xAccessor={(d) => d.date}>
      <CandlestickSeries />
    </DataSeries>
  </Chart>
</ChartCanvas>

[rrag]

yes there is a breaking change in 0.2

http://rrag.github.io/react-stockcharts/documentation.html#/change_log

To make your example work you will have to

1. move the xAccessor from DataSeries to Chart
2. add id={0} to DataSeries

https://gist.github.com/rrag/b13b739458e65ff93f4a#file-candlestickchart-jsx is an updated working example

[trevorbernard]

I updated my code from the updated example and I am still receiving the same error.

            <ChartCanvas width={this.state.width} height={400}
                         margin={{left: 35, right: 50, top:10, bottom: 30}}
                         data={candles} type={type}>
              <Chart id={1} xAccessor={(d) => d.date}>
                <XAxis axisAt="bottom" orient="bottom" ticks={6}/>
                <YAxis axisAt="left" orient="left" ticks={5}/>
                <DataSeries id={0} yAccessor={CandlestickSeries.yAccessor}>
                  <CandlestickSeries />
                </DataSeries>
              </Chart>
            </ChartCanvas>

[rrag]

I am not able to replicate the problem in both plunker and also on a npm based build. I added a test to

https://github.com/rrag/react-stockcharts-examples

try this

git clone https://github.com/rrag/react-stockcharts-examples.git
cd react-stockcharts-examples
npm install
npm run serve:test:webpack

open http://localhost:8090/

open src/index.js and update to see the changes reflect on the browser.

If you still have problems please show that in plunker or share the repo

[trevorbernard]

I did a bit of debugging and the issue I was running into was react-stockcharts installs a different version of react than my app was using.