public/singapore_rain_radar
1
0
Fork 0
mirror of https://git.roussel.pro/public-website/singapore_rain_radar.git synced 2026-02-09 02:20:17 +01:00
Code Issues Packages Projects Releases Wiki Activity

added progress bar, fix #5

Browse Source
This commit is contained in:
Quentin Roussel
2025-09-19 18:23:55 +08:00
parent 900b09bbbf
commit c8b32e1986
1 changed files with 13 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
video.mjs
View File

@@ -2,22 +2,29 @@ import { createCanvas, loadImage } from 'canvas';
import fs from 'fs'; import fs from 'fs';
import { exec } from 'child_process'; import { exec } from 'child_process';
async function overlayImage(time_string) { async function overlayImage(time_string, index, total) {
let ctx = createCanvas(853, 479).getContext('2d'); let imageHeight = 479;
let imageWidth = 853;
let ctx = createCanvas(imageWidth, imageHeight).getContext('2d');
let bg = await loadImage('bg.png') let bg = await loadImage('bg.png')
ctx.globalAlpha = 1; ctx.globalAlpha = 1;
ctx.drawImage(bg, 0, 0, 853, 479) ctx.drawImage(bg, 0, 0, imageWidth, imageHeight)
let overlay = await loadImage('images/raw/' + time_string + '.png') let overlay = await loadImage('images/raw/' + time_string + '.png')
ctx.globalAlpha = 0.6; ctx.globalAlpha = 0.6;
ctx.drawImage(overlay, 0, 0, 853, 479) ctx.drawImage(overlay, 0, 0, imageWidth, imageHeight)
let text = time_string.substring(8, 10) + ':' + time_string.substring(10, 12); let text = time_string.substring(8, 10) + ':' + time_string.substring(10, 12);
ctx.font = 'bold 70px sans-serif'; ctx.font = 'bold 70px sans-serif';
ctx.fillStyle = 'rgba(0,0,0,0.7)'; ctx.fillStyle = 'rgba(0,0,0,0.7)';
ctx.globalAlpha = 0.9; ctx.globalAlpha = 0.9;
ctx.fillText(text, 853 - 250, 479 - 40); ctx.fillText(text, imageWidth - 250, imageHeight - 40);
ctx.fillStyle = 'rgba(56, 64, 219, 0.7)';
console.log(index, total);
ctx.fillRect(0, imageHeight - 20, imageWidth * (index / total) , 20);
return ctx.canvas.toBuffer("image/png"); return ctx.canvas.toBuffer("image/png");
} }
@@ -32,7 +39,7 @@ async function generateFinalImages() {
let i = 0; let i = 0;
for (let file of files) { for (let file of files) {
let time_string = file.split('.')[0]; let time_string = file.split('.')[0];
let final_image = await overlayImage(time_string); let final_image = await overlayImage(time_string, i, files.length - 1);
fs.writeFileSync(`images/final/${i}.png`, final_image); fs.writeFileSync(`images/final/${i}.png`, final_image);
i++; i++;
} }