- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
工具提示未显示在我的图表中。你能明白为什么吗?
<head>
<meta charset="utf-8" />
<title>Chart.js Example</title>
<script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.bundle.min.js'></script>
<body>
<canvas id="myChart" width="600" height="400"></canvas>
<script>
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
// labels: ['m', 'tu', 'w', 'th', 'f', 'sa', 'su'],
labels: [{% for item in labels %}
"{{item}}",
{% endfor %}],
datasets: [
{
data : [{% for item in values %}
{{item}},
{% endfor %}],
backgroundColor:
[
"#2ecc71","#3498db","#95a5a6","#6dc066","#daa520",
"#9b59b6","#f1c40f","#e74c3c","#34495e","#008080",
"#ffc0cb","#d3ffce","#ff7373","#ffa500","#e6e6fa",
"#003366","#20b2aa","#c6e2ff","#008000"
]
}
]
},
options: {
responsive : true,
showTooltips: true,
scales: {
yAxes: [
{
stacked: false
}
],
xAxes: [
{
ticks: {
autoSkip: true,
maxTicksLimit: 20
}
}
]
}
}
});
</script>
这是图表的照片(顶部被切掉了一点)。其他一切都工作正常。标签和数据来 self 正在运行的 python 脚本,它们正在产生预期的结果。这只是我似乎无法工作的工具提示。
感谢您的帮助!
最佳答案
出现此问题的原因是 backgroundColor
数组。您不能在折线图的单个数据集中使用多种颜色数组。请使用单独的颜色。
var ctx = document.getElementById('myChart').getContext('2d');
var myChart = new Chart(ctx, {
type: 'line',
data: {
labels: ['m', 'tu', 'w', 'th', 'f', 'sa', 'su'],
datasets: [{
data: [12, 23, 43, 34, 53, 47, 36],
backgroundColor: '#3498db'
}]
},
options: {
responsive: true,
showTooltips: true,
scales: {
yAxes: [{
stacked: false
}],
xAxes: [{
ticks: {
autoSkip: true,
maxTicksLimit: 20
}
}]
}
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.min.js"></script>
<canvas id="myChart" width="600" height="400"></canvas>
关于javascript - 工具提示在 Chart.js 中不起作用。有任何想法吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43596365/
今天有小伙伴给我留言问到,try{...}catch(){...}是什么意思?它用来干什么? 简单的说 他们是用来捕获异常的 下面我们通过一个例子来详细讲解下
我正在努力提高网站的可访问性,但我不知道如何在页脚中标记社交媒体链接列表。这些链接指向我在 facecook、twitter 等上的帐户。我不想用 role="navigation" 标记这些链接,因
说现在是 6 点,我有一个 Timer 并在 10 点安排了一个 TimerTask。之后,System DateTime 被其他服务(例如 ntp)调整为 9 点钟。我仍然希望我的 TimerTas
就目前而言,这个问题不适合我们的问答形式。我们希望答案得到事实、引用资料或专业知识的支持,但这个问题可能会引发辩论、争论、投票或扩展讨论。如果您觉得这个问题可以改进并可能重新打开,visit the
我就废话不多说了,大家还是直接看代码吧~ ? 1
Maven系列1 1.什么是Maven? Maven是一个项目管理工具,它包含了一个对象模型。一组标准集合,一个依赖管理系统。和用来运行定义在生命周期阶段中插件目标和逻辑。 核心功能 Mav
我是一名优秀的程序员,十分优秀!