autumnplot-gl 4.0.0-beta → 4.1.0

package/lib/ContourCreator.worker.d.ts

@@ -0,0 +1,25 @@
+import { GridCoords } from './grids/Grid';
+import { ContourData, ContourableTypedArray } from "./AutumnTypes";
+declare function init(wasm_base_url: string | undefined): Promise<void>;
+/** Options for contouring data via {@link RawScalarField.getContours | RawScalarField.getContours()} */
+interface FieldContourOpts {
+    /**
+     * The interval at which to create contours. The field will be contoured at this interval from its minimum to its maximum.
+     */
+    interval?: number;
+    /**
+     * Contour the field at these specific levels.
+     */
+    levels?: number[];
+    /**
+     * Add triangles in the contouring, which takes longer and generates more detailed (not necessarily smoother or better) contours
+     */
+    quad_as_tri?: boolean;
+}
+declare function contourCreator(data: ContourableTypedArray, grid_coords: GridCoords, opts: FieldContourOpts): Promise<ContourData>;
+declare const ep_interface: {
+    contourCreator: typeof contourCreator;
+    init: typeof init;
+};
+type ContourCreatorWorker = typeof ep_interface;
+export type { ContourCreatorWorker, FieldContourOpts };

package/lib/{ContourCreator.js → ContourCreator.worker.js}

