Skip to content

Unable to update chart data using functional components #66

Description

@mati23

I'm using the new React Native functional components with hooks but I'm not able to update the data of the chart using the
this.chart.setOption(option); on a state change event. I tried do a console log inside the additionalCode parameter but the this object is undefined. I don't know how to reference the echart object using RN Hooks, can someone help me out?

    `const option = { 
    title: {
        show:false,
        text: 'Gráfico Radar'
    },
    tooltip: {},
    legend: {
    orient: 'horizontal',
    position:'bottom',
    left: 0,
    bottom:0,
    type:'scroll',             
    pageButtonPosition:'end', 
    data: chartColumnNameArray,
    },
    radar: {
        radius:'70%',
        name: {
            textStyle: {
                color: '#fff',
                backgroundColor: '#999',
                borderRadius: 3,
                padding: [3, 5]
            }
        },
        indicator: chartValueArray.map((item, index)=>{
        return {name:chartColumnNameArray[index].toUpperCase().substring(0,5).concat('.'), max:maxValue}
        })
    },
    series: [{
        name: 'TEST',
        type: 'radar',          
        data: radarChartData <------------------- //when this state changes I would setOptions and reload chart
    }]
    };

    <View style={{display:  visibleChart==="radarchart"?"flex":"none", width:'100%', height:'60%'}} >                     
             <ECharts option={option} additionalCode={React.useEffect(()=>{this.chart.setOption(option)},[radarChartData])}/>                                                              
     </View>

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions