Background blue blink after filter data by legend in default render mode

[abrahamAlonzo]

Problem: When i click a legend for filter data using the next options in a hook component:

const options = {
        title: {
            text: 'TITLE 1',
            textStyle: {
                color: '#77787c'
            },
            fontFamily: 'Open Sans',
            textVerticalAlign: 'center',
            padding: [
                20,  // up
                0, // right
                0,  // down
                250, // left
            ]
        },

        dataZoom: {
            type: 'inside'
        },
        xAxis: {
            type: "category",
            data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
        },
        legend: {
            data: ['Test 1', 'Test 2', 'Test 3'],
            orient: 'vertical',
            type: 'scroll',
            left: 500,
            top: 50,
        },
        yAxis: {
            type: "value"
        },
        grid: {
            left: '3%',
            right: '20%',
            bottom: '3%',
            containLabel: true
        },
        series: [
            {
                name: 'Test 1',
                data: [880, 900, 970, 1000, 1190, 1130, 1620],
                type: "line"
            },
            {
                name: 'Test 2',
                data: [880, 900, 970, 1000, 1190, 1130, 1620],
                type: "line"
            },
            {
                name: 'Test 3',
                data: [820, 900, 534, 1000, 768, 789, 1620],
                type: "line"
            },
        ]
    };

a background blue blink appear

this doesn't happen if i pass a canvas prop as

<SafeAreaView style={styles.chartContainer}>
    <ECharts 
        ref={chartRef}
        canvas
        option={options} 
     />
</SafeAreaView>

but in order to use with react-native-view-shot for take a screenshot it seems have conflict with the canvas rendering mode.

[tomLadder]

Hey @abrahamAlonzo,

Can you give me some more detailed information about your environment? (ReactNative Version, Android or iOS?)

[abrahamAlonzo]

Hi @tomLadder , i am working with React Native 59.8 and React 16.8.3 in Android.

[tomLadder]

Ok thank you for reporting this issue. I could reproduce it, gonna have a look at it.

[tomLadder]

Ok the svg rendering seems to be buggy with interactions. Haven't figured out a way yet to resolve this problem. Did you have a look at https://github.com/gre/react-native-view-shot/issues/53 ?

Maybe your screenshot lib works with canvas rendering if you set android:hardwareAccelerated="false" in your android activity.

[abrahamAlonzo]

It works,thank you!.

Since i only have a MainActivity it seems to came with notably perfomance issues for sliders in general (side drawers and selectors), i am searching for a way to only have this component as a separate activity in order of decoupled this behavior.