Getting Started not showing anything just blank

[jawknees]

Is there an existing issue for this?

• I have searched the existing issues

Code of Conduct

• I agree to follow this project's Code of Conduct

Victory version

40.1.0

Code Sandbox link

No response

Bug report

I'm starting out on using the library. tried the getting started guide on android, but I can't get my app to display anything. Tried to find something within the issues board, but nothing about chart showing blank. Installations were good, there were warnings with CMake but the build came through successfully.

Steps to reproduce

Just follow the Getting started guide. Like properly and directly follow the Getting Started guide

Here's a sample code of what I did. Just really followed the getting started guide with some little tweaks:

import { View, Text, SafeAreaView } from 'react-native'
import React, { useEffect } from 'react'
import { CartesianChart, Line } from 'victory-native';

const generateRandomNumbers = (length) => {
    let randomNumbers = [];
  
    for (let i = 0; i < length; i++) {
        
        let randomNumber = Math.floor(Math.random() * 100);

        randomNumbers.push({ x: randomNumber, y: i });
    }
  
    // Return the array of objects
    console.log("generated random numbers", randomNumbers);
    return randomNumbers;
};

const AppMain = ({navigation, route}) => {

    const DATA2 = generateRandomNumbers(31);

    useEffect(() => {
        console.log('mounted');
        
        return(() => {
            console.log('unmounted');
        });
    }, [navigation]);

    return (
        <SafeAreaView style={{flex: 1}} >
            <View style={{height: 500, borderColor: 'black', borderWidth: 1,}} >
                <CartesianChart data={DATA2} xKey={"x"} yKeys={["y"]}
                >
                    {({ points }) => (
                        <Line 
                            points={points.y}
                            color="red"
                            strokeWidth={3}
                            // animate={{type: 'timing', duration: 200}}
                        />
                    )}
                </CartesianChart>
                {/* <Text>Something</Text> */}
            </View>
        </SafeAreaView>
    )
}

export default AppMain

Expected behavior

Should show the sample chart that was given with the example image within the guide.

Actual behavior

Blank. Nothing. I can show you a screenshot with a given border to where the chart should display.

Environment

- Device: Desktop
- OS: MacOS Ventura 13.6.4
- Node: 20.11.1 
- npm: 10.2.4

"@shopify/react-native-skia": "^1.0.4",
"react": "18.2.0",
"react-native": "0.71.17",
"react-native-gesture-handler": "^2.16.0",
"react-native-reanimated": "^3.8.1",
"victory-native": "^40.1.0"

[jawknees]

here's the sample image for the actual behavior

not really sure what's wrong here. I'm just starting out

[jawknees]

Sorry, this should actually be for victory native xl