lifning/ws4kp
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

process images

Browse source
This commit is contained in:
Matt Walsh 2020-12-29 15:26:58 -06:00
parent a9d0968e28
commit f409576fa7
5 changed files with 77 additions and 120 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
gulp/update-vendor.js
View file

@ -1,3 +1,4 @@
/* eslint-disable import/no-extraneous-dependencies */
const gulp = require('gulp'); const gulp = require('gulp');
const del = require('del'); const del = require('del');
const rename = require('gulp-rename'); const rename = require('gulp-rename');
@ -7,15 +8,16 @@ const clean = (cb) => {
cb(); cb();
}; };
const vendor_files = [ const vendorFiles = [
'./node_modules/luxon/build/global/luxon.js', './node_modules/luxon/build/global/luxon.js',
'./node_modules/luxon/build/global/luxon.js.map',
'./node_modules/nosleep.js/dist/NoSleep.js', './node_modules/nosleep.js/dist/NoSleep.js',
'./node_modules/jquery/dist/jquery.js', './node_modules/jquery/dist/jquery.js',
'./node_modules/suncalc/suncalc.js', './node_modules/suncalc/suncalc.js',
'./node_modules/swiped-events/src/swiped-events.js', './node_modules/swiped-events/src/swiped-events.js',
]; ];
const copy = () => gulp.src(vendor_files) const copy = () => gulp.src(vendorFiles)
.pipe(rename((path) => { .pipe(rename((path) => {
path.dirname = path.dirname.toLowerCase(); path.dirname = path.dirname.toLowerCase();
path.basename = path.basename.toLowerCase(); path.basename = path.basename.toLowerCase();
@ -23,5 +25,4 @@ const copy = () => gulp.src(vendor_files)
})) }))
.pipe(gulp.dest('./server/scripts/vendor/auto')); .pipe(gulp.dest('./server/scripts/vendor/auto'));
module.exports = gulp.series(clean, copy); module.exports = gulp.series(clean, copy);

177
server/scripts/modules/radar.js
View file

