Im trying to create a 2 dimensional heatmap with only javascript using react. Im really lost as how to possibly do it. Appologies for the code, but this is where Im at, not understanding how I can do it. Would be very helpful of some tips on how to approach this.
const data = [
{y: "jan", y: 2020, value: "bad"},
{y: "feb", y: 2020, value: "good"},
{y: "mar", y: 2020, value: "bad"},
{y: "apr", y: 2020, value: "bad"},
{y: "jan", y: 2021, value: "bad"},
{y: "feb", y: 2021, value: "good"},
{y: "mar", y: 2021, value: "bad"},
{y: "apr", y: 2021, value: "good"},
{y: "may", y: 2021, value: "good"},
{y: "mar", y: 2022, value: "bad"},
{y: "apr", y: 2023, value: "bad"},
];
const xAxis = ["jan", "feb", "mar", "apr", "may"];
const yAxis = data.map(item => item.y);
const App = () => {
return (
<div>
{months.map(month => {
return years.map(year=> {
return <div><h1>year</h1></div>
})
})}
</div>
)
}