feat: canvas to echarts #5

Merged
frederic merged 13 commits from canvas-to-echarts into main 2026-02-16 00:33:58 +01:00
5 changed files with 1033 additions and 403 deletions
Showing only changes of commit 5180c121c4 - Show all commits
-1
View File
@@ -7,7 +7,6 @@ export {
getDates, getDates,
getValues, getValues,
getInt64Values, getInt64Values,
extractValues,
unitToDisplayString unitToDisplayString
} from './weather'; } from './weather';
+8 -2
View File
@@ -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
+4 -4
View File
@@ -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(
+5 -6
View File
@@ -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