let dataSet = [];
Object.keys(stateData).map((item) => {
let short = {};
let medium = {};
let long = {};
if (stateData[item].horizon === "Short-term") {
short["label"] = "Short-term";
short["pointBackgroundColor"]="rgba(201, 120, 12, 1)"
short["x"] = stateData[item].impact;
short["y"] = stateData[item].occurrence;
dataSet.push(short);
}
if (stateData[item].horizon === "Medium-term") {
medium["label"] = "Medium-Term";
medium["pointBackgroundColor"]="rgba(201, 120, 12, 1)"
medium["x"] = stateData[item].impact;
medium["y"] = stateData[item].occurrence;
dataSet.push(medium);
}
if (stateData[item].horizon === "Long-term") {
long["label"] = "Long-Term";
long["pointBackgroundColor"]="rgba(201, 120, 12, 1)"
long["x"] = stateData[item].impact;
long["y"] = stateData[item].occurrence;
dataSet.push(long);
}
});
const data = {
datasets: [
{
data: dataSet,
}
]
};
const options = {
title: {
display: true,
text: "Risks"
},
scales: {
xAxes: [
{
ticks: {
max: 10,
min: 0,
stepSize: 0.5
}
}
],
yAxes: [
{
ticks: {
max: 10,
min: 0,
stepSize: 0.5
}
}
]
}
};
return (
<div className="w-full h-9/12">
<div className="chartjs-wrapper">
<Scatter data={data} options={options} />
</div>
</div>
);
}
上面的代码是我试图做的是使用chartjs绘制散点图并根据数据有条件地渲染pointbackground颜色,无论数据属于短期还是长期或中期,但我无法给出不同的颜色这些不同的术语可以请任何人帮助我吗