我有一个包含多条线的图表,每条线都绘制在它自己的y轴上。
我一直在设置它,以便当通过图例隐藏线时,它所在的轴也会被隐藏。我的计划是在画布上添加一个点击监听器,然后根据线路状态禁用或启用所有轴。
我的问题是确定线是否隐藏。如果dataset.hidden
中的隐藏值未定义,则dataset._meta
属性似乎仅相关。我试着设置代码时考虑到这一点:
ctx.onclick = function(){
var changed = false;
for(var j = 0;j < scatterChart.options.scales.yAxes.length;j++){
var oldVal = scatterChart.options.scales.yAxes[j].display;
var hidden = false;
var isHiddenDataSet = scatterChart.data.datasets[j].hidden;
if(isHiddenDataSet){
hidden = true;
}
var isHiddenMeta = scatterChart.data.datasets[j]._meta[0].hidden;
if(isHiddenMeta != null){
hidden = isHiddenMeta;
}
scatterChart.options.scales.yAxes[j].display = !hidden;
changed = changed || oldVal == scatterChart.options.scales.yAxes[j].display;
}
if(changed){
scatterChart.update();
}
}
此代码适用于我的原始测试,只有一个图表但如果页面上有多个图表,则_meta
中数据对象的索引从图表更改为图表时会失败。
有没有办法确定数据集是否被隐藏?
答案 0 :(得分:2)
因为它适合您,我将其设为答案
数据集中的_meta
属性非常有用,尤其是在搜索hidden
等特定属性时。
但是,当同一页面上有多个图表时,很难处理它。
执行以下操作时:
var isHiddenMeta = scatterChart.data.datasets[j]._meta[0].hidden;
0
索引实际上是代码中调用的第一个图表(索引1
是第二个,等等。)
因此,您将获得第一张图表的信息,而不是您刚刚点击的图表。
要解决此问题,您需要使用Object.keys()
方法以及数据集信息,如下所示:
var isHiddenMeta = scatterChart.data.datasets[j]._meta[Object.keys(scatterChart.data.datasets[j]._meta)[0]].hidden;
这将获得真实图表数据集的hidden
属性。