Merge pull request #14 from nicfv/smath

JMath->SMath

CHANGELOG.md

@@ -1,5 +1,12 @@
 # Changelog
 
+## Unreleased
+
+- Add LBL/DOE notice in README
+- Replace custom `JMath` with [`smath`](https://www.npmjs.com/package/smath) dependency for linear interpolation functions
+- Default series names are numbered instead of lettered
+- Maximum of 100 data series rendered on Psychart
+
 ## 4.1.0
 
 - Update to the latest version of `@grafana/create-plugin` (4.0.1)

package.json

@@ -62,6 +62,7 @@
     "node": ">=20"
   },
   "dependencies": {
+    "smath": "1.1.1",
     "@emotion/css": "11.10.6",
     "@grafana/data": "10.0.3",
     "@grafana/runtime": "10.0.3",
@@ -72,4 +73,4 @@
     "tslib": "2.5.3"
   },
   "packageManager": "[email protected]"
-}
+}

src/color.ts

@@ -1,4 +1,4 @@
-import JMath from 'jmath';
+import { SMath } from 'smath';
 
 /**
  * Represents a class for storing an RGBA color value.
@@ -12,10 +12,10 @@ export default class Color {
      * Initialize a new color.
      */
     constructor(red: number, green: number, blue: number, alpha = 100) {
-        this.red = JMath.clamp(red, 0, 255);
-        this.green = JMath.clamp(green, 0, 255);
-        this.blue = JMath.clamp(blue, 0, 255);
-        this.alpha = JMath.clamp(alpha, 0, 100);
+        this.red = SMath.clamp(red, 0, 255);
+        this.green = SMath.clamp(green, 0, 255);
+        this.blue = SMath.clamp(blue, 0, 255);
+        this.alpha = SMath.clamp(alpha, 0, 100);
     }
     /**
      * Return the more contrasting color, black or
@@ -55,9 +55,9 @@ export default class Color {
             A = colors[n], // bucket min color
             B = colors[n + 1]; //bucket max color
         return new Color(
-            JMath.translate(x, a, b, A.red, B.red),
-            JMath.translate(x, a, b, A.green, B.green),
-            JMath.translate(x, a, b, A.blue, B.blue),
-            JMath.translate(x, a, b, A.alpha, B.alpha));
+            SMath.translate(x, a, b, A.red, B.red),
+            SMath.translate(x, a, b, A.green, B.green),
+            SMath.translate(x, a, b, A.blue, B.blue),
+            SMath.translate(x, a, b, A.alpha, B.alpha));
     }
 }

src/module.ts

@@ -3,7 +3,6 @@ import { DataSeries, PsyOptions } from 'types';
 import { PsyPanel } from 'panel';
 import Psychart from 'psychart';
 import { format, getFieldList } from 'formatter';
-import JMath from 'jmath';
 import { cleanDataOptions, cleanPsyOptions } from 'validator';
 
 export const plugin = new PanelPlugin<PsyOptions>(PsyPanel).setPanelOptions((builder, context) => {
@@ -111,7 +110,7 @@ export const plugin = new PanelPlugin<PsyOptions>(PsyPanel).setPanelOptions((bui
       settings: {
         integer: true,
         min: 0,
-        max: 104,
+        max: 100,
         step: 1,
       },
     })
@@ -125,7 +124,7 @@ export const plugin = new PanelPlugin<PsyOptions>(PsyPanel).setPanelOptions((bui
           // Force clean data options
           subcontext.options[i] = cleanDataOptions(subcontext.options[i] || {});
           // Use legend as subcategory or default string if none exists
-          const subcategory: string = subcontext.options[i].legend || 'Series ' + JMath.itoa(i);
+          const subcategory: string = subcontext.options[i].legend || 'Series ' + (i + 1);
           subbuilder
             .addTextInput({
               path: i + '.legend',

src/psychart.ts

@@ -1,6 +1,6 @@
 import Color from 'color';
-import JMath from 'jmath';
 import PsyState from 'psystate';
+import { SMath } from 'smath';
 import { PsyOptions, Datum, Layout, Point, Region, StyleOptions, GradientName, RegionName, DataOptions } from './types';
 
 const NS = 'http://www.w3.org/2000/svg';
@@ -261,7 +261,7 @@ export default class Psychart {
     static generateGradientIcon(gradient: GradientName): string {
         const maxColorIndex: number = this.gradients[gradient].length - 1;
         return '<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg"><defs><linearGradient id="grad" x1="0" y1="0" x2="1" y2="0">' +
-            this.gradients[gradient].map((color, i) => '<stop style="stop-color:' + color.toString() + '" offset="' + JMath.normalize(i, 0, maxColorIndex) + '" />').join('') +
+            this.gradients[gradient].map((color, i) => '<stop style="stop-color:' + color.toString() + '" offset="' + SMath.normalize(i, 0, maxColorIndex) + '" />').join('') +
             '</linearGradient></defs><rect style="fill:url(#grad);stroke:none" width="10" height="10" x="0" y="0" rx="2" ry="2" /></svg>';
     }
     /**
@@ -270,6 +270,12 @@ export default class Psychart {
     static getGradientIcon(gradient: GradientName): string {
         return require('img/' + gradient.toLowerCase() + '.svg');
     }
+    /**
+     * Convert from Celsius to Fahrenheit.
+     */
+    private static CtoF(C: number): number {
+        return SMath.translate(C, 0, 100, 32, 212);
+    }
     /**
      * Construct a new instance of `Psychart` given various configuration properties.
      */