@@ -1,24 +1,25 @@
-import Module from './cpp/marchingsquares';
-import './cpp/marchingsquares.wasm';
-let msm_promise = null;
-function initMSModule() {
-    if (msm_promise === null) {
-        msm_promise = Module();
-    }
-    return msm_promise;
+import * as Comlink from 'comlink';
+import { initMSModule } from "./WasmInterface";
+let _msm = null;
+async function init(wasm_base_url) {
+    _msm = await initMSModule({ document_script: wasm_base_url });
 }
-async function contourCreator(data, grid, opts) {
+async function contourCreator(data, grid_coords, opts) {
     if (opts.interval === undefined && opts.levels === undefined) {
         throw "Must supply either an interval or levels to contourCreator()";
     }
     const interval = opts.interval === undefined ? 0 : opts.interval;
     const quad_as_tri = opts.quad_as_tri === undefined ? false : opts.quad_as_tri;
-    const msm = await initMSModule();
-    const grid_coords = grid.getGridCoords();
+    const msm = _msm === null ? await initMSModule({}) : _msm;
+    _msm = msm;
     const getContourLevels = data instanceof Float32Array ? msm.getContourLevelsFloat32 : msm.getContourLevelsFloat16;
     const makeContours = data instanceof Float32Array ? msm.makeContoursFloat32 : msm.makeContoursFloat16;
-    const levels = opts.levels === undefined ? getContourLevels(data, grid.ni, grid.nj, interval) : opts.levels;
-    const contours = makeContours(data, grid_coords.x, grid_coords.y, levels, (x, y) => grid.transform(x, y, { inverse: true }), quad_as_tri);
+    const levels = opts.levels === undefined ? getContourLevels(data, grid_coords.x.length, grid_coords.y.length, interval) : opts.levels;
+    const contours = makeContours(data, grid_coords.x, grid_coords.y, levels, quad_as_tri);
     return contours;
 }
-export { contourCreator, initMSModule };
+const ep_interface = {
+    'contourCreator': contourCreator,
+    'init': init,
+};
+Comlink.expose(ep_interface);

package/lib/Fill.d.ts

@@ -1,9 +1,10 @@
 import { PlotComponent } from './PlotComponent';
 import { ColorMap } from './Colormap';
-import { RawScalarField } from './RawField';
+import { ExpressionScalarField } from './RawField';
 import { MapLikeType } from './Map';
 import { RenderMethodArg, TypedArray, WebGLAnyRenderingContext } from './AutumnTypes';
-import { StructuredGrid } from './Grid';
+import { DomainBufferGrid } from './grids/DomainBuffer';
+/** Options for {@link ContourFill} components */
 interface ContourFillOptions {
     /** The color maps to use when creating the fills */
     cmap: ColorMap | ColorMap[];
@@ -18,6 +19,7 @@ interface ContourFillOptions {
      */
     opacity?: number;
 }
+/** Options for {@link Raster} components */
 interface RasterOptions {
     /** The color map to use when creating the raster plot */
     cmap: ColorMap | ColorMap[];
@@ -32,7 +34,7 @@ interface RasterOptions {
      */
     opacity?: number;
 }
-declare class PlotComponentFill<ArrayType extends TypedArray, GridType extends StructuredGrid, MapType extends MapLikeType> extends PlotComponent<MapType> {
+declare class PlotComponentFill<ArrayType extends TypedArray, GridType extends DomainBufferGrid, MapType extends MapLikeType> extends PlotComponent<MapType> {
     private field;
     readonly opts: Required<ContourFillOptions>;
     private readonly cmap_gpu;
@@ -41,29 +43,38 @@ declare class PlotComponentFill<ArrayType extends TypedArray, GridType extends S
     private mask_texture;
     protected image_mag_filter: number | null;
     protected cmap_mag_filter: number | null;
-    constructor(field: RawScalarField<ArrayType, GridType>, opts: ContourFillOptions);
-    updateField(field: RawScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
+    constructor(field: ExpressionScalarField<ArrayType, GridType>, opts: ContourFillOptions);
+    updateField(field: ExpressionScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
     onAdd(map: MapType, gl: WebGLAnyRenderingContext): Promise<void>;
     render(gl: WebGLAnyRenderingContext, arg: RenderMethodArg): void;
 }
 /**
  * A raster (i.e. pixel) plot
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :x:                `UnstructuredGrid`
+ * - :white_check_mark: `RadarSweepGrid`
+ * - :white_check_mark: `Geostationary`
+ *
  * @example
  * // Create a raster plot with the provided color map
  * const raster = new Raster(wind_speed_field, {cmap: color_map});
  */
-declare class Raster<ArrayType extends TypedArray, GridType extends StructuredGrid, MapType extends MapLikeType> extends PlotComponentFill<ArrayType, GridType, MapType> {
+declare class Raster<ArrayType extends TypedArray, GridType extends DomainBufferGrid, MapType extends MapLikeType> extends PlotComponentFill<ArrayType, GridType, MapType> {
     /**
      * Create a raster plot
      * @param field - The field to create the raster plot from
      * @param opts  - Options for creating the raster plot
      */
-    constructor(field: RawScalarField<ArrayType, GridType>, opts: RasterOptions);
+    constructor(field: ExpressionScalarField<ArrayType, GridType>, opts: RasterOptions);
     /**
      * Update the data displayed as a raster plot
      * @param field - The new field to display as a raster plot
      */
-    updateField(field: RawScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
+    updateField(field: ExpressionScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
     /**
      * @internal
      * Add the raster plot to a map
@@ -77,22 +88,31 @@ declare class Raster<ArrayType extends TypedArray, GridType extends StructuredGr
 }
 /**
  * A filled contoured field
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :x:                `UnstructuredGrid`
+ * - :white_check_mark: `RadarSweepGrid`
+ * - :white_check_mark: `Geostationary`
+ *
  * @example
  * // Create a field of filled contours with the provided color map
  * const fill = new ContourFill(wind_speed_field, {cmap: color_map});
  */
-declare class ContourFill<ArrayType extends TypedArray, GridType extends StructuredGrid, MapType extends MapLikeType> extends PlotComponentFill<ArrayType, GridType, MapType> {
+declare class ContourFill<ArrayType extends TypedArray, GridType extends DomainBufferGrid, MapType extends MapLikeType> extends PlotComponentFill<ArrayType, GridType, MapType> {
     /**
      * Create a filled contoured field
      * @param field - The field to create filled contours from
      * @param opts  - Options for creating the filled contours
      */
-    constructor(field: RawScalarField<ArrayType, GridType>, opts: ContourFillOptions);
+    constructor(field: ExpressionScalarField<ArrayType, GridType>, opts: ContourFillOptions);
     /**
      * Update the data displayed as filled contours
      * @param field - The new field to display as filled contours
      */
-    updateField(field: RawScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
+    updateField(field: ExpressionScalarField<ArrayType, GridType>, mask?: Uint8Array): Promise<void>;
     /**
      * @internal
      * Add the filled contours to a map

package/lib/Fill.js

@@ -1,9 +1,8 @@
-import { PlotComponent } from './PlotComponent';
+import { PlotComponent, getGLFormatTypeAlignment } from './PlotComponent';
 import { ColorMap, ColorMapGPUInterface } from './Colormap';
 import { WGLTexture } from 'autumn-wgl';
-import { RawScalarField } from './RawField';
 import { getRendererData } from './AutumnTypes';
-import { normalizeOptions } from './utils';
+import { applySamplerCodeScalar, normalizeOptions } from './utils';
 import { ShaderProgramManager } from './ShaderManager';
 const contourfill_vertex_shader_src = `#version 300 es
 
@@ -25,8 +24,6 @@ const contourfill_fragment_shader_src = `#version 300 es
 
 in highp vec2 v_tex_coord;
 
-uniform sampler2D u_fill_sampler;
-
 #ifdef MASK
 uniform sampler2D u_mask_sampler;
 #endif
@@ -39,7 +36,7 @@ uniform int u_mask_val;
 out highp vec4 fragColor;
 
 void main() {
-    highp float fill_val = texture(u_fill_sampler, v_tex_coord).r;
+    highp float fill_val = get_field_value(v_tex_coord);
 
     int draw_mask = 1;
 
@@ -89,20 +86,17 @@ class PlotComponentFill extends PlotComponent {
             return;
         const gl = this.gl_elems.gl;
         const map = this.gl_elems.map;
-        const fill_image = this.field.getWGLTextureSpec(gl, this.image_mag_filter);
-        if (this.fill_texture === null) {
-            this.fill_texture = new WGLTexture(gl, fill_image);
-        }
-        else {
-            this.fill_texture.setImageData(fill_image);
-        }
+        this.fill_texture = this.field.updateTexImageData(gl, this.image_mag_filter, this.fill_texture);
         if (mask !== undefined) {
             if (this.opts.cmap_mask === null) {
                 console.warn("A mask was passed to updateField on a Fill component that didn't have a mask. The updated mask will be ignored.");
                 return;
             }
-            const mask_field = new RawScalarField(this.field.grid, mask);
-            const mask_image = mask_field.getWGLTextureSpec(gl, gl.NEAREST);
+            const { format, type, row_alignment } = getGLFormatTypeAlignment(gl, 'uint8');
+            const mask_image = { 'format': format, 'type': type,
+                'width': this.field.grid.ni, 'height': this.field.grid.nj, 'image': mask,
+                'mag_filter': gl.NEAREST, 'row_alignment': row_alignment,
+            };
             if (this.mask_texture === null) {
                 this.mask_texture = new WGLTexture(gl, mask_image);
             }
@@ -114,7 +108,7 @@ class PlotComponentFill extends PlotComponent {
     }
     async onAdd(map, gl) {
         // Basic procedure for the filled contours inspired by https://blog.mbq.me/webgl-weather-globe/
-        const { vertices: vertices, texcoords: texcoords } = await this.field.grid.getWGLBuffers(gl);
+        const { vertices: vertices, texcoords: texcoords } = await this.field.grid.getDomainBuffers(gl);
         this.cmap_gpu.forEach(cmg => {
             if (this.image_mag_filter === null || this.cmap_mag_filter === null) {
                 throw `Implement magnification filters in a subclass`;
@@ -125,7 +119,14 @@ class PlotComponentFill extends PlotComponent {
         if (this.opts.cmap_mask !== null) {
             shader_defines.push('MASK');
         }
-        const shader_manger = new ShaderProgramManager(contourfill_vertex_shader_src, ColorMapGPUInterface.applyShader(contourfill_fragment_shader_src), shader_defines);
+        if (this.image_mag_filter === null || this.cmap_mag_filter === null) {
+            throw `Implement magnification filters in a subclass`;
+        }
+        const sampler_keys = this.field.getSamplerIds();
+        const sampler_expression = this.field.getExpression();
+        const data_types = this.field.dtypes;
+        const frag_shader_src = applySamplerCodeScalar(ColorMapGPUInterface.applyShader(contourfill_fragment_shader_src), sampler_keys, sampler_expression, data_types);
+        const shader_manger = new ShaderProgramManager(contourfill_vertex_shader_src, frag_shader_src, shader_defines);
         this.gl_elems = {
             gl: gl, shader_manager: shader_manger, map: map, vertices: vertices, texcoords: texcoords,
         };
@@ -137,7 +138,8 @@ class PlotComponentFill extends PlotComponent {
         const gl_elems = this.gl_elems;
         const render_data = getRendererData(arg);
         const program = this.gl_elems.shader_manager.getShaderProgram(gl, render_data.shaderData);
-        program.use({ 'a_pos': gl_elems.vertices, 'a_tex_coord': gl_elems.texcoords }, { 'u_opacity': this.opts.opacity, ...this.gl_elems.shader_manager.getShaderUniforms(render_data) }, { 'u_fill_sampler': this.fill_texture });
+        const samplers = Object.fromEntries([...this.fill_texture.entries()]);
+        program.use({ 'a_pos': gl_elems.vertices, 'a_tex_coord': gl_elems.texcoords }, { 'u_opacity': this.opts.opacity, ...this.gl_elems.shader_manager.getShaderUniforms(render_data) }, samplers);
         this.cmap_gpu.forEach((cmg, icmg) => {
             program.setUniforms({ 'u_offset': 0 });
             if (this.opts.cmap_mask !== null && this.mask_texture !== null) {
@@ -161,6 +163,15 @@ class PlotComponentFill extends PlotComponent {
 }
 /**
  * A raster (i.e. pixel) plot
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :x:                `UnstructuredGrid`
+ * - :white_check_mark: `RadarSweepGrid`
+ * - :white_check_mark: `Geostationary`
+ *
  * @example
  * // Create a raster plot with the provided color map
  * const raster = new Raster(wind_speed_field, {cmap: color_map});
@@ -200,6 +211,15 @@ class Raster extends PlotComponentFill {
 }
 /**
  * A filled contoured field
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :x:                `UnstructuredGrid`
+ * - :white_check_mark: `RadarSweepGrid`
+ * - :white_check_mark: `Geostationary`
+ *
  * @example
  * // Create a field of filled contours with the provided color map
  * const fill = new ContourFill(wind_speed_field, {cmap: color_map});

package/lib/Hodographs.d.ts

@@ -3,7 +3,8 @@ import { MapLikeType } from "./Map";
 import { RawProfileField } from "./RawField";
 import { RenderMethodArg, WebGLAnyRenderingContext } from "./AutumnTypes";
 import { ColorMap } from "./Colormap";
-import { Grid } from "./Grid";
+import { AutoZoomGrid } from "./grids/AutoZoom";
+/** Options for {@link Hodographs} components */
 interface HodographOptions {
     /**
      * The color of the hodograph plot background as a hex string
@@ -30,9 +31,24 @@ interface HodographOptions {
      * The colormap to use for the heights on the hodograph. Default is a yellow-blue colormap.
      */
     height_cmap?: ColorMap;
+    /**
+     * The wind speed (in kts) of the largest ring on the hodograph background
+     * @default 80
+     */
+    max_wind_speed_ring?: number;
 }
-/** A class representing a field of hodograph plots */
-declare class Hodographs<GridType extends Grid, MapType extends MapLikeType> extends PlotComponent<MapType> {
+/**
+ * A class representing a field of hodograph plots
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :white_check_mark: `UnstructuredGrid`
+ * - :x:                `RadarSweepGrid`
+ * - :x:                `Geostationary`
+ */
+declare class Hodographs<GridType extends AutoZoomGrid, MapType extends MapLikeType> extends PlotComponent<MapType> {
     private profile_field;
     readonly opts: Required<HodographOptions>;
     private gl_elems;

package/lib/Hodographs.js

@@ -1,11 +1,11 @@
 import { PlotComponent } from "./PlotComponent";
 import { PolylineCollection } from "./PolylineCollection";
 import { BillboardCollection } from "./BillboardCollection";
-import { getMinZoom, normalizeOptions } from './utils';
+import { normalizeOptions } from './utils';
+import { isStormRelativeWindProfile } from "./AutumnTypes";
 import { ColorMap } from "./Colormap";
 import { Color } from "./Color";
 const LINE_WIDTH_MULTIPLIER = 2.5;
-const BG_MAX_RING_MAG = 40;
 const HODO_BG_DIMS = {
     BB_WIDTH: 256,
     BB_HEIGHT: 256,
@@ -15,7 +15,7 @@ const HODO_BG_DIMS = {
     BB_MAG_WRAP: 1000,
     BB_MAG_BIN_SIZE: 1000,
 };
-function _createHodoBackgroundTexture(line_width) {
+function _createHodoBackgroundTexture(line_width, arrow_head) {
     let canvas = document.createElement('canvas');
     canvas.width = HODO_BG_DIMS.BB_TEX_WIDTH;
     canvas.height = HODO_BG_DIMS.BB_TEX_HEIGHT;
@@ -29,14 +29,21 @@ function _createHodoBackgroundTexture(line_width) {
         ctx.arc(HODO_BG_DIMS.BB_TEX_WIDTH / 2, HODO_BG_DIMS.BB_TEX_WIDTH / 2, irng - line_width / 2, 0, 2 * Math.PI);
         ctx.stroke();
     }
-    const ctr_x = HODO_BG_DIMS.BB_TEX_WIDTH / 2, ctr_y = HODO_BG_DIMS.BB_TEX_WIDTH / 2;
-    const arrow_size = 20;
-    ctx.beginPath();
-    ctx.moveTo(ctr_x, ctr_y);
-    ctx.lineTo(ctr_x + arrow_size / 2, ctr_y + arrow_size);
-    ctx.lineTo(ctr_x - arrow_size / 2, ctr_y + arrow_size);
-    ctx.lineTo(ctr_x, ctr_y);
-    ctx.fill();
+    if (arrow_head) {
+        const ctr_x = HODO_BG_DIMS.BB_TEX_WIDTH / 2, ctr_y = HODO_BG_DIMS.BB_TEX_WIDTH / 2;
+        const arrow_size = 20;
+        ctx.beginPath();
+        ctx.moveTo(ctr_x, ctr_y);
+        ctx.lineTo(ctr_x + arrow_size / 2, ctr_y + arrow_size);
+        ctx.lineTo(ctr_x - arrow_size / 2, ctr_y + arrow_size);
+        ctx.lineTo(ctr_x, ctr_y);
+        ctx.fill();
+    }
+    else {
+        ctx.beginPath();
+        ctx.arc(HODO_BG_DIMS.BB_TEX_WIDTH / 2, HODO_BG_DIMS.BB_TEX_WIDTH / 2, line_width, 0, 2 * Math.PI);
+        ctx.fill();
+    }
     return canvas;
 }
 ;
@@ -46,9 +53,20 @@ const hodograph_opt_defaults = {
     thin_fac: 1,
     hodo_line_width: 2.5,
     background_line_width: 1.5,
-    height_cmap: HODO_CMAP
+    height_cmap: HODO_CMAP,
+    max_wind_speed_ring: 80
 };
-/** A class representing a field of hodograph plots */
+/**
+ * A class representing a field of hodograph plots
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :white_check_mark: `UnstructuredGrid`
+ * - :x:                `RadarSweepGrid`
+ * - :x:                `Geostationary`
+ */
 class Hodographs extends PlotComponent {
     /**
      * Create a field of hodographs
@@ -59,8 +77,8 @@ class Hodographs extends PlotComponent {
         super();
         this.profile_field = profile_field;
         this.opts = normalizeOptions(opts, hodograph_opt_defaults);
-        this.hodo_bg_texture = _createHodoBackgroundTexture(this.opts.background_line_width * LINE_WIDTH_MULTIPLIER);
-        this.hodo_scale = (HODO_BG_DIMS.BB_TEX_WIDTH - this.opts.background_line_width / 2) / (HODO_BG_DIMS.BB_TEX_WIDTH * BG_MAX_RING_MAG);
+        this.hodo_bg_texture = _createHodoBackgroundTexture(this.opts.background_line_width * LINE_WIDTH_MULTIPLIER, isStormRelativeWindProfile(profile_field.profiles[0]));
+        this.hodo_scale = (HODO_BG_DIMS.BB_TEX_WIDTH - this.opts.background_line_width / 2) / (HODO_BG_DIMS.BB_TEX_WIDTH * this.opts.max_wind_speed_ring);
         this.bg_size = 140;
         this.gl_elems = null;
         this.line_elems = null;
@@ -78,19 +96,26 @@ class Hodographs extends PlotComponent {
         this.gl_elems.bg_billboard.updateField(field.getStormMotionGrid());
         const profiles = this.profile_field.profiles;
         const { lats, lons } = this.profile_field.getProfileCoords();
+        const min_visible_zoom = this.profile_field.grid.getMinVisibleZoom(this.opts.thin_fac);
         const hodo_polyline = profiles.map((prof, iprof) => {
-            const zoom = getMinZoom(prof['jlat'], prof['ilon'], this.opts.thin_fac);
             return {
-                'offsets': [...prof['u']].map((u, ipt) => [u - prof['smu'], prof['v'][ipt] - prof['smv']]),
+                'offsets': [...prof['u']].map((u, ipt) => {
+                    if (isStormRelativeWindProfile(prof)) {
+                        return [u - prof['smu'], prof['v'][ipt] - prof['smv']];
+                    }
+                    return [u, prof['v'][ipt]];
+                }),
                 'vertices': [...prof['u']].map(u => [lons[iprof], lats[iprof]]),
-                'zoom': zoom,
+                'zoom': min_visible_zoom[iprof],
                 'data': [...prof['z']],
             };
         });
         const hodo_line = await PolylineCollection.make(gl, hodo_polyline, { line_width: this.opts.hodo_line_width, cmap: this.opts.height_cmap,
             offset_scale: this.hodo_scale * this.bg_size, offset_rotates_with_map: false });
         const sm_polyline = profiles.map((prof, iprof) => {
-            const zoom = getMinZoom(prof['jlat'], prof['ilon'], this.opts.thin_fac);
+            if (!isStormRelativeWindProfile(prof)) {
+                return { vertices: [] };
+            }
             const sm_mag = Math.hypot(prof['smu'], prof['smv']);
             const sm_ang = Math.PI / 2 - Math.atan2(-prof['smv'], -prof['smu']);
             const buffer = 2;
@@ -98,7 +123,7 @@ class Hodographs extends PlotComponent {
                 'offsets': [[buffer * Math.sin(sm_ang), buffer * Math.cos(sm_ang)],
                     [sm_mag * Math.sin(sm_ang), sm_mag * Math.cos(sm_ang)]],
                 'vertices': [[lons[iprof], lats[iprof]], [lons[iprof], lats[iprof]]],
-                'zoom': zoom
+                'zoom': min_visible_zoom[iprof]
             };
         });
         const sm_line = await PolylineCollection.make(gl, sm_polyline, { line_width: this.opts.background_line_width, color: this.opts.bgcolor,

package/lib/Map.d.ts

@@ -1,6 +1,7 @@
 type StyleSpecification = {
     glyphs?: string;
 };
+/** Type with the required methods for mapping libraries */
 type MapLikeType = {
     triggerRepaint: () => void;
     getCanvas: () => HTMLCanvasElement;
@@ -14,6 +15,8 @@ interface LambertConformalConicParameters {
     lon_0: number;
     lat_0: number;
     lat_std: [number, number] | number;
+    a: number;
+    b: number;
 }
 declare function lambertConformalConic(params: LambertConformalConicParameters): (a: number, b: number, opts?: {
     inverse: boolean;
@@ -26,6 +29,15 @@ interface RotateSphereParams {
 declare function rotateSphere(params: RotateSphereParams): (a: number, b: number, opts?: {
     inverse: boolean;
 }) => [number, number];
+interface GeostationaryProjectionParams {
+    lon_0: number;
+    alt: number;
+    a: number;
+    b: number;
+}
+declare function geostationaryProjection(params: GeostationaryProjectionParams): (a: number, b: number, opts?: {
+    inverse: boolean;
+}) => [number, number];
 /**
  * A `LngLat` object represents a given longitude and latitude coordinate, measured in degrees.
  * These coordinates are based on the [WGS84 (EPSG:4326) standard](https://en.wikipedia.org/wiki/World_Geodetic_System#WGS84).
@@ -49,5 +61,5 @@ declare class LngLat {
     };
     static fromMercatorCoord(x: number, y: number): LngLat;
 }
-export { LngLat, lambertConformalConic, rotateSphere };
+export { LngLat, lambertConformalConic, rotateSphere, geostationaryProjection };
 export type { MapLikeType };

package/lib/Map.js

@@ -9,8 +9,8 @@ function lambertConformalConic(params) {
         return Math.cos(lat) / Math.sqrt(1 - eccen * eccen * sin_lat * sin_lat);
     };
     // WGS 84 spheroid
-    const semimajor = 6378137.0;
-    const semiminor = 6356752.314245;
+    const semimajor = params.a;
+    const semiminor = params.b;
     const eccen = Math.sqrt(1 - (semiminor * semiminor) / (semimajor * semimajor));
     const radians = Math.PI / 180;
     let { lon_0, lat_0, lat_std } = params;
@@ -121,6 +121,53 @@ function rotateSphere(params) {
         return opts.inverse ? compute_rotation_inverse(a, b) : compute_rotation(a, b);
     };
 }
+// Changes to the geostationaryProjection to make sure the coastlines and satellite line up
+function geostationaryProjection(params) {
+    const radians = Math.PI / 180;
+    const { lon_0, alt, a, b } = params;
+    const lambda_0 = lon_0 * radians;
+    const a2 = a * a;
+    const b2 = b * b;
+    const forward = (lon, lat) => {
+        lon *= radians;
+        lat *= radians;
+        const cos_lat = Math.cos(lat);
+        const sin_lat = Math.sin(lat);
+        const cos_lon = Math.cos(lon - lambda_0);
+        const sin_lon = Math.sin(lon - lambda_0);
+        const rc = b / Math.sqrt(1 - (1 - (b2 / a2)) * cos_lat * cos_lat);
+        const sx = rc * cos_lat * cos_lon;
+        const sy = rc * cos_lat * sin_lon;
+        const sz = rc * sin_lat;
+        const x = Math.atan(-sy / (alt - sx));
+        const y = Math.atan(sz / Math.sqrt((alt - sx) * (alt - sx) + sy * sy));
+        return [x, y];
+    };
+    const inverse = (x, y) => {
+        // x = E-W scan angle (radians), y = N-S scan angle (radians)
+        // GOES-R PUG-L1B-vol3 Section 4.2 / Table 4.2.8-1
+        const sin_x = Math.sin(x);
+        const cos_x = Math.cos(x);
+        const sin_y = Math.sin(y);
+        const cos_y = Math.cos(y);
+        const a_var = sin_x * sin_x + cos_x * cos_x * (cos_y * cos_y + (a2 / b2) * sin_y * sin_y);
+        const b_var = -2 * alt * cos_x * cos_y;
+        const c_var = alt * alt - a2;
+        const disc = b_var * b_var - 4 * a_var * c_var;
+        if (disc < 0)
+            return [NaN, NaN]; // off-Earth scan angle
+        const rs = (-b_var - Math.sqrt(disc)) / (2 * a_var);
+        const sx = rs * cos_x * cos_y;
+        const sy = -rs * sin_x; // no cos_y factor
+        const sz = rs * cos_x * sin_y; // needs cos_x factor
+        const lon = lambda_0 - Math.atan(sy / (alt - sx));
+        const lat = Math.atan((a2 / b2) * (sz / Math.sqrt((alt - sx) * (alt - sx) + sy * sy)));
+        return [lon / radians, lat / radians];
+    };
+    return (a, b, opts) => {
+        return opts?.inverse ? inverse(a, b) : forward(a, b);
+    };
+}
 function mercatorXfromLng(lng) {
     return (180 + lng) / 360;
 }
@@ -151,19 +198,26 @@ function latFromMercatorY(y) {
 class LngLat {
     constructor(lng, lat) {
         if (isNaN(lng) || isNaN(lat)) {
-            throw new Error(`Invalid LngLat object: (${lng}, ${lat})`);
+            this.lng = NaN;
+            this.lat = NaN;
         }
-        this.lng = +lng;
-        this.lat = +lat;
-        if (this.lat > 90 || this.lat < -90) {
-            throw new Error('Invalid LngLat latitude value: must be between -90 and 90');
+        else {
+            this.lng = +lng;
+            this.lat = +lat;
+            if (this.lat > 90 || this.lat < -90) {
+                throw new Error('Invalid LngLat latitude value: must be between -90 and 90');
+            }
         }
     }
     toMercatorCoord() {
+        if (isNaN(this.lng) || isNaN(this.lng))
+            return { x: NaN, y: NaN };
         return { x: mercatorXfromLng(this.lng), y: mercatorYfromLat(this.lat) };
     }
     static fromMercatorCoord(x, y) {
+        if (isNaN(x) || isNaN(y))
+            return new LngLat(NaN, NaN);
         return new LngLat(lngFromMercatorX(x), latFromMercatorY(y));
     }
 }
-export { LngLat, lambertConformalConic, rotateSphere };
+export { LngLat, lambertConformalConic, rotateSphere, geostationaryProjection };

package/lib/Paintball.d.ts

@@ -1,8 +1,9 @@
 import { RenderMethodArg, TypedArray, WebGLAnyRenderingContext } from "./AutumnTypes";
-import { StructuredGrid } from "./Grid";
+import { DomainBufferGrid } from "./grids/DomainBuffer";
 import { MapLikeType } from "./Map";
 import { PlotComponent } from "./PlotComponent";
-import { RawScalarField } from "./RawField";
+import { ExpressionScalarField } from "./RawField";
+/** Options for {@link Paintball} components */
 interface PaintballOptions {
     /**
      * The list of colors (as hex strings) to use for each member in the paintball plot. The first color corresponds to member 1, the second to member 2, etc.
@@ -20,8 +21,16 @@ interface PaintballOptions {
  * the data for the paintball plot is given as a single field with the objects from each member encoded as "bits" in the field. Because the field is made up
  * of single-precision floats, this works for up to 24 members. (Technically speaking, I don't need the quotes around "bits", as they're bits of the
  * significand of an IEEE 754 float.)
+ *
+ * ## Grid Compatibility
+ * - :white_check_mark: `PlateCarreeGrid`
+ * - :white_check_mark: `PlateCarreeRotatedGrid`
+ * - :white_check_mark: `LambertGrid`
+ * - :x:                `UnstructuredGrid`
+ * - :white_check_mark: `RadarSweepGrid`
+ * - :white_check_mark: `Geostationary`
  */
-declare class Paintball<ArrayType extends TypedArray, GridType extends StructuredGrid, MapType extends MapLikeType> extends PlotComponent<MapType> {
+declare class Paintball<ArrayType extends TypedArray, GridType extends DomainBufferGrid, MapType extends MapLikeType> extends PlotComponent<MapType> {
     private field;
     readonly opts: Required<PaintballOptions>;
     private readonly color_components;
@@ -34,12 +43,12 @@ declare class Paintball<ArrayType extends TypedArray, GridType extends Structure
      *               `M2` is the same thing for member 2, and `M3` and `M4` and up to `Mn` are the same thing for the rest of the members.
      * @param opts  - Options for creating the paintball plot
      */
-    constructor(field: RawScalarField<ArrayType, GridType>, opts?: PaintballOptions);
+    constructor(field: ExpressionScalarField<ArrayType, GridType>, opts?: PaintballOptions);
     /**
      * Update the field displayed as a paintball plot
      * @param field - The new field to display as a paintball plot
      */
-    updateField(field: RawScalarField<ArrayType, GridType>): Promise<void>;
+    updateField(field: ExpressionScalarField<ArrayType, GridType>): Promise<void>;
     /**
      * @internal
      * Add the paintball plot to a map.