{"action":"created","issue":{"url":"https://api.github.com/repos/highcharts/highcharts-react/issues/48","repository_url":"https://api.github.com/repos/highcharts/highcharts-react","labels_url":"https://api.github.com/repos/highcharts/highcharts-react/issues/48/labels{/name}","comments_url":"https://api.github.com/repos/highcharts/highcharts-react/issues/48/comments","events_url":"https://api.github.com/repos/highcharts/highcharts-react/issues/48/events","html_url":"https://github.com/highcharts/highcharts-react/issues/48","id":349089991,"node_id":"MDU6SXNzdWUzNDkwODk5OTE=","number":48,"title":"Updating HighStock chart when state changes","user":{"login":"tjugg","id":5834590,"node_id":"MDQ6VXNlcjU4MzQ1OTA=","avatar_url":"https://avatars1.githubusercontent.com/u/5834590?v=4","gravatar_id":"","url":"https://api.github.com/users/tjugg","html_url":"https://github.com/tjugg","followers_url":"https://api.github.com/users/tjugg/followers","following_url":"https://api.github.com/users/tjugg/following{/other_user}","gists_url":"https://api.github.com/users/tjugg/gists{/gist_id}","starred_url":"https://api.github.com/users/tjugg/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tjugg/subscriptions","organizations_url":"https://api.github.com/users/tjugg/orgs","repos_url":"https://api.github.com/users/tjugg/repos","events_url":"https://api.github.com/users/tjugg/events{/privacy}","received_events_url":"https://api.github.com/users/tjugg/received_events","type":"User","site_admin":false},"labels":[{"id":843879360,"node_id":"MDU6TGFiZWw4NDM4NzkzNjA=","url":"https://api.github.com/repos/highcharts/highcharts-react/labels/pending%20reply","name":"pending reply","color":"4da51d","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":6,"created_at":"2018-08-09T11:36:29Z","updated_at":"2018-08-14T08:58:49Z","closed_at":null,"author_association":"NONE","body":"Hi!\r\n\r\nHow should we properly handle state updates when using HighStock? For example, my page loads with the data still being fetched, and when the data loading is completed, state updates and the HighStock chart will be given new options with the newly fetched data series. I am using this approach with HighCharts, and it works completely fine, how ever, when using HighStock, I get this error after state update and re render:\r\n` [Show/hide message details.] TypeError: f.options is undefined[Learn More] highstock.js:508\r\n./node_modules/highcharts/highstock.js/</</<\r\nhighstock.js:508\r\n./node_modules/highcharts/highstock.js/</</a.fireEvent/<\r\nhighstock.js:31\r\nforEach self-hosted:268:13 ./node_modules/highcharts/highstock.js/</</a.each\r\nhighstock.js:28\r\n./node_modules/highcharts/highstock.js/</</a.fireEvent\r\nhighstock.js:30\r\nsetChartSize\r\nhighstock.js:261\r\ngetAxisMargins\r\nhighstock.js:256\r\ngetMargins\r\nhighstock.js:256\r\nredraw\r\nhighstock.js:247\r\n./node_modules/highcharts/highstock.js/</</<\r\nhighstock.js:533\r\n./node_modules/highcharts/highstock.js/</</a.wrap/a[n]\r\nhighstock.js:20\r\nupdate\r\nhighstock.js:335\r\ncomponentWillReceiveProps\r\nHighchartsReact.js:24\r\ncallComponentWillReceiveProps\r\nreact-dom.development.js:11528\r\nupdateClassInstance\r\nreact-dom.development.js:11720\r\nupdateClassComponent\r\nreact-dom.development.js:13154\r\nbeginWork\r\nreact-dom.development.js:13825\r\nperformUnitOfWork\r\nreact-dom.development.js:15864\r\nworkLoop\r\nreact-dom.development.js:15903\r\ncallCallback\r\nreact-dom.development.js:100\r\ninvokeGuardedCallbackDev\r\nreact-dom.development.js:138\r\ninvokeGuardedCallback\r\nreact-dom.development.js:187\r\nreplayUnitOfWork\r\nreact-dom.development.js:15311\r\nrenderRoot\r\nreact-dom.development.js:15963\r\nperformWorkOnRoot\r\nreact-dom.development.js:16561\r\nperformWork\r\nreact-dom.development.js:16483\r\nperformSyncWork\r\nreact-dom.development.js:16455\r\ninteractiveUpdates$1\r\nreact-dom.development.js:16720\r\ninteractiveUpdates\r\nreact-dom.development.js:2150\r\ndispatchInteractiveEvent\r\nreact-dom.development.js:4533\r\ndispatchInteractiveEvent self-hosted:1027:17 `\r\n\r\nI assume that HighStock chart data updating should be handled somehow separately? Why does this approach work fine with HighChart? I have a requirement to dynamically keep adding different series to the HighStock chart, and this error is killing me :/. **I have a license also if that matters.**\r\n\r\nEDIT: This also seems to have something to do with the Y axis. If I configure the Y axis to have for example a title, the chart crashes with the error above. If I DON'T define any config for the Y axis, the chart updates just fine. Weird. I also tried to access the chart instance via refs, and use .addSeries(), but the end result is the same."},"comment":{"url":"https://api.github.com/repos/highcharts/highcharts-react/issues/comments/412803648","html_url":"https://github.com/highcharts/highcharts-react/issues/48#issuecomment-412803648","issue_url":"https://api.github.com/repos/highcharts/highcharts-react/issues/48","id":412803648,"node_id":"MDEyOklzc3VlQ29tbWVudDQxMjgwMzY0OA==","user":{"login":"KacperMadej","id":8960408,"node_id":"MDQ6VXNlcjg5NjA0MDg=","avatar_url":"https://avatars0.githubusercontent.com/u/8960408?v=4","gravatar_id":"","url":"https://api.github.com/users/KacperMadej","html_url":"https://github.com/KacperMadej","followers_url":"https://api.github.com/users/KacperMadej/followers","following_url":"https://api.github.com/users/KacperMadej/following{/other_user}","gists_url":"https://api.github.com/users/KacperMadej/gists{/gist_id}","starred_url":"https://api.github.com/users/KacperMadej/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/KacperMadej/subscriptions","organizations_url":"https://api.github.com/users/KacperMadej/orgs","repos_url":"https://api.github.com/users/KacperMadej/repos","events_url":"https://api.github.com/users/KacperMadej/events{/privacy}","received_events_url":"https://api.github.com/users/KacperMadej/received_events","type":"User","site_admin":false},"created_at":"2018-08-14T08:58:49Z","updated_at":"2018-08-14T08:58:49Z","author_association":"CONTRIBUTOR","body":"**tl;dr** This is the same problem as the one reported in Highcharts: https://github.com/highcharts/highcharts/issues/8196 + bad demo in this repository.\r\n\r\n**Long / full story:**\r\nIt was not possible to set `oneToOne` to `false` due to a bug in code that was fixed thank to @scottclayton - thank you very much for finding the source of the problem and submitting the PR. New version of the wrapper (1.3.2) is updating to NPM's `highcharts-react-official` as I'm typing this.\r\n\r\nIn the demo simplified structure looks like main component with 4 chart components. On first chart options update done through the main's container `setState` update check runs through it's child components and because `update` prop is by default set to true, then `shouldComponentUpdate` by default returns `true`. This causes update on other charts - stock and map charts included and because `oneToOne` for the stock chart is set to `true` the update causes the error reported in main Highcharts repository.\r\n\r\nWe are working or rewriting this wrapper to work better with new versions of React, so drastic changes are not planned until version 2 of this wrapper will be released. For now only emergency fixes are committed, so the demo is still showing the problem, but thank to the PR by @scottclayton it's avoidable by code changes.\r\n\r\nThere's no ETA for v2.0.0 for now, but it should be done within next few weeks.\r\n\r\n@tjugg Please check with new code and `oneToOne` set to `false` for stock charts and if this doesn't help please provide more details about how the problem could be recreated - app that could be build, like this repository and it's demo, would be helpful for debugging of your problem.\r\n"}}
{"actor":{"display_login":"KacperMadej"}}