autumnplot-gl 2.1.0 → 2.2.0

package/lib/RawField.js

@@ -1,19 +1,8 @@
-import { lambertConformalConic } from "./Map";
+import { Float16Array } from "@petamoriken/float16";
+import { lambertConformalConic, rotateSphere } from "./Map";
 import { layer_worker } from "./PlotComponent";
-import { zip } from "./utils";
+import { Cache, zip } from "./utils";
 import { WGLBuffer } from "autumn-wgl";
-class Cache {
-    constructor(compute_value) {
-        this.cached_value = null;
-        this.compute_value = compute_value;
-    }
-    getValue(...args) {
-        if (this.cached_value === null) {
-            this.cached_value = this.compute_value(...args);
-        }
-        return this.cached_value;
-    }
-}
 async function makeWGLDomainBuffers(gl, grid, native_grid) {
     native_grid = native_grid !== undefined ? native_grid : grid;
     const texcoord_margin_r = 1 / (2 * native_grid.ni);
@@ -42,20 +31,20 @@ class Grid {
         this.is_conformal = is_conformal;
         this.ni = ni;
         this.nj = nj;
-        this._buffer_cache = new Cache((gl) => {
+        this.buffer_cache = new Cache((gl) => {
             const new_ni = Math.max(Math.floor(this.ni / 50), 20);
             const new_nj = Math.max(Math.floor(this.nj / 50), 20);
             return makeWGLDomainBuffers(gl, this.copy({ ni: new_ni, nj: new_nj }), this);
         });
-        this._billboard_buffer_cache = new Cache((gl, thin_fac, max_zoom) => {
+        this.billboard_buffer_cache = new Cache((gl, thin_fac, max_zoom) => {
             return makeWGLBillboardBuffers(gl, this, thin_fac, max_zoom);
         });
     }
     async getWGLBuffers(gl) {
-        return await this._buffer_cache.getValue(gl);
+        return await this.buffer_cache.getValue(gl);
     }
     async getWGLBillboardBuffers(gl, thin_fac, max_zoom) {
-        return await this._billboard_buffer_cache.getValue(gl, thin_fac, max_zoom);
+        return await this.billboard_buffer_cache.getValue(gl, thin_fac, max_zoom);
     }
 }
 /** A plate carree (a.k.a. lat/lon) grid with uniform grid spacing */
@@ -75,7 +64,7 @@ class PlateCarreeGrid extends Grid {
         this.ll_lat = ll_lat;
         this.ur_lon = ur_lon;
         this.ur_lat = ur_lat;
-        this._ll_cache = new Cache(() => {
+        this.ll_cache = new Cache(() => {
             const dlon = (this.ur_lon - this.ll_lon) / (this.ni - 1);
             const dlat = (this.ur_lat - this.ll_lat) / (this.nj - 1);
             const lons = new Float32Array(this.ni * this.nj);
@@ -104,7 +93,7 @@ class PlateCarreeGrid extends Grid {
      * Get a list of longitudes and latitudes on the grid (internal method)
      */
     getCoords() {
-        return this._ll_cache.getValue();
+        return this.ll_cache.getValue();
     }
     transform(x, y, opts) {
         return [x, y];
@@ -123,6 +112,81 @@ class PlateCarreeGrid extends Grid {
         return new PlateCarreeGrid(ni, nj, ll_lon, ll_lat, ur_lon, ur_lat);
     }
 }
+/** A rotated lat-lon (plate carree) grid with uniform grid spacing */
+class PlateCarreeRotatedGrid extends Grid {
+    /**
+     * Create a Lambert conformal conic grid
+     * @param ni        - The number of grid points in the i (longitude) direction
+     * @param nj        - The number of grid points in the j (latitude) direction
+     * @param np_lon    - The longitude of the north pole for the rotated grid
+     * @param np_lat    - The latitude of the north pole for the rotated grid
+     * @param lon_shift - The angle around the rotated north pole to shift the central meridian
+     * @param ll_lon    - The longitude of the lower left corner of the grid (on the rotated earth)
+     * @param ll_lat    - The latitude of the lower left corner of the grid (on the rotated earth)
+     * @param ur_lon    - The longitude of the upper right corner of the grid (on the rotated earth)
+     * @param ur_lat    - The latitude of the upper right corner of the grid (on the rotated earth)
+     */
+    constructor(ni, nj, np_lon, np_lat, lon_shift, ll_lon, ll_lat, ur_lon, ur_lat) {
+        super('latlonrot', true, ni, nj);
+        this.np_lon = np_lon;
+        this.np_lat = np_lat;
+        this.lon_shift = lon_shift;
+        this.ll_lon = ll_lon;
+        this.ll_lat = ll_lat;
+        this.ur_lon = ur_lon;
+        this.ur_lat = ur_lat;
+        this.llrot = rotateSphere({ np_lon: np_lon, np_lat: np_lat, lon_shift: lon_shift });
+        this.ll_cache = new Cache(() => {
+            const lons = new Float32Array(this.ni * this.nj);
+            const lats = new Float32Array(this.ni * this.nj);
+            for (let i = 0; i < this.ni; i++) {
+                const lon_p = this.ll_lon + (this.ur_lon - this.ll_lon) * i / (this.ni - 1);
+                for (let j = 0; j < this.nj; j++) {
+                    const lat_p = this.ll_lat + (this.ur_lat - this.ll_lat) * j / (this.nj - 1);
+                    const [lon, lat] = this.llrot(lon_p, lat_p);
+                    const idx = i + j * this.ni;
+                    lons[idx] = lon;
+                    lats[idx] = lat;
+                }
+            }
+            return { lons: lons, lats: lats };
+        });
+    }
+    copy(opts) {
+        opts = opts !== undefined ? opts : {};
+        const ni = opts.ni !== undefined ? opts.ni : this.ni;
+        const nj = opts.nj !== undefined ? opts.nj : this.nj;
+        const ll_lon = opts.ll_lon !== undefined ? opts.ll_lon : this.ll_lon;
+        const ll_lat = opts.ll_lat !== undefined ? opts.ll_lat : this.ll_lat;
+        const ur_lon = opts.ur_lon !== undefined ? opts.ur_lon : this.ur_lon;
+        const ur_lat = opts.ur_lat !== undefined ? opts.ur_lat : this.ur_lat;
+        return new PlateCarreeRotatedGrid(ni, nj, this.np_lon, this.np_lat, this.lon_shift, ll_lon, ll_lat, ur_lon, ur_lat);
+    }
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getCoords() {
+        return this.ll_cache.getValue();
+    }
+    transform(x, y, opts) {
+        opts = opts === undefined ? {} : opts;
+        const inverse = 'inverse' in opts ? opts.inverse : false;
+        return this.llrot(x, y, { inverse: !inverse });
+    }
+    getThinnedGrid(thin_x, thin_y) {
+        const dlon = (this.ur_lon - this.ll_lon) / this.ni;
+        const dlat = (this.ur_lat - this.ll_lat) / this.nj;
+        const ni = Math.ceil(this.ni / thin_x);
+        const nj = Math.ceil(this.nj / thin_y);
+        const ni_remove = (this.ni - 1) % thin_x;
+        const nj_remove = (this.nj - 1) % thin_y;
+        const ll_lon = this.ll_lon;
+        const ll_lat = this.ll_lat;
+        const ur_lon = this.ur_lon - ni_remove * dlon;
+        const ur_lat = this.ur_lat - nj_remove * dlat;
+        return new PlateCarreeRotatedGrid(ni, nj, this.np_lon, this.np_lat, this.lon_shift, ll_lon, ll_lat, ur_lon, ur_lat);
+    }
+}
 /** A Lambert conformal conic grid with uniform grid spacing */
 class LambertGrid extends Grid {
     /**
@@ -147,7 +211,7 @@ class LambertGrid extends Grid {
         this.ur_x = ur_x;
         this.ur_y = ur_y;
         this.lcc = lambertConformalConic({ lon_0: lon_0, lat_0: lat_0, lat_std: lat_std });
-        this._ll_cache = new Cache(() => {
+        this.ll_cache = new Cache(() => {
             const lons = new Float32Array(this.ni * this.nj);
             const lats = new Float32Array(this.ni * this.nj);
             for (let i = 0; i < this.ni; i++) {
@@ -177,7 +241,7 @@ class LambertGrid extends Grid {
      * Get a list of longitudes and latitudes on the grid (internal method)
      */
     getCoords() {
-        return this._ll_cache.getValue();
+        return this.ll_cache.getValue();
     }
     transform(x, y, opts) {
         opts = opts === undefined ? {} : opts;
@@ -198,6 +262,9 @@ class LambertGrid extends Grid {
         return new LambertGrid(ni, nj, this.lon_0, this.lat_0, this.lat_std, ll_x, ll_y, ur_x, ur_y);
     }
 }
+function getArrayConstructor(ary) {
+    return ary.constructor;
+}
 /** A class representing a raw 2D field of gridded data, such as height or u wind. */
 class RawScalarField {
     /**
@@ -212,9 +279,25 @@ class RawScalarField {
             throw `Data size (${data.length}) doesn't match the grid dimensions (${grid.ni} x ${grid.nj}; expected ${grid.ni * grid.nj} points)`;
         }
     }
+    /** @internal */
+    getTextureData() {
+        // Need to give float16 data as uint16s to make WebGL happy: https://github.com/petamoriken/float16/issues/105
+        let data;
+        if (this.data instanceof Float32Array) {
+            data = this.data;
+        }
+        else {
+            data = new Uint16Array(this.data.buffer);
+        }
+        return data;
+    }
+    isFloat16() {
+        return !(this.data instanceof Float32Array);
+    }
     getThinnedField(thin_x, thin_y) {
+        const arrayType = getArrayConstructor(this.data);
         const new_grid = this.grid.getThinnedGrid(thin_x, thin_y);
-        const new_data = new Float32Array(new_grid.ni * new_grid.nj);
+        const new_data = new arrayType(new_grid.ni * new_grid.nj);
         for (let i = 0; i < new_grid.ni; i++) {
             for (let j = 0; j < new_grid.nj; j++) {
                 const idx_old = i * thin_x + this.grid.ni * j * thin_y;
@@ -239,8 +322,9 @@ class RawScalarField {
                 yield func(elem);
             }
         }
+        const arrayType = getArrayConstructor(args[0].data);
         const zipped_args = zip(...args.map(a => a.data));
-        const agg_data = new Float32Array(mapGenerator(zipped_args, (a) => func(...a)));
+        const agg_data = new arrayType(mapGenerator(zipped_args, (a) => func(...a)));
         return new RawScalarField(args[0].grid, agg_data);
     }
 }
@@ -255,14 +339,15 @@ class RawVectorField {
      */
     constructor(grid, u, v, opts) {
         opts = opts === undefined ? {} : opts;
+        const arrayType = getArrayConstructor(u);
         this.u = new RawScalarField(grid, u);
         this.v = new RawScalarField(grid, v);
         this.relative_to = opts.relative_to === undefined ? 'grid' : opts.relative_to;
-        this._rotate_cache = new Cache(() => {
+        this.rotate_cache = new Cache(() => {
             const grid = this.u.grid;
             const coords = grid.getCoords();
-            const u_rot = new Float32Array(coords.lats.length);
-            const v_rot = new Float32Array(coords.lats.length);
+            const u_rot = new arrayType(coords.lats.length);
+            const v_rot = new arrayType(coords.lats.length);
             for (let icd = 0; icd < coords.lats.length; icd++) {
                 const lon = coords.lons[icd];
                 const lat = coords.lats[icd];
@@ -307,7 +392,7 @@ class RawVectorField {
             v = this.v;
         }
         else {
-            const { u: u_, v: v_ } = this._rotate_cache.getValue();
+            const { u: u_, v: v_ } = this.rotate_cache.getValue();
             u = u_;
             v = v_;
         }
@@ -327,8 +412,8 @@ class RawProfileField {
     }
     /** Get the gridded storm motion vector field (internal method) */
     getStormMotionGrid() {
-        const u = new Float32Array(this.grid.ni * this.grid.nj);
-        const v = new Float32Array(this.grid.ni * this.grid.nj);
+        const u = new Float16Array(this.grid.ni * this.grid.nj);
+        const v = new Float16Array(this.grid.ni * this.grid.nj);
         this.profiles.forEach(prof => {
             const idx = prof.ilon + this.grid.ni * prof.jlat;
             u[idx] = prof.smu;
@@ -337,4 +422,4 @@ class RawProfileField {
         return new RawVectorField(this.grid, u, v, { relative_to: 'grid' });
     }
 }
-export { RawScalarField, RawVectorField, RawProfileField, PlateCarreeGrid, LambertGrid, Grid };
+export { RawScalarField, RawVectorField, RawProfileField, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid, Grid };

package/lib/index.d.ts

@@ -5,11 +5,11 @@ import Barbs, { BarbsOptions } from "./Barbs";
 import Paintball, { PaintballOptions } from "./Paintball";
 import Hodographs, { HodographOptions } from './Hodographs';
 import { PlotLayer, MultiPlotLayer } from './PlotLayer';
-import { WindProfile, WebGLAnyRenderingContext } from "./AutumnTypes";
+import { WindProfile, WebGLAnyRenderingContext, TypedArray } from "./AutumnTypes";
 import { MapType } from "./Map";
 import { ColorMap, Color } from './Colormap';
 import { makeColorBar, makePaintballKey, ColorbarOrientation, ColorbarTickDirection, ColorBarOptions, PaintballKeyOptions } from "./ColorBar";
-import { RawScalarField, RawVectorField, RawProfileField, Grid, GridType, VectorRelativeTo, RawVectorFieldOptions, PlateCarreeGrid, LambertGrid } from "./RawField";
+import { RawScalarField, RawVectorField, RawProfileField, Grid, GridType, VectorRelativeTo, RawVectorFieldOptions, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid } from "./RawField";
 declare const colormaps: {
     bluered: (level_min: number, level_max: number, n_colors: number) => ColorMap;
     redblue: (level_min: number, level_max: number, n_colors: number) => ColorMap;
@@ -20,4 +20,4 @@ declare const colormaps: {
     pw_td2m: ColorMap;
     nws_storm_clear_refl: ColorMap;
 };
-export { PlotComponent, Barbs, BarbsOptions, Contour, ContourOptions, ContourFill, Raster, ContourFillOptions, RasterOptions, Paintball, PaintballOptions, Hodographs, HodographOptions, WindProfile, PlotLayer, MultiPlotLayer, MapType, ColorMap, colormaps, makeColorBar, makePaintballKey, Color, ColorbarOrientation, ColorbarTickDirection, ColorBarOptions, PaintballKeyOptions, RawScalarField, RawVectorField, RawProfileField, Grid, GridType, VectorRelativeTo, RawVectorFieldOptions, PlateCarreeGrid, LambertGrid, WebGLAnyRenderingContext };
+export { PlotComponent, Barbs, BarbsOptions, Contour, ContourOptions, ContourFill, Raster, ContourFillOptions, RasterOptions, Paintball, PaintballOptions, Hodographs, HodographOptions, WindProfile, PlotLayer, MultiPlotLayer, MapType, ColorMap, colormaps, makeColorBar, makePaintballKey, Color, ColorbarOrientation, ColorbarTickDirection, ColorBarOptions, PaintballKeyOptions, RawScalarField, RawVectorField, RawProfileField, Grid, GridType, VectorRelativeTo, RawVectorFieldOptions, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid, WebGLAnyRenderingContext, TypedArray };

package/lib/index.js

@@ -7,7 +7,7 @@ import Hodographs from './Hodographs';
 import { PlotLayer, MultiPlotLayer } from './PlotLayer';
 import { ColorMap, bluered, redblue, pw_speed500mb, pw_speed850mb, pw_cape, pw_t2m, pw_td2m, nws_storm_clear_refl } from './Colormap';
 import { makeColorBar, makePaintballKey } from "./ColorBar";
-import { RawScalarField, RawVectorField, RawProfileField, Grid, PlateCarreeGrid, LambertGrid } from "./RawField";
+import { RawScalarField, RawVectorField, RawProfileField, Grid, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid } from "./RawField";
 const colormaps = {
     bluered: bluered,
     redblue: redblue,
@@ -18,4 +18,4 @@ const colormaps = {
     pw_td2m: pw_td2m,
     nws_storm_clear_refl: nws_storm_clear_refl,
 };
-export { PlotComponent, Barbs, Contour, ContourFill, Raster, Paintball, Hodographs, PlotLayer, MultiPlotLayer, ColorMap, colormaps, makeColorBar, makePaintballKey, RawScalarField, RawVectorField, RawProfileField, Grid, PlateCarreeGrid, LambertGrid };
+export { PlotComponent, Barbs, Contour, ContourFill, Raster, Paintball, Hodographs, PlotLayer, MultiPlotLayer, ColorMap, colormaps, makeColorBar, makePaintballKey, RawScalarField, RawVectorField, RawProfileField, Grid, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid };

package/lib/utils.d.ts

@@ -6,4 +6,11 @@ declare const rgb2hsv: (rgb: [number, number, number]) => [number, number, numbe
 declare const hsv2rgb: (hsv: [number, number, number]) => [number, number, number];
 declare function getMinZoom(jlat: number, ilon: number, thin_fac_base: number): number;
 declare function zip(...args: any[]): Generator<any[], void, unknown>;
-export { hex2rgba, rgba2hex, hex2rgb, rgb2hex, rgb2hsv, hsv2rgb, zip, getMinZoom };
+declare function getOS(): string;
+declare class Cache<A extends unknown[], R> {
+    private cached_value;
+    private readonly compute_value;
+    constructor(compute_value: (...args: A) => R);
+    getValue(...args: A): R;
+}
+export { hex2rgba, rgba2hex, hex2rgb, rgb2hex, rgb2hsv, hsv2rgb, zip, getMinZoom, getOS, Cache };

package/lib/utils.js

@@ -100,4 +100,36 @@ function* zip(...args) {
         yield current.map(x => x.value);
     }
 }
-export { hex2rgba, rgba2hex, hex2rgb, rgb2hex, rgb2hsv, hsv2rgb, zip, getMinZoom };
+function getOS() {
+    const userAgent = window.navigator.userAgent, platform = window.navigator.platform, macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'], windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'], iosPlatforms = ['iPhone', 'iPad', 'iPod'];
+    let os = null;
+    if (macosPlatforms.indexOf(platform) !== -1 && navigator.maxTouchPoints <= 1) {
+        os = 'Mac OS';
+    }
+    else if (iosPlatforms.indexOf(platform) !== -1 || (macosPlatforms.indexOf(platform) !== -1 && navigator.maxTouchPoints > 1)) {
+        os = 'iOS';
+    }
+    else if (windowsPlatforms.indexOf(platform) !== -1) {
+        os = 'Windows';
+    }
+    else if (/Android/.test(userAgent)) {
+        os = 'Android';
+    }
+    else if (/Linux/.test(platform)) {
+        os = 'Linux';
+    }
+    return os;
+}
+class Cache {
+    constructor(compute_value) {
+        this.cached_value = null;
+        this.compute_value = compute_value;
+    }
+    getValue(...args) {
+        if (this.cached_value === null) {
+            this.cached_value = this.compute_value(...args);
+        }
+        return this.cached_value;
+    }
+}
+export { hex2rgba, rgba2hex, hex2rgb, rgb2hex, rgb2hsv, hsv2rgb, zip, getMinZoom, getOS, Cache };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "autumnplot-gl",
-    "version": "2.1.0",
+    "version": "2.2.0",
     "description": "",
     "main": "lib/index.js",
     "types": "lib/index.d.ts",
@@ -31,7 +31,8 @@
         "webpack-glsl-loader": "^1.0.1"
     },
     "dependencies": {
-        "autumn-wgl": "^1.1.0",
+        "@petamoriken/float16": "^3.8.4",
+        "autumn-wgl": "^1.2.0",
         "comlink": "^4.3.1"
     }
 }