Javascript 如何显示多个标签和数据';在chart.js中有哪些类似于npmtrend网站的内容?

Javascript 如何显示多个标签和数据';在chart.js中有哪些类似于npmtrend网站的内容?,javascript,charts,chart.js,Javascript,Charts,Chart.js,我试图在chart.js库中的一个点上显示多个数据,与上图相同,但它只显示一个数据集 var ctx=document.getElementById('myChart'); var myChart=新图表(ctx{ 键入:“行”, 数据:{ 标签:[“红色”、“蓝色”、“黄色”、“绿色”、“紫色”、“橙色”], 数据集:[{ 标签:“#投票数”, 数据:[12,19,3,5,2,3], 标签:“#年龄”, 数据1:[14,13,32,25,32,31],, 标签:“#数字”, 数据2:[11

我试图在
chart.js
库中的一个点上显示多个数据,与上图相同,但它只显示一个数据集


var ctx=document.getElementById('myChart');
var myChart=新图表(ctx{
键入:“行”,
数据:{
标签:[“红色”、“蓝色”、“黄色”、“绿色”、“紫色”、“橙色”],
数据集:[{
标签:“#投票数”,
数据:[12,19,3,5,2,3],
标签:“#年龄”,
数据1:[14,13,32,25,32,31],,
标签:“#数字”,
数据2:[11,12,19,15,20,21],,
背景颜色:[
"rgba(255,99,132,0.2)",,
“rgba(54162235,0.2)”,
"rgba(255,206,86,0.2)",,
“rgba(751921920.2)”,
“rgba(153102255,0.2)”,
‘rgba(255、159、64、0.2)’
],
边框颜色:[
"rgba(255,99,132,1)",,
“rgba(54162235,1)”,
"rgba(255,206,86,1)",,
"rgba(751921921)",,
"rgba(153102255,1)",,
‘rgba(255、159、64、1)’
],
边框宽度:1
}]
},
选项:{
比例:{
雅克斯:[{
滴答声:{
贝吉纳泽罗:是的
}
}]
}
}
});

一个数据集中不能有多个数据数组,需要为每个数据数组创建一个数据集

var ctx=document.getElementById('chartJSContainer');
常量边框颜色=[
"rgba(255,99,132,1)",,
“rgba(54162235,1)”,
"rgba(255,206,86,1)",,
"rgba(751921921)",,
"rgba(153102255,1)",,
‘rgba(255、159、64、1)’
];
常量背景色=[
"rgba(255,99,132,0.2)",,
“rgba(54162235,0.2)”,
"rgba(255,206,86,0.2)",,
“rgba(751921920.2)”,
“rgba(153102255,0.2)”,
‘rgba(255、159、64、0.2)’
];
常数填充=假;
const borderWidth=1;
var myChart=新图表(ctx{
键入:“行”,
数据:{
标签:[“红色”、“蓝色”、“黄色”、“绿色”、“紫色”、“橙色”],
数据集:[{
标签:“#投票数”,
数据:[12,19,3,5,2,3],
背景色,
边框颜色,
边界宽度,
填满
},
{
标签:“#年龄”,
数据:[14,13,32,25,32,31],
背景色,
边框颜色,
边界宽度,
填满
},
{
标签:“#数字”,
数据:[11,12,19,15,20,21],
背景色,
边框颜色,
边界宽度,
填满
}
]
},
选项:{
工具提示:{
模式:“索引”,
交集:错
},
比例:{
雅克斯:[{
滴答声:{
贝吉纳泽罗:是的
}
}]
}
}
});


我假设您需要多个层,每个层只显示一个数据集。把它想象成透明的床单相互重叠。您需要能够隐藏和显示各个图层,才能看到每个点的数据。@Elijah您能再解释一下吗。我没有使用charts.js的东西,但我假设您需要将一个图表放在每个唯一的层中。问题:关于chart.js,您是否能够为一个位置点设置多个条目并将它们彼此区分开来?这是什么意思,如果折线图中有两个或多个点位于它们将重叠的同一点上,则需要单击图例关闭某些点以查看其他点,如果将鼠标悬停在这些点上,则工具提示将显示所有点。如果你选择一个条形图,你会得到单独的条形图,它们不会overlap@LeeLenalee,谢谢,如果我想创建几行,它将只在一行中显示,但在一行中显示所有内容,并显示如下:蓝色;票数:19人,年龄:13人,人数:12人,可能吗?!这会形成一个有点复杂的图表来理解您在何处为每个数据集设置数据和背景色您可以为除第一个数据集之外的所有数据集添加属性showLine:false,这使得只有一个数据集绘制了线,但您需要创建数据点,以便它们在该线上生成,最好的方法就是否认贝塞尔curves@LeeLenalee你能把它添加到你的代码片段吗?我会用我期望的图片更新这个问题