My Chart.js datasets look as following -
datasets: [
{
data: data_0,
label: unit_0,
backgroundColor: "#3e95cd",
borderColor: "#3e95cd",
yAxisID: 'data_0-axis',
},
{
data: data_1,
label: unit_1,
backgroundColor: "#8e5ea2",
borderColor: "#8e5ea2",
yAxisID: 'data_1-axis'
},
{
data: data_2,
label: unit_2,
backgroundColor: "#3cba9f",
borderColor: "#3cba9f",
yAxisID: 'data_2-axis'
},
{
data: data_3,
label: unit_3,
backgroundColor: "#000000",
borderColor: "#000000",
yAxisID:'data_3-axis'
}
]
I want to add some conditions like checking if data is valid or not. Upon invalid data that data should be poped or not shown on the graph. Basically I want to do something like this -
datasets: [
//Some conditions before adding the data to the graph.
if(condition){
{
data: data_0,
label: unit_0,
backgroundColor: "#3e95cd",
borderColor: "#3e95cd",
yAxisID: 'data_0-axis',
}},
if(condition){{
data: data_1,
label: unit_1,
backgroundColor: "#8e5ea2",
borderColor: "#8e5ea2",
yAxisID: 'data_1-axis'
}},
]
It would be helpful if I could get some help on how to achieve something similar to this.
From a brief look at Chart.js, it seems that you can use arbitrary JavaScript with it, and a built-in JS feature that fits this situation perfectly is the built-in .filter method of Arrays.
This demo code gives a brief rundown of how it can work for you:
const demo_datasets = [
{data: "data_1", YAxisID: "data_1-axis"}, // (Has a valid YAxisID)
{data: "bad_data_1", YAxisID: ""},
{data: "bad_data_2", YAxisID: 42},
{data: "bad_data_3" }
];
// This is how you would populate your actual `datasets` variable. (Initializing
// Array w/ spread operator is redundant if demo_datasets is already an Array)
const filtered = filterData([...demo_datasets], hasYAxis);
console.log(`datasets before filtering: ${demo_datasets.length}`);
console.log(`after filtering: ${filtered.length}`)
console.log("\nvalid sets:"); console.log(filtered);
// `filterData` is our main Function
function filterData(dubiousData, filterFunc){
// `filterData` takes an Array and a Func, uses `.filter` to make a new Array,
// which includes only those elements for which Func returns true
return dubiousData.filter(filterFunc);
}
function hasYAxis(dSet){
// One possible filter function -- YAxisID must be a non-empty string
if (dSet.YAxisID && typeof dSet.YAxisID === 'string'){
return true;
}
}