图表 - 折线演示

<LineChart
  width={500}
  height={300}
  series={[
    { data: pData, label: 'pv' },
    { data: uData, label: 'uv' },
  ]}
  xAxis={[{ scaleType: 'point', data: xLabels }]}
/>

<LineChart
  width={500}
  height={300}
  series={[
    { data: pData, label: 'pv', yAxisId: 'leftAxisId' },
    { data: uData, label: 'uv', yAxisId: 'rightAxisId' },
  ]}
  xAxis={[{ scaleType: 'point', data: xLabels }]}
  yAxis={[{ id: 'leftAxisId' }, { id: 'rightAxisId' }]}
  rightAxis="rightAxisId"
/>

<LineChart
  xAxis={[{ data: xData, scaleType: 'point' }]}
  series={[{ data }]}
  height={200}
  margin={{ top: 10, bottom: 20 }}
/>
<LineChart
  xAxis={[{ data: xData, scaleType: 'point' }]}
  series={[{ data, connectNulls: true }]}
  height={200}
  margin={{ top: 10, bottom: 20 }}
/>

<LineChart
  series={[
    {
      type: 'line',
      data: [1, 2, 3, 4, 1, 2, 3, 4, 5],
      valueFormatter: (v, i) => `${v}${i.dataIndex > 5 ? ' (estimated)' : ''}`,
    },
  ]}
  xAxis={[{ data: [0, 1, 2, 3, 4, 5, 6, 7, 8] }]}
  height={200}
  width={400}
  slots={{ line: CustomAnimatedLine }}
  slotProps={{ line: { limit: 5 } as any }}
  sx={{ '& .line-after path': { strokeDasharray: '10 5' } }}
/>