autumnplot-gl 2.2.2 → 3.0.0

package/lib/Fill.js

@@ -1,7 +1,7 @@
 import { PlotComponent, getGLFormatTypeAlignment } from './PlotComponent';
-import { makeTextureImage } from './Colormap';
+import { makeIndexMap, makeTextureImage } from './Colormap';
 import { WGLProgram, WGLTexture } from 'autumn-wgl';
-import { Float16Array } from '@petamoriken/float16';
+import { hex2rgb } from './utils';
 const contourfill_vertex_shader_src = `uniform mat4 u_matrix;
 uniform int u_offset;
 
@@ -25,6 +25,8 @@ uniform sampler2D u_cmap_nonlin_sampler;
 uniform highp float u_cmap_min;
 uniform highp float u_cmap_max;
 uniform highp float u_opacity;
+uniform highp vec4 u_underflow_color;
+uniform highp vec4 u_overflow_color;
 uniform int u_n_index;
 
 void main() {
@@ -32,13 +34,19 @@ void main() {
     highp float fill_val = texture2D(u_fill_sampler, v_tex_coord).r;
     lowp float normed_val = (fill_val - u_cmap_min) / (u_cmap_max - u_cmap_min);
     
-    if (normed_val < 0.0 || normed_val > 1.0) {
-        discard;
+    lowp vec4 color;
+    if (normed_val < 0.0) {
+        color = u_underflow_color;
+    }
+    else if (normed_val > 1.0) {
+        color = u_overflow_color;
+    }
+    else {
+        normed_val = index_buffer + normed_val * (1. - 2. * index_buffer); 
+        highp float nonlin_val = texture2D(u_cmap_nonlin_sampler, vec2(normed_val, 0.5)).r;
+        color = texture2D(u_cmap_sampler, vec2(nonlin_val, 0.5));
     }
 
-    normed_val = index_buffer + normed_val * (1. - 2. * index_buffer); 
-    highp float nonlin_val = texture2D(u_cmap_nonlin_sampler, vec2(normed_val, 0.5)).r;
-    lowp vec4 color = texture2D(u_cmap_sampler, vec2(nonlin_val, 0.5));
     color.a = color.a * u_opacity;
     gl_FragColor = color;
 }`
@@ -49,28 +57,32 @@ class PlotComponentFill extends PlotComponent {
         this.cmap = opts.cmap;
         this.opacity = opts.opacity || 1.;
         this.cmap_image = makeTextureImage(this.cmap);
-        const levels = this.cmap.levels;
-        const n_lev = levels.length - 1;
-        // Build a texture to account for nonlinear colormaps (basically inverts the relationship between
-        //  the normalized index and the normalized level)
-        const n_nonlin = 101;
-        const map_norm = [];
-        for (let i = 0; i < n_nonlin; i++) {
-            map_norm.push(i / (n_nonlin - 1));
-        }
-        const input_norm = levels.map((lev, ilev) => ilev / n_lev);
-        const cmap_norm = levels.map(lev => (lev - levels[0]) / (levels[n_lev] - levels[0]));
-        const inv_cmap_norm = map_norm.map(lev => {
-            let jlev;
-            for (jlev = 0; !(cmap_norm[jlev] <= lev && lev <= cmap_norm[jlev + 1]); jlev++) { }
-            const alpha = (lev - cmap_norm[jlev]) / (cmap_norm[jlev + 1] - cmap_norm[jlev]);
-            return input_norm[jlev] * (1 - alpha) + input_norm[jlev + 1] * alpha;
-        });
-        this.index_map = new Float16Array(inv_cmap_norm);
+        this.index_map = makeIndexMap(this.cmap);
         this.gl_elems = null;
+        this.fill_texture = null;
         this.image_mag_filter = null;
         this.cmap_mag_filter = null;
     }
