.js

    const [holdx1, setHoldX1] = useState(0)
    const [holdx2, setHoldX2] = useState(0)
    const [pressx1, setPressX1] = useState(0)
    const [pressx2, setPressX2] = useState(0)

    function zoomData(data) {
        const dataZoom = data

        const leftPress = getIndex(Math.min(pressx1, pressx2), data)
        const rightPress = getIndex(Math.max(pressx1, pressx2), data)

        const leftHold = getIndex(Math.min(holdx1, holdx2), data)
        const rightHold = getIndex(Math.max(holdx1, holdx2), data)

        let leftDif = leftHold - leftPress
        if (leftDif > 0) { leftDif = 0 } // evita o slice de começar pelo final do array
        const rightDif = rightHold - rightPress

        for (let i = 0; i < dataZoom.length; i++) {
            dataZoom[i].data = dataZoom[i].data.slice(-leftDif, dataZoom[i].data.length + 1 - rightDif)
            dataZoom[i].dataX = dataZoom[i].dataX.slice(-leftDif, dataZoom[i].data.length + 1 - rightDif)
        }
        sustainedData = dataZoom
        return dataZoom
    }


    function renderData() {
        if(count > 0) {
            count = 0
            return zoomData(dataRender)
        } else {
            return zoomData(dataF)
        }
    }
    return (
        <View style={{ height: 400, padding: 10, flexDirection: 'row', flex: 1 }}
            onTouchStart={(evt) => {
                if (evt.nativeEvent.touches.length === 2) {
                    setPressX1(evt.nativeEvent.touches[0].locationX), setPressX2(evt.nativeEvent.touches[1].locationX)
                }
            }}
            onTouchMove={(evt) => {
                if (evt.nativeEvent.touches.length === 1) {
                    setxPos(evt.nativeEvent.locationX)
                } else if (evt.nativeEvent.touches.length === 2) {
                    setHoldX1(evt.nativeEvent.touches[0].locationX), setHoldX2(evt.nativeEvent.touches[1].locationX)
                }
            }}
            onTouchEnd={(evt) => {
                count++
            }}>
            <YAxis
                data={dataF[lengthierData(dataF)].data}
                numberOfTicks={8}
                formatLabel={(value) => ' ' + value + ' '}
                svg={axesSvg}
                contentInset={insetVertical}
                style={{ marginBottom: 12, }}
                max={5}
                min={-5}
            />
            <View style={{ flex: 1 }} >
                <LineChart
                    data={renderData()}
                    contentInset={inset}
                    style={{ flex: 1 }}
                    yMin={-5}
                    yMax={5}
                >
                    <Grid svg={{ stroke: '#DCDCDC' }} />
                    <ToolTip xPos={xPos} colors={colors} />
                </LineChart>
                <XAxis
                    data={dataF[lengthierData(dataF)].dataX}
                    numberOfTicks={8}
                    xAccessor={({ item }) => item}
                    formatLabel={(value, index) => moment(value).format(' H:mm:ss')}
                    svg={axesSvg}
                    contentInset={insetHorizontal}
                />
            </View>
        </View>
    )
}