1
0

Update graph colours

This commit is contained in:
2024-08-14 19:29:32 +10:00
parent a6a1fe0a76
commit b32b18adc6
2 changed files with 13 additions and 14 deletions
@@ -27,12 +27,11 @@ const createChartOptions = ({
stacked: false, stacked: false,
title: { title: {
display: true, display: true,
/*text: `5 Day ${ text: `5-Day ${
altMode altMode
? `Wind Speed / Precipitation (${lengthUnit})` ? `Wind / Rain (${lengthUnit})`
: `Temp / Precipitation` : `Temperature / Rain (%)`
}`,*/ }`,
text: "Five-Day Forecast",
fontColor: fontColor(darkMode), fontColor: fontColor(darkMode),
fontFamily: "Rubik, sans-serif", fontFamily: "Rubik, sans-serif",
}, },
@@ -89,6 +88,7 @@ const chartColors = {
blue: "rgba(63, 127, 191, 0.5)", blue: "rgba(63, 127, 191, 0.5)",
gray: "rgba(127, 127, 127, 0.5)", gray: "rgba(127, 127, 127, 0.5)",
orange: "rgba(226, 99, 71)", orange: "rgba(226, 99, 71)",
white: "rgba(255, 255, 255)",
}; };
const mapChartData = ({ const mapChartData = ({
@@ -122,8 +122,8 @@ const mapChartData = ({
: convertTemp(temperature, tempUnit); : convertTemp(temperature, tempUnit);
}), }),
yAxisID: "y-axis-1", yAxisID: "y-axis-1",
borderColor: chartColors.orange, borderColor: altMode ? chartColors.gray : chartColors.orange,
backgroundColor: chartColors.orange, backgroundColor: altMode ? chartColors.gray : chartColors.orange,
fill: false, fill: false,
}, },
{ {
@@ -27,12 +27,11 @@ const chartOptions = ({
stacked: false, stacked: false,
title: { title: {
display: true, display: true,
/*text: `24 Hour ${ text: `24-Hour ${
altMode altMode
? `Wind Speed / Precipitation (${lengthUnit})` ? `Wind / Rain (${lengthUnit})`
: `Temp / Precipitation` : `Temperature / Rain (%)`
}`,*/ }`,
text: "24-hour Forecast",
fontColor: fontColor(darkMode), fontColor: fontColor(darkMode),
fontFamily: "Rubik, sans-serif", fontFamily: "Rubik, sans-serif",
}, },
@@ -127,8 +126,8 @@ const mapChartData = ({
: convertTemp(temperature, tempUnit); : convertTemp(temperature, tempUnit);
}), }),
yAxisID: "y-axis-1", yAxisID: "y-axis-1",
borderColor: chartColors.orange, borderColor: altMode ? chartColors.gray : chartColors.orange,
backgroundColor: chartColors.orange, backgroundColor: altMode ? chartColors.gray : chartColors.orange,
fill: false, fill: false,
}, },
{ {