+    async updateField(field) {
+        this.field = field;
+        if (this.gl_elems === null)
+            return;
+        const gl = this.gl_elems.gl;
+        const map = this.gl_elems.map;
+        const tex_data = this.field.getTextureData();
+        const { format, type, row_alignment } = getGLFormatTypeAlignment(gl, !(tex_data instanceof Float32Array));
+        const fill_image = { 'format': format, 'type': type,
+            'width': this.field.grid.ni, 'height': this.field.grid.nj, 'image': tex_data,
+            'mag_filter': this.image_mag_filter, 'row_alignment': row_alignment,
+        };
+        if (this.fill_texture === null) {
+            this.fill_texture = new WGLTexture(gl, fill_image);
+        }
+        else {
+            this.fill_texture.setImageData(fill_image);
+        }
+        map.triggerRepaint();
+    }
     async onAdd(map, gl) {
         // Basic procedure for the filled contours inspired by https://blog.mbq.me/webgl-weather-globe/
         if (this.image_mag_filter === null || this.cmap_mag_filter === null) {
@@ -80,12 +92,6 @@ class PlotComponentFill extends PlotComponent {
         const { vertices: verts_buf, texcoords: tex_coords_buf } = await this.field.grid.getWGLBuffers(gl);
         const vertices = verts_buf;
         const texcoords = tex_coords_buf;
-        const { format, type, row_alignment } = getGLFormatTypeAlignment(gl, this.field.isFloat16());
-        const fill_image = { 'format': format, 'type': type,
-            'width': this.field.grid.ni, 'height': this.field.grid.nj, 'image': this.field.getTextureData(),
-            'mag_filter': this.image_mag_filter, 'row_alignment': row_alignment,
-        };
-        const fill_texture = new WGLTexture(gl, fill_image);
         const cmap_image = { 'format': gl.RGBA, 'type': gl.UNSIGNED_BYTE, 'image': this.cmap_image, 'mag_filter': this.cmap_mag_filter };
         const cmap_texture = new WGLTexture(gl, cmap_image);
         const { format: format_nonlin, type: type_nonlin, row_alignment: row_alignment_nonlin } = getGLFormatTypeAlignment(gl, true);
@@ -96,18 +102,21 @@ class PlotComponentFill extends PlotComponent {
         };
         const cmap_nonlin_texture = new WGLTexture(gl, cmap_nonlin_image);
         this.gl_elems = {
-            program: program, vertices: vertices, texcoords: texcoords,
-            fill_texture: fill_texture, cmap_texture: cmap_texture, cmap_nonlin_texture: cmap_nonlin_texture,
+            gl: gl, map: map, program: program, vertices: vertices, texcoords: texcoords,
+            cmap_texture: cmap_texture, cmap_nonlin_texture: cmap_nonlin_texture,
         };
+        this.updateField(this.field);
     }
     render(gl, matrix) {
-        if (this.gl_elems === null)
+        if (this.gl_elems === null || this.fill_texture === null)
             return;
         const gl_elems = this.gl_elems;
         if (matrix instanceof Float32Array)
             matrix = [...matrix];
+        const underflow_color = this.cmap.underflow_color === null ? [0, 0, 0, 0] : hex2rgb(this.cmap.underflow_color.color).concat(this.cmap.underflow_color.opacity);
+        const overflow_color = this.cmap.overflow_color === null ? [0, 0, 0, 0] : hex2rgb(this.cmap.overflow_color.color).concat(this.cmap.overflow_color.opacity);
         gl_elems.program.use({ 'a_pos': gl_elems.vertices, 'a_tex_coord': gl_elems.texcoords }, { 'u_cmap_min': this.cmap.levels[0], 'u_cmap_max': this.cmap.levels[this.cmap.levels.length - 1], 'u_matrix': matrix, 'u_opacity': this.opacity,
-            'u_n_index': this.index_map.length, 'u_offset': 0 }, { 'u_fill_sampler': gl_elems.fill_texture, 'u_cmap_sampler': gl_elems.cmap_texture, 'u_cmap_nonlin_sampler': gl_elems.cmap_nonlin_texture });
+            'u_n_index': this.index_map.length, 'u_underflow_color': underflow_color, 'u_overflow_color': overflow_color, 'u_offset': 0 }, { 'u_fill_sampler': this.fill_texture, 'u_cmap_sampler': gl_elems.cmap_texture, 'u_cmap_nonlin_sampler': gl_elems.cmap_nonlin_texture });
         gl.enable(gl.BLEND);
         gl.blendFuncSeparate(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA, gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
         gl_elems.program.draw();
@@ -134,6 +143,13 @@ class Raster extends PlotComponentFill {
     constructor(field, opts) {
         super(field, opts);
     }
+    /**
+     * Update the data displayed as a raster plot
+     * @param field - The new field to display as a raster plot
+     */
+    async updateField(field) {
+        await super.updateField(field);
+    }
     /**
      * @internal
      * Add the raster plot to a map
@@ -141,7 +157,7 @@ class Raster extends PlotComponentFill {
     async onAdd(map, gl) {
         this.image_mag_filter = gl.NEAREST;
         this.cmap_mag_filter = gl.LINEAR;
-        super.onAdd(map, gl);
+        await super.onAdd(map, gl);
     }
     /**
      * @internal
@@ -166,6 +182,13 @@ class ContourFill extends PlotComponentFill {
     constructor(field, opts) {
         super(field, opts);
     }
+    /**
+     * Update the data displayed as filled contours
+     * @param field - The new field to display as filled contours
+     */
+    async updateField(field) {
+        await super.updateField(field);
+    }
     /**
      * @internal
      * Add the filled contours to a map
@@ -173,7 +196,7 @@ class ContourFill extends PlotComponentFill {
     async onAdd(map, gl) {
         this.image_mag_filter = gl.LINEAR;
         this.cmap_mag_filter = gl.NEAREST;
-        super.onAdd(map, gl);
+        await super.onAdd(map, gl);
     }
     /**
      * @internal

package/lib/Grid.d.ts

@@ -0,0 +1,167 @@
+import { WGLBuffer, WGLTexture } from "autumn-wgl";
+import { WebGLAnyRenderingContext } from "./AutumnTypes";
+interface EarthCoords {
+    lons: Float32Array;
+    lats: Float32Array;
+}
+interface GridCoords {
+    x: Float32Array;
+    y: Float32Array;
+}
+type GridType = 'latlon' | 'latlonrot' | 'lcc';
+declare abstract class Grid {
+    readonly type: GridType;
+    readonly ni: number;
+    readonly nj: number;
+    readonly is_conformal: boolean;
+    private readonly buffer_cache;
+    private readonly billboard_buffer_cache;
+    private readonly vector_rotation_cache;
+    constructor(type: GridType, is_conformal: boolean, ni: number, nj: number);
+    abstract copy(opts?: {
+        ni?: number;
+        nj?: number;
+    }): Grid;
+    abstract getEarthCoords(): EarthCoords;
+    abstract getGridCoords(): GridCoords;
+    abstract transform(x: number, y: number, opts?: {
+        inverse?: boolean;
+    }): [number, number];
+    abstract getThinnedGrid(thin_x: number, thin_y: number): Grid;
+    getWGLBuffers(gl: WebGLAnyRenderingContext): Promise<{
+        vertices: WGLBuffer;
+        texcoords: WGLBuffer;
+        cellsize: WGLBuffer;
+    }>;
+    getWGLBillboardBuffers(gl: WebGLAnyRenderingContext, thin_fac: number, max_zoom: number): Promise<{
+        vertices: WGLBuffer;
+        texcoords: WGLBuffer;
+    }>;
+    getVectorRotationTexture(gl: WebGLAnyRenderingContext): {
+        rotation: WGLTexture;
+    };
+}
+/** A plate carree (a.k.a. lat/lon) grid with uniform grid spacing */
+declare class PlateCarreeGrid extends Grid {
+    readonly ll_lon: number;
+    readonly ll_lat: number;
+    readonly ur_lon: number;
+    readonly ur_lat: number;
+    private readonly ll_cache;
+    private readonly gc_cache;
+    /**
+     * Create a plate carree 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 ll_lon - The longitude of the lower left corner of the grid
+     * @param ll_lat - The latitude of the lower left corner of the grid
+     * @param ur_lon - The longitude of the upper right corner of the grid
+     * @param ur_lat - The latitude of the upper right corner of the grid
+     */
+    constructor(ni: number, nj: number, ll_lon: number, ll_lat: number, ur_lon: number, ur_lat: number);
+    copy(opts?: {
+        ni?: number;
+        nj?: number;
+        ll_lon?: number;
+        ll_lat?: number;
+        ur_lon?: number;
+        ur_lat?: number;
+    }): PlateCarreeGrid;
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getEarthCoords(): EarthCoords;
+    getGridCoords(): GridCoords;
+    transform(x: number, y: number, opts?: {
+        inverse?: boolean;
+    }): [number, number];
+    getThinnedGrid(thin_x: number, thin_y: number): PlateCarreeGrid;
+}
+/** A rotated lat-lon (plate carree) grid with uniform grid spacing */
+declare class PlateCarreeRotatedGrid extends Grid {
+    readonly np_lon: number;
+    readonly np_lat: number;
+    readonly lon_shift: number;
+    readonly ll_lon: number;
+    readonly ll_lat: number;
+    readonly ur_lon: number;
+    readonly ur_lat: number;
+    private readonly llrot;
+    private readonly ll_cache;
+    private readonly gc_cache;
+    /**
+     * 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: number, nj: number, np_lon: number, np_lat: number, lon_shift: number, ll_lon: number, ll_lat: number, ur_lon: number, ur_lat: number);
+    copy(opts?: {
+        ni?: number;
+        nj?: number;
+        ll_lon?: number;
+        ll_lat?: number;
+        ur_lon?: number;
+        ur_lat?: number;
+    }): PlateCarreeRotatedGrid;
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getEarthCoords(): EarthCoords;
+    getGridCoords(): GridCoords;
+    transform(x: number, y: number, opts?: {
+        inverse?: boolean;
+    }): [number, number];
+    getThinnedGrid(thin_x: number, thin_y: number): PlateCarreeRotatedGrid;
+}
+/** A Lambert conformal conic grid with uniform grid spacing */
+declare class LambertGrid extends Grid {
+    readonly lon_0: number;
+    readonly lat_0: number;
+    readonly lat_std: [number, number];
+    readonly ll_x: number;
+    readonly ll_y: number;
+    readonly ur_x: number;
+    readonly ur_y: number;
+    private readonly lcc;
+    private readonly ll_cache;
+    private readonly gc_cache;
+    /**
+     * 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 lon_0   - The standard longitude for the projection; this is also the center longitude for the projection
+     * @param lat_0   - The center latitude for the projection
+     * @param lat_std - The standard latitudes for the projection
+     * @param ll_x    - The x coordinate in projection space of the lower-left corner of the grid
+     * @param ll_y    - The y coordinate in projection space of the lower-left corner of the grid
+     * @param ur_x    - The x coordinate in projection space of the upper-right corner of the grid
+     * @param ur_y    - The y coordinate in projection space of the upper-right corner of the grid
+     */
+    constructor(ni: number, nj: number, lon_0: number, lat_0: number, lat_std: [number, number], ll_x: number, ll_y: number, ur_x: number, ur_y: number);
+    copy(opts?: {
+        ni?: number;
+        nj?: number;
+        ll_x?: number;
+        ll_y?: number;
+        ur_x?: number;
+        ur_y?: number;
+    }): LambertGrid;
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getEarthCoords(): EarthCoords;
+    getGridCoords(): GridCoords;
+    transform(x: number, y: number, opts?: {
+        inverse?: boolean;
+    }): [number, number];
+    getThinnedGrid(thin_x: number, thin_y: number): LambertGrid;
+}
+export { Grid, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid };
+export type { GridType };

package/lib/Grid.js

@@ -0,0 +1,339 @@
+import { Float16Array } from "@petamoriken/float16";
+import { WGLBuffer, WGLTexture } from "autumn-wgl";
+import { lambertConformalConic, rotateSphere } from "./Map";
+import { getGLFormatTypeAlignment, layer_worker } from "./PlotComponent";
+import { Cache } from "./utils";
+async function makeWGLDomainBuffers(gl, grid, native_grid) {
+    native_grid = native_grid !== undefined ? native_grid : grid;
+    const texcoord_margin_r = 1 / (2 * native_grid.ni);
+    const texcoord_margin_s = 1 / (2 * native_grid.nj);
+    const grid_cell_size_multiplier = (grid.ni * grid.nj) / (native_grid.ni * native_grid.nj);
+    const { lats: field_lats, lons: field_lons } = grid.getEarthCoords();
+    const domain_coords = await layer_worker.makeDomainVerticesAndTexCoords(field_lats, field_lons, grid.ni, grid.nj, texcoord_margin_r, texcoord_margin_s);
+    for (let icd = 0; icd < domain_coords['grid_cell_size'].length; icd++) {
+        domain_coords['grid_cell_size'][icd] *= grid_cell_size_multiplier;
+    }
+    const vertices = new WGLBuffer(gl, domain_coords['vertices'], 2, gl.TRIANGLE_STRIP);
+    const texcoords = new WGLBuffer(gl, domain_coords['tex_coords'], 2, gl.TRIANGLE_STRIP);
+    const grid_cell_size = new WGLBuffer(gl, domain_coords['grid_cell_size'], 1, gl.TRIANGLE_STRIP);
+    return { 'vertices': vertices, 'texcoords': texcoords, 'cellsize': grid_cell_size };
+}
+async function makeWGLBillboardBuffers(gl, grid, thin_fac, max_zoom) {
+    const { lats: field_lats, lons: field_lons } = grid.getEarthCoords();
+    const bb_elements = await layer_worker.makeBBElements(field_lats, field_lons, grid.ni, grid.nj, thin_fac, max_zoom);
+    const vertices = new WGLBuffer(gl, bb_elements['pts'], 3, gl.TRIANGLE_STRIP);
+    const texcoords = new WGLBuffer(gl, bb_elements['tex_coords'], 2, gl.TRIANGLE_STRIP);
+    return { 'vertices': vertices, 'texcoords': texcoords };
+}
+function makeVectorRotationTexture(gl, grid) {
+    const coords = grid.getEarthCoords();
+    if (!grid.is_conformal) {
+        // If the grid is non-conformal, we need a fully general change of basis from grid coordinates to earth coordinates. This is not supported for now, so warn about it.
+        console.warn('Vector rotations for non-conformal projections are not supported. The output may look incorrect.');
+    }
+    const rot_vals = new Float16Array(coords.lats.length);
+    for (let icd = 0; icd < coords.lats.length; icd++) {
+        const lon = coords.lons[icd];
+        const lat = coords.lats[icd];
+        const [x, y] = grid.transform(lon, lat);
+        const [x_pertlon, y_pertlon] = grid.transform(lon + 0.01, lat);
+        rot_vals[icd] = Math.atan2(y_pertlon - y, x_pertlon - x);
+    }
+    const { format, type, row_alignment } = getGLFormatTypeAlignment(gl, true);
+    const rot_img = {
+        format: format, type: type, row_alignment: row_alignment, image: new Uint16Array(rot_vals.buffer),
+        width: grid.ni, height: grid.nj, mag_filter: gl.LINEAR
+    };
+    const rot_tex = new WGLTexture(gl, rot_img);
+    return { 'rotation': rot_tex };
+}
+class Grid {
+    constructor(type, is_conformal, ni, nj) {
+        this.type = type;
+        this.is_conformal = is_conformal;
+        this.ni = ni;
+        this.nj = nj;
+        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) => {
+            return makeWGLBillboardBuffers(gl, this, thin_fac, max_zoom);
+        });
+        this.vector_rotation_cache = new Cache((gl) => {
+            return makeVectorRotationTexture(gl, this);
+        });
+    }
+    async getWGLBuffers(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);
+    }
+    getVectorRotationTexture(gl) {
+        return this.vector_rotation_cache.getValue(gl);
+    }
+}
+/** A plate carree (a.k.a. lat/lon) grid with uniform grid spacing */
+class PlateCarreeGrid extends Grid {
+    /**
+     * Create a plate carree 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 ll_lon - The longitude of the lower left corner of the grid
+     * @param ll_lat - The latitude of the lower left corner of the grid
+     * @param ur_lon - The longitude of the upper right corner of the grid
+     * @param ur_lat - The latitude of the upper right corner of the grid
+     */
+    constructor(ni, nj, ll_lon, ll_lat, ur_lon, ur_lat) {
+        super('latlon', true, ni, nj);
+        this.ll_lon = ll_lon;
+        this.ll_lat = ll_lat;
+        this.ur_lon = ur_lon;
+        this.ur_lat = ur_lat;
+        const dlon = (this.ur_lon - this.ll_lon) / (this.ni - 1);
+        const dlat = (this.ur_lat - this.ll_lat) / (this.nj - 1);
+        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++) {
+                for (let j = 0; j < this.nj; j++) {
+                    const idx = i + j * this.ni;
+                    lons[idx] = this.ll_lon + i * dlon;
+                    lats[idx] = this.ll_lat + j * dlat;
+                }
+            }
+            return { 'lons': lons, 'lats': lats };
+        });
+        this.gc_cache = new Cache(() => {
+            const x = new Float32Array(this.ni);
+            const y = new Float32Array(this.nj);
+            for (let i = 0; i < this.ni; i++) {
+                x[i] = this.ll_lon + i * dlon;
+            }
+            for (let j = 0; j < this.nj; j++) {
+                y[j] = this.ll_lat + j * dlat;
+            }
+            return { x: x, y: y };
+        });
+    }
+    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 PlateCarreeGrid(ni, nj, ll_lon, ll_lat, ur_lon, ur_lat);
+    }
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getEarthCoords() {
+        return this.ll_cache.getValue();
+    }
+    getGridCoords() {
+        return this.gc_cache.getValue();
+    }
+    transform(x, y, opts) {
+        return [x, y];
+    }
+    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 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 });
+        const dlon = (this.ur_lon - this.ll_lon) / (this.ni - 1);
+        const dlat = (this.ur_lat - this.ll_lat) / (this.nj - 1);
+        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 + i * dlon;
+                for (let j = 0; j < this.nj; j++) {
+                    const lat_p = this.ll_lat + j * dlat;
+                    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 };
+        });
+        this.gc_cache = new Cache(() => {
+            const x = new Float32Array(this.ni);
+            const y = new Float32Array(this.nj);
+            for (let i = 0; i < this.ni; i++) {
+                x[i] = this.ll_lon + i * dlon;
+            }
+            for (let j = 0; j < this.nj; j++) {
+                y[j] = this.ll_lat + j * dlat;
+            }
+            return { x: x, y: y };
+        });
+    }
+    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)
+     */
+    getEarthCoords() {
+        return this.ll_cache.getValue();
+    }
+    getGridCoords() {
+        return this.gc_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 {
+    /**
+     * 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 lon_0   - The standard longitude for the projection; this is also the center longitude for the projection
+     * @param lat_0   - The center latitude for the projection
+     * @param lat_std - The standard latitudes for the projection
+     * @param ll_x    - The x coordinate in projection space of the lower-left corner of the grid
+     * @param ll_y    - The y coordinate in projection space of the lower-left corner of the grid
+     * @param ur_x    - The x coordinate in projection space of the upper-right corner of the grid
+     * @param ur_y    - The y coordinate in projection space of the upper-right corner of the grid
+     */
+    constructor(ni, nj, lon_0, lat_0, lat_std, ll_x, ll_y, ur_x, ur_y) {
+        super('lcc', true, ni, nj);
+        this.lon_0 = lon_0;
+        this.lat_0 = lat_0;
+        this.lat_std = lat_std;
+        this.ll_x = ll_x;
+        this.ll_y = ll_y;
+        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 });
+        const dx = (this.ur_x - this.ll_x) / (this.ni - 1);
+        const dy = (this.ur_y - this.ll_y) / (this.nj - 1);
+        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 x = this.ll_x + i * dx;
+                for (let j = 0; j < this.nj; j++) {
+                    const y = this.ll_y + j * dy;
+                    const [lon, lat] = this.lcc(x, y, { inverse: true });
+                    const idx = i + j * this.ni;
+                    lons[idx] = lon;
+                    lats[idx] = lat;
+                }
+            }
+            return { lons: lons, lats: lats };
+        });
+        this.gc_cache = new Cache(() => {
+            const x = new Float32Array(this.ni);
+            const y = new Float32Array(this.nj);
+            for (let i = 0; i < this.ni; i++) {
+                x[i] = this.ll_x + i * dx;
+            }
+            for (let j = 0; j < this.nj; j++) {
+                y[j] = this.ll_y + j * dy;
+            }
+            return { x: x, y: y };
+        });
+    }
+    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_x = opts.ll_x !== undefined ? opts.ll_x : this.ll_x;
+        const ll_y = opts.ll_y !== undefined ? opts.ll_y : this.ll_y;
+        const ur_x = opts.ur_x !== undefined ? opts.ur_x : this.ur_x;
+        const ur_y = opts.ur_y !== undefined ? opts.ur_y : this.ur_y;
+        return new LambertGrid(ni, nj, this.lon_0, this.lat_0, this.lat_std, ll_x, ll_y, ur_x, ur_y);
+    }
+    /**
+     * Get a list of longitudes and latitudes on the grid (internal method)
+     */
+    getEarthCoords() {
+        return this.ll_cache.getValue();
+    }
+    getGridCoords() {
+        return this.gc_cache.getValue();
+    }
+    transform(x, y, opts) {
+        opts = opts === undefined ? {} : opts;
+        const inverse = 'inverse' in opts ? opts.inverse : false;
+        return this.lcc(x, y, { inverse: inverse });
+    }
+    getThinnedGrid(thin_x, thin_y) {
+        const dx = (this.ur_x - this.ll_x) / this.ni;
+        const dy = (this.ur_y - this.ll_y) / 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_x = this.ll_x;
+        const ll_y = this.ll_y;
+        const ur_x = this.ur_x - ni_remove * dx;
+        const ur_y = this.ur_y - nj_remove * dy;
+        return new LambertGrid(ni, nj, this.lon_0, this.lat_0, this.lat_std, ll_x, ll_y, ur_x, ur_y);
+    }
+}
+export { Grid, PlateCarreeGrid, PlateCarreeRotatedGrid, LambertGrid };