@@ -357,9 +363,9 @@ export default class Psychart {
                 if (this.config.unitSystem === 'IP') {
                     // Convert from SI to US units
                     data.forEach(datum => {
-                        datum.db = JMath.CtoF(datum.db);
+                        datum.db = Psychart.CtoF(datum.db);
                         if (datum.measurement === 'dbdp' || datum.measurement === 'dbwb') {
-                            datum.other = JMath.CtoF(datum.other);
+                            datum.other = Psychart.CtoF(datum.other);
                         }
                     });
                 }
@@ -537,7 +543,7 @@ export default class Psychart {
      * Return the normalized value to use in the gradient calculation.
      */
     private getGradientX(x: number, min: number, max: number): number {
-        const normalized = JMath.normalize(x, min, max);
+        const normalized = SMath.normalize(x, min, max);
         return this.style.darkTheme ? normalized : 1 - normalized;
     }
     /**
@@ -590,15 +596,15 @@ export default class Psychart {
         // Generate the text to display on mouse hover.
         const tooltipString: string = (options.legend ? options.legend + '\n' : '') +
             new Date(time).toLocaleString() + '\n' +
-            JMath.round(currentState.db, 1) + this.units.temp + ' Dry Bulb\n' +
-            JMath.round(currentState.rh * 100) + '% Rel. Hum.\n' +
-            JMath.round(currentState.wb, 1) + this.units.temp + ' Wet Bulb\n' +
-            JMath.round(currentState.dp, 1) + this.units.temp + ' Dew Point' +
+            currentState.db.toFixed(1) + this.units.temp + ' Dry Bulb\n' +
+            currentState.rh.toFixed() + '% Rel. Hum.\n' +
+            currentState.wb.toFixed(1) + this.units.temp + ' Wet Bulb\n' +
+            currentState.dp.toFixed(1) + this.units.temp + ' Dew Point' +
             (options.advanced ? '\n' +
-                JMath.round(currentState.hr, 2) + ' ' + this.units.hr + ' Hum. Ratio\n' +
-                JMath.round(currentState.vp, 1) + ' ' + this.units.vp + ' Vap. Press.\n' +
-                JMath.round(currentState.h, 1) + ' ' + this.units.h + ' Enthalpy\n' +
-                JMath.round(currentState.v, 2) + ' ' + this.units.v + ' Volume' : '');
+                currentState.hr.toFixed(2) + ' ' + this.units.hr + ' Hum. Ratio\n' +
+                currentState.vp.toFixed(1) + ' ' + this.units.vp + ' Vap. Press.\n' +
+                currentState.h.toFixed(1) + ' ' + this.units.h + ' Enthalpy\n' +
+                currentState.v.toFixed(2) + ' ' + this.units.v + ' Volume' : '');
         // Set the behavior when the user interacts with this point
         point.addEventListener('mouseover', e => this.drawTooltip(tooltipString, { x: e.offsetX, y: e.offsetY }, color));
         point.addEventListener('mouseleave', () => this.clearChildren(this.g.tooltips));
@@ -613,11 +619,11 @@ export default class Psychart {
             const lastDatum = states[i - 1],
                 currentDatum = states[i];
             // Check if iso-relative humidity (curved line)
-            if (lastDatum.measurement === 'dbrh' && currentDatum.measurement === 'dbrh' && JMath.approx(lastDatum.other, currentDatum.other)) {
+            if (lastDatum.measurement === 'dbrh' && currentDatum.measurement === 'dbrh' && SMath.approx(lastDatum.other, currentDatum.other)) {
                 const range = Math.abs(currentDatum.db - lastDatum.db);
                 // Calculate several psychrometric states with a dry bulb step of `resolution`
                 for (let i = 0; i < range; i += this.style.resolution) {
-                    const db = JMath.translate(i, 0, range, lastDatum.db, currentDatum.db);
+                    const db = SMath.translate(i, 0, range, lastDatum.db, currentDatum.db);
                     data.push(new PsyState({ db: db, other: lastDatum.other, measurement: 'dbrh' }));
                 }
             }

src/psystate.ts

@@ -1,4 +1,4 @@
-import JMath from 'jmath';
+import { SMath } from 'smath';
 import { PsyOptions, Datum, Layout, Point } from 'types';
 const Psychrolib = require('psychrolib');
 
@@ -128,8 +128,8 @@ export default class PsyState {
      */
     toXY(): Point {
         return {
-            x: JMath.clamp(JMath.translate(this.db, PsyState.dbMin, PsyState.dbMax, PsyState.padding, PsyState.width - PsyState.padding), PsyState.padding, PsyState.width - PsyState.padding),
-            y: JMath.clamp(PsyState.height - JMath.translate(this.hr, 0, PsyState.hrMax, PsyState.padding, PsyState.height - PsyState.padding), PsyState.padding, PsyState.height - PsyState.padding)
+            x: SMath.clamp(SMath.translate(this.db, PsyState.dbMin, PsyState.dbMax, PsyState.padding, PsyState.width - PsyState.padding), PsyState.padding, PsyState.width - PsyState.padding),
+            y: SMath.clamp(PsyState.height - SMath.translate(this.hr, 0, PsyState.hrMax, PsyState.padding, PsyState.height - PsyState.padding), PsyState.padding, PsyState.height - PsyState.padding)
         };
     }
 }