amcharts / amcharts3-react

Official amCharts V3 React component
Apache License 2.0
118 stars 50 forks source link

Chart does not update when going to another route then going back #52

Open codestitch opened 7 years ago

codestitch commented 7 years ago

I am using this example https://github.com/amcharts/amcharts3-react/tree/master/examples/create-react-app and it worked! However, one thing I noticed is that when I change page/route, like when I go to page b then I go back to page A (where the amchart resides) the chart would not render the updated data.

Please help. Thank you

jomasti commented 7 years ago

How are you updating the data?

codestitch commented 7 years ago

in componentDidMount. as stated in the example https://github.com/amcharts/amcharts3-react/tree/master/examples/create-react-app.

componentDidMount(){ this.setState({ // Update the chart dataProvider every 3 seconds timer: setInterval(() => { this.setState({ dataProvider: generateData() }); }, 3000) }); }

so every 3 seconds the data changes as well as in the view. However, If I try to go to another page then back to the page where the chart resides the view won't render the new generated data, though there's new generated data.

xbojch commented 7 years ago

@codestitch are you sure the component unmounted and re-mounted? You can check it easily by logging something in componentDidMount and changing route (navigating). Otherwise you can use the componentWillReceiveProps to restart the data refreshing cycle. http://busypeoples.github.io/post/react-component-lifecycle/

doguhanokumus commented 7 years ago

Hi, I can reproduce when I change the route, however, I noticed something different.

I am using a stateless wrapper component that has data prop and pass this along with the config.dataProvider to AmCharts.React.

When I inspect the HTML, I see that tags in are empty after the new data is supplied through render().

Now, When the screen is resized the graph is visible again and tags get filled. When the data is updated, it goes back to empty tags.

The component is unmounted on route change (checked with componentWillUnmount), and mounts new that fails to display the graph.

Why does rerendering fails to redraw? @xbojch What do you suggest in that case? Your last post couldn't point me to any direction.

Thanks, D.

Pauan commented 7 years ago

@codestitch Please provide me your code in a Gist or GitHub repo so I can figure out what the problem is.

tejbloke commented 6 years ago

Hi @doguhanokumus, could you find a solution to your reported issue, cause even i'm facing a similar issue, any help would be much appreciated.