如何在react native中创建多线图？

npm install react-native-chart-kit

import React from 'react';
import { LineChart } from 'react-native-chart-kit';

const data = [
  {
    data: [
      { x: 1, y: 10 },
      { x: 2, y: 20 },
      { x: 3, y: 30 },
    ],
    color: (opacity = 1) => `rgba(0, 0, 255, ${opacity})`, // 设置线的颜色
  },
  {
    data: [
      { x: 1, y: 15 },
      { x: 2, y: 25 },
      { x: 3, y: 35 },
    ],
    color: (opacity = 1) => `rgba(255, 0, 0, ${opacity})`, // 设置线的颜色
  },
];

const MultiLineChart = () => {
  return (
    <LineChart
      data={data}
      width={Dimensions.get('window').width} // 设置图表宽度为屏幕宽度
      height={220} // 设置图表高度
      chartConfig={{
        backgroundGradientFrom: '#ffffff',
        backgroundGradientTo: '#ffffff',
        decimalPlaces: 2, // 设置数据的小数位数
        color: (opacity = 1) => `rgba(0, 0, 0, ${opacity})`, // 设置文本和轴线的颜色
      }}
      bezier // 设置曲线为贝塞尔曲线
      style={{
        marginVertical: 8,
        borderRadius: 16,
      }}
    />
  );
};

import React from 'react';
import { View } from 'react-native';
import MultiLineChart from './MultiLineChart';

const App = () => {
  return (
    <View>
      <MultiLineChart />
    </View>
  );
};

export default App;