使用Javascript解析Json以呈现多行高库存图表

var jsonData = '{"data": [{"date": "2022-01-01", "inventory": 100}, {"date": "2022-01-02", "inventory": 150}, {"date": "2022-01-03", "inventory": 200}]}';
var data = JSON.parse(jsonData);

<canvas id="chart"></canvas>

var ctx = document.getElementById('chart').getContext('2d');
var chart = new Chart(ctx, {
  type: 'line', // 或者 'bar'，根据需要选择图表类型
  data: {
    labels: data.data.map(item => item.date), // X轴标签，使用日期数据
    datasets: [{
      label: 'Inventory',
      data: data.data.map(item => item.inventory), // Y轴数据，使用库存数据
      backgroundColor: 'rgba(0, 123, 255, 0.5)', // 柱状图填充颜色
      borderColor: 'rgba(0, 123, 255, 1)', // 折线图线条颜色
      borderWidth: 1 // 线条宽度
    }]
  },
  options: {
    responsive: true, // 图表自适应大小
    scales: {
      y: {
        beginAtZero: true // Y轴从0开始
      }
    }
  }
});