0

Creating a Chart in React Native, I am using : react-native-chart-kit

I can create Segment "segments : The amount of horizontal lines - default 4" but can"t find a way to do it with Vertical Lines. When Segment change, number of LABEL change dynamicaly :

Segment TO 5 Segment to 5

Segment TO 2 enter image description here

Is there a Way to do It with other axis ? Because this axis has 50 value, and this is too much do display.

Here is my Code : *

 const data = {
    labels: DynamicAxis, // This is the 50 Values Array
    datasets: [
        {
        data: Test,   
        color: (opacity = 1) => `rgba(0, 0, 255, ${opacity})`, // couleur de la ligne
        strokeWidth: 5, // épaisseur de la ligne,
        withDots : false,
        },
        // {
        //     data: [200]
        // },
    ]
    };

 <LineChart
    data={data}
    withVerticalLabels={true}
    width={400} // from react-native
    height={220}
    yAxisLabel=""
    yAxisSuffix="m"
    yAxisInterval={100} // optional, defaults to 1.
    xAxisLabel="km"
    xScale="log"
    verticalLabelRotation={0}
    // hidePointsAtIndex={[0]} // Hide Label km
    segments={5}
    chartConfig={{
        backgroundColor: "#e26a00",
        backgroundGradientFrom: "#000000",
        backgroundGradientTo: "#ffa726",
        decimalPlaces: 0, // optional, defaults to 2dp
        color: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`,
        labelColor: (opacity = 1) => `rgba(255, 255, 255, ${opacity})`,
        style: {
            borderRadius: 16
        },
        propsForDots: {
            r: "3",
            strokeWidth: "2",
            stroke: "#ffa726"
        }
    }}
    bezier
    style={{
        marginVertical: 8,
        borderRadius: 16
    }}
/>
Lucas
  • 85
  • 9

0 Answers0