javascript - 使用 chart.js 的 3 个数据集并非所有数据都可见
问题描述
我正在尝试创建一个条形图,并在此基础上显示与距离、步数和活动持续时间相关的数据。
我已经使用 chart.js 构建了一个图表,现在我面临的问题是当我看到所有 3 个数据集时,我的步数数据不可见。如果我只是将这些步骤用作数据集,那么它会显示步骤数据,但不会显示所有三个数据集。
这是我的bar
配置选项,可能我错过了任何东西。
使用另一个线程,我尝试将 xAxis 设置为 offset:false,但它不起作用
barOptions : {
legend: {
position: 'bottom'
},
tooltips: {
mode: 'nearest',
intersect: false,
filter: function(item, data) {
var data = data.datasets[item.datasetIndex].data[item.index];
return !isNaN(data) && data !== null;
}
},
hover: {
mode: 'nearest',
intersect: false
},
maintainAspectRatio: false,
scales: {
yAxes: [{
ticks: {
beginAtZero: true,
suggestedMin: 0,
}
}],
xAxes: [{
type: 'time',
time: {
unit: 'hour',
displayFormats: {
'millisecond': 'MMM DD',
'second': 'MMM DD',
'minute': 'HH:mm',
'hour': 'hA',
'day': 'MMM DD',
'week': 'MMM DD',
'month': 'MMM DD',
'quarter': 'MMM DD',
'year': 'MMM DD',
},
},
offset: false,
}]
}
},
这是我提供给图表的数据
var gData ='[{"avgActive_duration":0.0,"avgBlood_glucose":null,"avgDiastolic":null,"avgDistance":738.52099609375,"avgResting_heartrate":null,"avgSteps":875.0,"avgSystolic":null,"avgWeight":null,"timestamp":"Apr 1, 2019 12:40:00 PM"}]';