@ -55,12 +55,12 @@ class Radar extends WeatherDisplay {
this.baseMap = await utils.image.load(src); this.baseMap = await utils.image.load(src);
const baseUrl = 'https://mesonet.agron.iastate.edu/archive/data/'; const baseUrl = 'https://mesonet.agron.iastate.edu/archive/data/';
const baseUrlEnd = '/GIS/uscomp'; const baseUrlEnd = '/GIS/uscomp/';
const baseUrls = []; const baseUrls = [];
let date = DateTime.utc().minus({ days: 1 }).startOf('day'); let date = DateTime.utc().minus({ days: 1 }).startOf('day');
// make urls for yesterday, today and tomorrow // make urls for yesterday and today
while (date <= DateTime.utc().plus({ days: 1 }).startOf('day')) { while (date <= DateTime.utc().startOf('day')) {
baseUrls.push(`${baseUrl}${date.toFormat('yyyy/LL/dd')}${baseUrlEnd}`); baseUrls.push(`${baseUrl}${date.toFormat('yyyy/LL/dd')}${baseUrlEnd}`);
date = date.plus({ days: 1 }); date = date.plus({ days: 1 });
} }
@ -87,44 +87,27 @@ class Radar extends WeatherDisplay {
base.href = baseUrls[htmlIdx]; base.href = baseUrls[htmlIdx];
xmlDoc.head.append(base); xmlDoc.head.append(base);
const anchors = xmlDoc.getElementsByTagName('a'); const anchors = xmlDoc.getElementsByTagName('a');
const gifs = []; const urls = [];
for (const idx in anchors) { Array.from(anchors).forEach((elem) => {
if (anchors[idx].innerHTML?.includes('png') && anchors[idx].innerHTML?.includes('n0r_')) { if (elem.innerHTML?.includes('.png') && elem.innerHTML?.includes('n0r_')) {
gifs.push(anchors[idx].href); urls.push(elem.href);
} }
} });
return gifs; return urls;
}).flat(); }).flat();
// filter for selected urls
let filter = /Conus_\d/;
if (weatherParameters.state === 'HI') filter = /hawaii_\d/;
// get the last few images // get the last few images
const urlsFull = gifs.filter((gif) => gif && gif.match(filter)); const sortedPngs = pngs.sort((a, b) => (Date(a) < Date(b) ? -1 : 1));
const urls = urlsFull.slice(-(this.dopplerRadarImageMax - 1)); const urls = sortedPngs.slice(-(this.dopplerRadarImageMax));
// add additional 'latest.gif'
if (weatherParameters.state !== 'HI') urls.push('latest_radaronly.gif');
if (weatherParameters.state === 'HI') urls.push('hawaii_radaronly.gif');
// calculate offsets and sizes // calculate offsets and sizes
let offsetX = 120; let offsetX = 120;
let offsetY = 69; let offsetY = 69;
let sourceXY; const width = 2550;
let width; const height = 1600;
let height;
if (weatherParameters.State === 'HI') {
width = 600;
height = 571;
sourceXY = this.getXYFromLatitudeLongitudeHI(weatherParameters.latitude, weatherParameters.longitude, offsetX, offsetY);
} else {
width = 2550;
height = 1600;
offsetX *= 2; offsetX *= 2;
offsetY *= 2; offsetY *= 2;
sourceXY = this.getXYFromLatitudeLongitudeDoppler(weatherParameters.latitude, weatherParameters.longitude, offsetX, offsetY); const sourceXY = Radar.getXYFromLatitudeLongitudeMap(weatherParameters, offsetX, offsetY);
}
// create working context for manipulation // create working context for manipulation
const workingCanvas = document.createElement('canvas'); const workingCanvas = document.createElement('canvas');
@ -134,19 +117,11 @@ class Radar extends WeatherDisplay {
workingContext.imageSmoothingEnabled = false; workingContext.imageSmoothingEnabled = false;
// calculate radar offsets // calculate radar offsets
let radarOffsetX = 117; const radarOffsetX = 120;
let radarOffsetY = 60; const radarOffsetY = 70;
let radarSourceXY = this.getXYFromLatitudeLongitudeDoppler(weatherParameters.latitude, weatherParameters.longitude, offsetX, offsetY); const radarSourceXY = Radar.getXYFromLatitudeLongitudeDoppler(weatherParameters, offsetX, offsetY);
let radarSourceX = radarSourceXY.x / 2; const radarSourceX = radarSourceXY.x / 2;
let radarSourceY = radarSourceXY.y / 2; const radarSourceY = radarSourceXY.y / 2;
if (weatherParameters.State === 'HI') {
radarOffsetX = 120;
radarOffsetY = 69;
radarSourceXY = this.getXYFromLatitudeLongitudeHI(weatherParameters.latitude, weatherParameters.longitude, offsetX, offsetY);
radarSourceX = radarSourceXY.x;
radarSourceY = radarSourceXY.y;
}
// Load the most recent doppler radar images. // Load the most recent doppler radar images.
const radarInfo = await Promise.all(urls.map(async (url) => { const radarInfo = await Promise.all(urls.map(async (url) => {
@ -158,7 +133,7 @@ class Radar extends WeatherDisplay {
context.imageSmoothingEnabled = false; context.imageSmoothingEnabled = false;
// get the image // get the image
const response = await fetch(utils.cors.rewriteUrl(baseUrl + url)); const response = await fetch(utils.cors.rewriteUrl(url));
// test response // test response
if (!response.ok) throw new Error(`Unable to fetch radar error ${response.status} ${response.statusText} from ${response.url}`); if (!response.ok) throw new Error(`Unable to fetch radar error ${response.status} ${response.statusText} from ${response.url}`);
@ -167,7 +142,7 @@ class Radar extends WeatherDisplay {
const blob = await response.blob(); const blob = await response.blob();
// store the time // store the time
const timeMatch = url.match(/_(\d{4})(\d\d)(\d\d)_(\d\d)(\d\d)_/); const timeMatch = url.match(/_(\d{4})(\d\d)(\d\d)(\d\d)(\d\d)\./);
let time; let time;
if (timeMatch) { if (timeMatch) {
const [, year, month, day, hour, minute] = timeMatch; const [, year, month, day, hour, minute] = timeMatch;
@ -187,13 +162,9 @@ class Radar extends WeatherDisplay {
const imgBlob = await utils.image.load(blob); const imgBlob = await utils.image.load(blob);
// draw the entire image // draw the entire image
if (weatherParameters.State === 'HI') {
workingContext.clearRect(0, 0, 571, 600); workingContext.clearRect(0, 0, width, 1600);
workingContext.drawImage(imgBlob, 0, 0, 571, 600); workingContext.drawImage(imgBlob, 0, 0, width, 1600);
} else {
workingContext.clearRect(0, 0, 2550, 1600);
workingContext.drawImage(imgBlob, 0, 0, 2550, 1600);
}
// get the base map // get the base map
context.drawImage(await this.baseMap, sourceXY.x, sourceXY.y, offsetX * 2, offsetY * 2, 0, 0, 640, 367); context.drawImage(await this.baseMap, sourceXY.x, sourceXY.y, offsetX * 2, offsetY * 2, 0, 0, 640, 367);
@ -206,10 +177,10 @@ class Radar extends WeatherDisplay {
cropContext.imageSmoothingEnabled = false; cropContext.imageSmoothingEnabled = false;
cropContext.drawImage(workingCanvas, radarSourceX, radarSourceY, (radarOffsetX * 2), (radarOffsetY * 2.33), 0, 0, 640, 367); cropContext.drawImage(workingCanvas, radarSourceX, radarSourceY, (radarOffsetX * 2), (radarOffsetY * 2.33), 0, 0, 640, 367);
// clean the image // clean the image
this.removeDopplerRadarImageNoise(cropContext); Radar.removeDopplerRadarImageNoise(cropContext);
// merge the radar and map // merge the radar and map
this.mergeDopplerRadarImage(context, cropContext); Radar.mergeDopplerRadarImage(context, cropContext);
return { return {
canvas, canvas,
@ -256,63 +227,38 @@ class Radar extends WeatherDisplay {
this.finishDraw(); this.finishDraw();
} }
// utility latitude/pixel conversions static getXYFromLatitudeLongitudeMap(pos, offsetX, offsetY) {
getXYFromLatitudeLongitude(Latitude, Longitude, OffsetX, OffsetY, state) {
if (state === 'HI') return this.getXYFromLatitudeLongitudeHI(...arguments);
let y = 0; let y = 0;
let x = 0; let x = 0;
const ImgHeight = 1600; const imgHeight = 3200;
const ImgWidth = 2550; const imgWidth = 5100;
y = (51.75 - pos.latitude) * 55.2;
// center map
y -= offsetY;
y = (50.5 - Latitude) * 55.2;
y -= OffsetY; // Centers map.
// Do not allow the map to exceed the max/min coordinates. // Do not allow the map to exceed the max/min coordinates.
if (y > (ImgHeight - (OffsetY * 2))) { if (y > (imgHeight - (offsetY * 2))) {
y = ImgHeight - (OffsetY * 2); y = imgHeight - (offsetY * 2);
} else if (y < 0) { } else if (y < 0) {
y = 0; y = 0;
} }
x = ((-127.5 - Longitude) * 41.775) * -1; x = ((-130.37 - pos.longitude) * 41.775) * -1;
x -= OffsetX; // Centers map. // center map
x -= offsetX;
// Do not allow the map to exceed the max/min coordinates. // Do not allow the map to exceed the max/min coordinates.
if (x > (ImgWidth - (OffsetX * 2))) { if (x > (imgWidth - (offsetX * 2))) {
x = ImgWidth - (OffsetX * 2); x = imgWidth - (offsetX * 2);
} else if (x < 0) { } else if (x < 0) {
x = 0; x = 0;
} }
return { x, y }; return { x: x * 2, y: y * 2 };
} }
static getXYFromLatitudeLongitudeHI(Latitude, Longitude, OffsetX, OffsetY) { static getXYFromLatitudeLongitudeDoppler(pos, offsetX, offsetY) {
let y = 0;
let x = 0;
const ImgHeight = 571;
const ImgWidth = 600;
y = (25 - Latitude) * 55.2;
y -= OffsetY; // Centers map.
// Do not allow the map to exceed the max/min coordinates.
if (y > (ImgHeight - (OffsetY * 2))) {
y = ImgHeight - (OffsetY * 2);
} else if (y < 0) {
y = 0;
}
x = ((-164.5 - Longitude) * 41.775) * -1;
x -= OffsetX; // Centers map.
// Do not allow the map to exceed the max/min coordinates.
if (x > (ImgWidth - (OffsetX * 2))) {
x = ImgWidth - (OffsetX * 2);
} else if (x < 0) {
x = 0;
}
return { x, y };
}
static GetXYFromLatitudeLongitudeDoppler(pos, offsetX, offsetY) {
let y = 0; let y = 0;
let x = 0; let x = 0;
const imgHeight = 6000; const imgHeight = 6000;
@ -353,61 +299,68 @@ class Radar extends WeatherDisplay {
// i + 1 = green // i + 1 = green
// i + 2 = blue // i + 2 = blue
// i + 3 = alpha (0 = transparent, 255 = opaque) // i + 3 = alpha (0 = transparent, 255 = opaque)
let [R, G, B, A] = RadarImageData.data.slice(i, i + 4); let R = RadarImageData.data[i];
let G = RadarImageData.data[i + 1];
let B = RadarImageData.data[i + 2];
let A = RadarImageData.data[i + 3];
// is this pixel the old rgb? // is this pixel the old rgb?
if ((R === 1 && G === 159 && B === 244) if ((R === 0 && G === 0 && B === 0)
|| (R >= 200 && G >= 200 && B >= 200) || (R === 0 && G === 236 && B === 236)
|| (R === 4 && G === 233 && B === 231) || (R === 1 && G === 160 && B === 246)
|| (R === 3 && G === 0 && B === 244)) { || (R === 0 && G === 0 && B === 246)) {
// change to your new rgb
// Transparent // Transparent
R = 0; R = 0;
G = 0; G = 0;
B = 0; B = 0;
A = 0; A = 0;
} else if (R === 2 && G === 253 && B === 2) { } else if ((R === 0 && G === 255 && B === 0)) {
// Light Green 1 // Light Green 1
R = 49; R = 49;
G = 210; G = 210;
B = 22; B = 22;
A = 255; A = 255;
} else if (R === 1 && G === 197 && B === 1) { } else if ((R === 0 && G === 200 && B === 0)) {
// Light Green 2 // Light Green 2
R = 0; R = 0;
G = 142; G = 142;
B = 0; B = 0;
A = 255; A = 255;
} else if (R === 0 && G === 142 && B === 0) { } else if ((R === 0 && G === 144 && B === 0)) {
// Dark Green 1 // Dark Green 1
R = 20; R = 20;
G = 90; G = 90;
B = 15; B = 15;
A = 255; A = 255;
} else if (R === 253 && G === 248 && B === 2) { } else if ((R === 255 && G === 255 && B === 0)) {
// Dark Green 2 // Dark Green 2
R = 10; R = 10;
G = 40; G = 40;
B = 10; B = 10;
A = 255; A = 255;
} else if (R === 229 && G === 188 && B === 0) { } else if ((R === 231 && G === 192 && B === 0)) {
// Yellow // Yellow
R = 196; R = 196;
G = 179; G = 179;
B = 70; B = 70;
A = 255; A = 255;
} else if (R === 253 && G === 139 && B === 0) { } else if ((R === 255 && G === 144 && B === 0)) {
// Orange // Orange
R = 190; R = 190;
G = 72; G = 72;
B = 19; B = 19;
A = 255; A = 255;
} else if (R === 212 && G === 0 && B === 0) { } else if ((R === 214 && G === 0 && B === 0)
|| (R === 255 && G === 0 && B === 0)) {
// Red // Red
R = 171; R = 171;
G = 14; G = 14;
B = 14; B = 14;
A = 255; A = 255;
} else if (R === 188 && G === 0 && B === 0) { } else if ((R === 192 && G === 0 && B === 0)
|| (R === 255 && G === 0 && B === 255)) {
// Brown // Brown
R = 115; R = 115;
G = 31; G = 31;
@ -415,15 +368,15 @@ class Radar extends WeatherDisplay {
A = 255; A = 255;
} }
// store new values
RadarImageData.data[i] = R; RadarImageData.data[i] = R;
RadarImageData.data[i + 1] = G; RadarImageData.data[i + 1] = G;
RadarImageData.data[i + 2] = B; RadarImageData.data[i + 2] = B;
RadarImageData.data[i + 3] = A; RadarImageData.data[i + 3] = A;
} }
// rewrite the image
RadarContext.putImageData(RadarImageData, 0, 0); RadarContext.putImageData(RadarImageData, 0, 0);
// MapContext.drawImage(RadarContext.canvas, 0, 0);
} }
static mergeDopplerRadarImage(mapContext, radarContext) { static mergeDopplerRadarImage(mapContext, radarContext) {

1
server/scripts/vendor/auto/luxon.js.map vendored Normal file
View file

File diff suppressed because one or more lines are too long

2
version.js
View file

@ -1 +1 @@
module.exports = '3.8.5'; module.exports = '4.0.0';

4
ws4kp.code-workspace
View file

@ -18,6 +18,7 @@
"'storm", "'storm",
"Battaglia", "Battaglia",
"Noaa", "Noaa",
"Pngs",
"T", "T",
"T'storm", "T'storm",
"Visib", "Visib",
@ -25,7 +26,8 @@
"devbridge", "devbridge",
"ltrim", "ltrim",
"nosleep", "nosleep",
"rtrim" "rtrim",
"uscomp"
], ],
"cSpell.ignorePaths": [ "cSpell.ignorePaths": [
"**/package-lock.json", "**/package-lock.json",