feat: canvas to echarts #5
@@ -7,7 +7,6 @@ export {
|
|||||||
getDates,
|
getDates,
|
||||||
getValues,
|
getValues,
|
||||||
getInt64Values,
|
getInt64Values,
|
||||||
extractValues,
|
|
||||||
unitToDisplayString
|
unitToDisplayString
|
||||||
} from './weather';
|
} from './weather';
|
||||||
|
|
||||||
|
|||||||
@@ -175,6 +175,8 @@ export interface WeekHourlyData {
|
|||||||
winddirection_10m: number[];
|
winddirection_10m: number[];
|
||||||
cloud_cover: number[];
|
cloud_cover: number[];
|
||||||
relative_humidity_2m: number[];
|
relative_humidity_2m: number[];
|
||||||
|
apparent_temperature: number[];
|
||||||
|
dew_point_2m: number[];
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface WeekDailyData {
|
export interface WeekDailyData {
|
||||||
@@ -259,7 +261,9 @@ const WEEK_HOURLY_VARS = [
|
|||||||
'wind_speed_10m',
|
'wind_speed_10m',
|
||||||
'wind_direction_10m',
|
'wind_direction_10m',
|
||||||
'cloud_cover',
|
'cloud_cover',
|
||||||
'relative_humidity_2m'
|
'relative_humidity_2m',
|
||||||
|
'apparent_temperature',
|
||||||
|
'dew_point_2m'
|
||||||
] as const;
|
] as const;
|
||||||
|
|
||||||
const WEEK_DAILY_VARS = [
|
const WEEK_DAILY_VARS = [
|
||||||
@@ -324,7 +328,9 @@ export async function fetchWeekForecast(params: WeekForecastParams): Promise<Wee
|
|||||||
windspeed_10m: getValues(hourlyBlock.variables(4)!),
|
windspeed_10m: getValues(hourlyBlock.variables(4)!),
|
||||||
winddirection_10m: getValues(hourlyBlock.variables(5)!),
|
winddirection_10m: getValues(hourlyBlock.variables(5)!),
|
||||||
cloud_cover: getValues(hourlyBlock.variables(6)!),
|
cloud_cover: getValues(hourlyBlock.variables(6)!),
|
||||||
relative_humidity_2m: getValues(hourlyBlock.variables(7)!)
|
relative_humidity_2m: getValues(hourlyBlock.variables(7)!),
|
||||||
|
apparent_temperature: getValues(hourlyBlock.variables(8)!),
|
||||||
|
dew_point_2m: getValues(hourlyBlock.variables(9)!)
|
||||||
};
|
};
|
||||||
|
|
||||||
// Daily: variables are in the same order as WEEK_DAILY_VARS
|
// Daily: variables are in the same order as WEEK_DAILY_VARS
|
||||||
|
|||||||
@@ -8,10 +8,10 @@ export default (
|
|||||||
): void => {
|
): void => {
|
||||||
if (ctx && series) {
|
if (ctx && series) {
|
||||||
const tempGradientFill = ctx.createLinearGradient(0, 0, 0, config.maxY);
|
const tempGradientFill = ctx.createLinearGradient(0, 0, 0, config.maxY);
|
||||||
tempGradientFill.addColorStop(0, getColor(config.maxTemp.toFixed(0), unit) + '5c');
|
tempGradientFill.addColorStop(0, getColor(config.maxTemp, unit) + '5c');
|
||||||
tempGradientFill.addColorStop(0.25, getColor(config.maxTemp.toFixed(0), unit) + '5c');
|
tempGradientFill.addColorStop(0.25, getColor(config.maxTemp, unit) + '5c');
|
||||||
tempGradientFill.addColorStop(0.85, getColor(config.minTemp.toFixed(0), unit) + '06');
|
tempGradientFill.addColorStop(0.85, getColor(config.minTemp, unit) + '06');
|
||||||
tempGradientFill.addColorStop(1, getColor(config.minTemp.toFixed(0), unit) + '00');
|
tempGradientFill.addColorStop(1, getColor(config.minTemp, unit) + '00');
|
||||||
|
|
||||||
ctx.beginPath();
|
ctx.beginPath();
|
||||||
ctx.moveTo(
|
ctx.moveTo(
|
||||||
|
|||||||
@@ -25,19 +25,18 @@ export function rgbToHex(rgb: string) {
|
|||||||
return hex;
|
return hex;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const getColor = (tempString: string, unit = 'celsius'): string => {
|
export const getColor = (temperature: number, unit = 'celsius'): string => {
|
||||||
let index = 0;
|
let index = 0;
|
||||||
const temp = Number(tempString);
|
|
||||||
if (unit === 'celsius') {
|
if (unit === 'celsius') {
|
||||||
if (temp <= -40) {
|
if (temperature <= -40) {
|
||||||
index = 0;
|
index = 0;
|
||||||
} else if (temp >= 60) {
|
} else if (temperature >= 60) {
|
||||||
index = colorScaleHex.length - 1;
|
index = colorScaleHex.length - 1;
|
||||||
} else {
|
} else {
|
||||||
index = temp + 40;
|
index = temperature + 40;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
const tempInCelsius = Math.round(((temp - 32) * 5) / 9);
|
const tempInCelsius = Math.round(((temperature - 32) * 5) / 9);
|
||||||
if (tempInCelsius <= -40) {
|
if (tempInCelsius <= -40) {
|
||||||
index = 0;
|
index = 0;
|
||||||
} else if (tempInCelsius >= 60) {
|
} else if (tempInCelsius >= 60) {
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user