react native chart kit responsive is not working

1k Views Asked by At

I was trying to make responsive the chart of react native, According to there documentation if you want to responsive the chart you have to put below code. I checked others code but theirs's are working. I tried so much But I can't resolve it

import { Dimensions } from "react-native";
const screenWidth = Dimensions.get("window").width;

<LineChart
  data={data}
  width={screenWidth}
  height={220}
  chartConfig={chartConfig}
/>

But I tried same as like this

const screenWidth = Dimensions.get("window").width;

<LineChart
          data={{
            labels: ["January", "February", "March", "April", "May", "June"],
            datasets: [
              {
                data: [
                  Math.random() * 100,
                  Math.random() * 100,
                  Math.random() * 100,
                  Math.random() * 100,
                  Math.random() * 100,
                  Math.random() * 100,
                ],
              },
            ],
          }}
          width={screenWidth} // from react-native
          height={220}
        />
    ```

Can anyone help me why it is not working....

1

There are 1 best solutions below

0
On

try using useWindowDimensions

import { useWindowDimensions } from 'react-native';

const windowWidth = useWindowDimensions().width;
const windowHeight = useWindowDimensions().height;