我试着画一个有两个条形和两条线的图表。问题是线不会从0开始。

我试着在x轴上人为地创建点，让它们一直走下去，但这并不管用。下面是我的代码：

var myChart = new Chart(ctx, {
     type: 'bar',
     data: {
         labels: document.getElementById('tag1').textContent == 'ITEM TIME SUPPLY ANALYSIS'? ["Desired time supply","Actual time Supply"] :[ 'jours de stock désirés','jours de stock actuel'] ,
         datasets: [{
             label: document.getElementById('tag1').textContent == 'ITEM TIME SUPPLY ANALYSIS'? "limit max time supply (days)": "limite max jours de stock désirés",
             data: [
                {
                     x: 0,
                     y: [{% for dr in reference %} {{ dr.cap_ts }}, {% endfor %}]
                 },
                 {
                     x: 30,
                     y: [{% for dr in reference %} {{ dr.cap_ts }}, {% endfor %}]
                 },
                 {

                     x: 60,
                     y: [{% for dr in reference %} {{ dr.cap_ts }}, {% endfor %}]
                 },

                 {
                     x: 90,
                     y: [{% for dr in reference %} {{ dr.cap_ts }}, {% endfor %}]
                 },
             ],
             type: 'line',
             backgroundColor: [
                 'rgba(0, 0, 0, 0)',
             ],
             borderColor: [
                 'rgba(54, 162, 235, 1)',
             ],
             borderWidth: 5
         }, {
             label: document.getElementById('tag1').textContent == 'ITEM TIME SUPPLY ANALYSIS'? "limit min time supply (days)": "limite min jours de stock désirés",
             data: [
                 {
                     x: 0,
                     y: [{% for dr in reference %}{{ dr.min_ts}}, {% endfor %}]
                 },
                 {
                     x: 30,
                     y: [{% for dr in reference %}{{ dr.min_ts}}, {% endfor %}]
                 },
                 {
                     x: 60,
                     y: [{% for dr in reference %}{{ dr.min_ts}}, {% endfor %}]
                 },

                 {
                     x: 90,
                     y: [{% for dr in reference %}{{ dr.min_ts}}, {% endfor %}]
                 },
             ],
             type: 'line',
             backgroundColor: [
                 'rgba(0, 0, 0, 0)',
             ],
             borderColor: [
                 'rgba(255, 99, 132, 1)',
             ],
             borderWidth: 3
         }, { 

             data: [ 
                 {x:30,
                     y: {% for dr in reference %}{{ dr.dts}}, {% endfor %}
                 },
                 { x: 60,
                     y: {% for dr in reference %}{{ dr.actual_ts}}, {% endfor %}
                 },
             ],
             backgroundColor: [
                 'rgba(255, 99, 132, 0.2)',
                 'rgba(54, 162, 235, 0.2)'
             ],
             borderColor: [
                 'rgba(255, 99, 132, 1)',
                 'rgba(54, 162, 235, 1)'
             ],
             borderWidth: 1
         }]
     },
     options: {
         scales: {
             scaleShowLabels: false,
             type: 'linear',
             position: 'bottom',
             xAxes: [{
                 maxBarThickness: 90,
                 ticks: {
                     beginAtZero: true,
                 }
             }],
             yAxes: [{
                 ticks: {
                     beginAtZero: true,
                 }
             }]
         }
     }

 })

在这一点上，我不知道该尝试什么，我不能找到很多关于chart.js的文档，我是新的javascript，任何帮助将是非常感谢的