Bars on second X Axis not showing - chart.js

Question

In the following JsFiddle the second dataset is not showing up when setting xAxisID to "2". It works when set to "1" or commented out:
https://jsfiddle.net/8v0xwj9L/3/
labels: ["Label1", "Label2", "Label3", "Label4", "Label5"],
datasets: [{
"label": "Total V",
"backgroundColor": "rgba(53,81,103,1)",
"borderColor": "rgba(53,81,103,.4)",
"data": [10, 4, 3, 7, 6]
},
{
"label": "Total C",
"xAxisID": "2",
"backgroundColor": "rgba(255,153,0,1)",
"borderColor": "rgba(255,153,0,.4)",
"data": [9, 9, 8, 7, 6]
}
]
};
var options = {
scales: {
xAxes: [{
id: "1",
position: 'bottom'
},
{
offset: true,
id: '2',
position: 'bottom'
}
],
}
};
var ctx = document.getElementById("myChart");
new Chart(ctx, {
type: "bar",
data: data,
options: options
});
What could be the reason?
My end goal is to have a bar chart with 2 datasets that have different ranges on the X axis but still overlap in the graph.
Imagine comparing datapoints from Week 1 with Week 2 by showing a bar for next to each other for each day in the week but their X timestamps obviously don't match hence two X axis.

Answer 1

When you say timestamps, are we talking about days or times? If it's just days, you can use one x-axis like here: https://jsfiddle.net/jbmn01z6/
If you want time, then a bar chart is not a good idea. I don't even know if it's possible the way you would like it. I would use a line chart with a x-axis of the type: 'time'. Then you can use and show your timestamps very precisely.