Update Real-Time Line Chart Dynamically

I'm trying to get my chart to update dynamically as new data comes. I have already updated the values, but the graph does not update the change in data dynamically. What is the equivalent function of the React function chart.update() for react-native to enable the graph to update?

`import {Chart,LineChart,BarChart,PieChart,ProgressChart,ContributionGraph} from 'react-native-chart-kit' import React, { Component } from 'react'; import { View, Text, StyleSheet, ImageBackground, Icon, FlatList, Button, TextInput, Dimensions } from 'react-native'; import CheckBox from 'react-native-check-box'

export default class FocusScreen extends React.Component { constructor(props) { super(props); this.state = { isChecked: false, } this.dates =['January', 'February', 'March', 'April', 'May', 'June'] this.values = [20, 30,40,50,60,70] this.shouldRedraw = true this.chart = new LineChart(); }

componentDidMount(){ this.timer = setInterval(()=> this.returnLabels(), 1000) this.timer = setInterval(()=> this.returnData(), 1000) }

updateShouldRedraw = () => { this.shouldRedraw = true; }

returnLabels = () => { this.dates.push(parseInt(Math.random()*100).toString()) console.log(this.dates) return this.dates }

returnData = () => { this.values.push(parseInt(Math.random()*100)) console.log(this.values) return this.values
}

render() { return (

Bezier Line Chart `rgba(255, 255, 255, ${opacity})`, style: { borderRadius: 16 } }} bezier style={{ marginVertical: 8, borderRadius: 16 }} />

);

} }

const styles = StyleSheet.create({ container: { flex: 1,

alignItems: 'center',
width: '100%',
height: '100%',

}, imageBackground: { height: '100%', width: '100%', }, wrapper: { borderWidth: 3, borderColor: 'green', flex: 1, margin: '10%', marginTop: '20%', height: 40, justifyContent: 'flex-end', alignItems: 'stretch',

leftText: { fontSize: 28, } })`

Moon-009 / react-native-chartjs

Update Real-Time Line Chart Dynamically #7