我创建了一个折线图，在点悬停时无法看到工具提示。悬停在线点时似乎会引发错误。TypeError: Cannot read property 'format' of undefined
到目前为止，我能够使用time需要适配器的数据呈现折线图。根据文档，尝试更改单位并希望查看轴标签，但这也不可见。下面是图表配置和小提琴：
var data = [{
"t": 1622287843965,
"y": "35181.38"
},
{
"t": 1622288064247,
"y": "35779.44"
},
{
"t": 1622288261196,
"y": "35681.55"
},
{
"t": 1622288644294,
"y": "35552.49"
}
];
var ctx = document.getElementById('chartJSContainer');
const chartInstance = new Chart(ctx, {
type: "line",
data: {
datasets: [{
label: `Price`,
data: data,
backgroundColor: "rgba(134,159,152, 1)",
borderColor: "rgba(174, 305, 194, 0.4)"
}],
},
options: {
parsing: {
yAxisKey: 'y',
xAxisKey: 't',
},
scales: {
xAxis: {
adapters: {
date: {}
},
ticks: {
source: "labels"
},
display: true,
type: 'time',
time: {
unit: 'day'
}
}
},
}
});<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chartjs-adapter-moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chartjs-adapter-date-fns.js"></script>
<canvas id="chartJSContainer" width="600" height="400"></canvas>这是因为您添加了一个适配器，但忘记添加 corosponding 日期库。请参阅工作示例：
var data = [{
"t": 1622287843965,
"y": "35181.38"
},
{
"t": 1622288064247,
"y": "35779.44"
},
{
"t": 1622288261196,
"y": "35681.55"
},
{
"t": 1622288644294,
"y": "35552.49"
}
];
var ctx = document.getElementById('chartJSContainer');
const chartInstance = new Chart(ctx, {
type: "line",
data: {
datasets: [{
label: `Price`,
data: data,
backgroundColor: "rgba(134,159,152, 1)",
borderColor: "rgba(174, 305, 194, 0.4)"
}],
},
options: {
parsing: {
yAxisKey: 'y',
xAxisKey: 't',
},
scales: {
x: {
adapters: {
date: {}
},
ticks: {
source: "labels"
},
display: true,
type: 'time',
time: {
unit: 'day'
}
}
},
}
});<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chart.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/chartjs-adapter-moment.min.js"></script>
<canvas id="chartJSContainer" width="600" height="400"></canvas>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句