我想在chart.js中显示一个线条，其中包含从mockapi自动获取的数据

<canvas id="myChart"></canvas>

fetch('https://mockapi.example.com/data')
  .then(response => response.json())
  .then(data => {
    const xData = data.map(item => item.x);
    const yData = data.map(item => item.y);
    // 在这里调用chart.js的相关代码
  });

const ctx = document.getElementById('myChart').getContext('2d');
const chart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: xData, // x轴数据
    datasets: [{
      label: 'My Data',
      data: yData, // y轴数据
      borderColor: 'rgb(75, 192, 192)',
      fill: false
    }]
  },
  options: {
    // 可以根据需要设置图表的各种配置选项
  }
});