我正在使用ChartJS,但我不知道如何去除工具提示中的白色框。什么设置/选项可以设置去除边框/白色轮廓或至少让我设置颜色?
谢谢你,谢谢你
data_sets.push({
data: date_list["data_counts"],
label: date_list["name"],
fill: true,
backgroundColor: transparentizeColor,
borderColor: newColor,
pointBackgroundColor: newColor,
pointBorderColor: newColor,
})
my_chart = new Chart(ctx, {
type: 'line',
data: {
labels: data["date_labels"],
datasets: data_sets
},
options: {
tooltips: {
intersect: false,
},
elements: {
point: {
radius: 0
}
},
legend: {
display: false
},
scales: {
yAxes: [{
ticks: {
precision: 0,
suggestedMax: 3,
beginAtZero: true
}
}],
xAxes: [{
gridLines: {
display: false
}
}]
}
}
}, );
3条答案
按热度按时间kupeojn61#
这确实没有选择,但您可以解决它。
白色轮廓的颜色由
multiKeyBackground
工具提示选项控制。通过将其设置为完全透明(#00000000
或rgba(0, 0, 0, 0)
),并禁用数据集上的边框,它至少会看起来更好(尽管仍然不完美)。0g0grzrc2#
我记得我也曾经遇到过这个问题,但我想不起来答案,我也找过答案......
我唯一的解决方案是使用自定义工具提示。
你可以修改我找到的这个JSFiddle。他们在css类
.chartjs-tooltip-key
中使用了一个带有border-radius: 5px
的圆。删除这条线,你就得到了一个矩形。要么使用整个自定义工具提示,要么使用所需的部分。
ru9i0ody3#
在撰写本文(Chart.js
3.9.1
)时,可以使用工具提示回调来控制工具提示图例项的显示属性。例如,图例项
Current
如下所示:回调是在Charts.js中自定义图表的一种极其强大的方法