49 lines
996 B
JavaScript
49 lines
996 B
JavaScript
const colorBar = [
|
|
"#7272FF",
|
|
"#8585FF",
|
|
"#fff",
|
|
"#FFAFAF",
|
|
"#FF9C9C",
|
|
"#FF8787",
|
|
"#FF7474",
|
|
"#FF6060",
|
|
"#FF4B4B",
|
|
"#FE3838",
|
|
"#FF2323",
|
|
];
|
|
|
|
function Legend() {
|
|
return (
|
|
<div className="legend">
|
|
<div className="legend-title"></div>
|
|
<div className="colorbar">
|
|
{colorBar.map((color, index) => {
|
|
return (
|
|
<div
|
|
key={`colorbar-item-${index}`}
|
|
className="colorbar-item"
|
|
style={{ backgroundColor: color }}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
<div className="legend-text">
|
|
{[-0.02, -0.01, 0.01, 0.02, 0.03, 0.05, 0.1, 0.15, 0.2, 0.25, ""].map(
|
|
(item, index) => {
|
|
return (
|
|
<div
|
|
key={`legend-text-item-${index}`}
|
|
className="legend-text-item"
|
|
>
|
|
{item}
|
|
</div>
|
|
);
|
|
}
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Legend;
|