Javascript 显示两个线图，数据从不同的点开始

我有两个共享标签的数据集，但一个数据集比另一个小

例如：

label1: ['8-20', '8-21', '8-22', '8-23']
data1: [100, 120, 150, 170, 150]

label2: ['8-22', '8-23']
data2: [100, 120]

我想显示一个包含两个数据集的折线图，但在适当的刻度处开始第二个数据集，而不是

data2

在与

data1

相同的刻度处开始

这可能吗

var thisChart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: label1,
    datasets: [{ 
        data: data1,
        label: "LT15",
        borderColor: gradientStroke,
        backgroundColor: 'rgba(62, 205, 190, 0.1)',
        fill: true,
        spanGaps: true,
        tension: .2,
        borderWidth: 2,
      },{ 
        data: data2,
        label: "LT121",
        borderColor: gradientStroke2,
        backgroundColor: 'rgba(62, 149, 205, 0.2)',
        borderWidth: 2,
        fill: true,
        tension: .2,
        spanGaps: true
      }
    ]
  },
  options: {
    title: {
      display: false,
      text: 'Comparison'
    },
    responsive: true,
    maintainAspectRatio: false,
    legend: {
        lineWidth: 0,
    },
  }
});

---

您只需用

null

填充

data2

，即：

data2: [null, null, 100, 120]

var label1=['8-20'，'8-21'，'8-22'，'8-23']，
数据1=[100120150170150]，
标签2=['8-22'，'8-23']，
数据2=[null，null，100120]，
gradientStroke='红色'，
gradientStroke2='蓝色'，
thisChart=新图表（document.getElementById（'Chart'）{
键入：“行”，
数据：{
标签：label1，
数据集：[{
数据：数据1，
标签：“LT15”，
边框颜色：gradientStroke，
背景颜色：“rgba（62205190,0.1）”，
填充：是的，
斯潘：是的，
张力：.2，
边界宽度：2，
}, {
数据：数据2，
标签：“LT121”，
边框颜色：gradientStroke2，
背景颜色：“rgba（621492050.2）”，
边界宽度：2，
填充：是的，
张力：.2，
斯潘：是的
}]
},
选项：{
标题：{
显示：假，
文本：“比较”
},
回答：是的，
MaintaintAspectRatio:false，
图例：{
线宽：0，
},
}
});