improve colorscales - disable console.logs by default - etc

Author: archmoj

basic_plot.js

@@ -41,22 +41,38 @@ module.exports = function basicPlot (grid, canvas, call) {
 
     var p = 0;
     for (i = 0; i < nPoints; i++) {
-        var r = ratios[i];
+        var z = ratios[i];
         var q = 4 * (p++);
-        if (r === undefined) {
+        if (z === undefined) {
             img.data[q + 0] = 127;
             img.data[q + 1] = 127;
             img.data[q + 2] = 127;
             img.data[q + 3] = 127;
         } else {
-            img.data[q + 0] = 255 * r;
-            img.data[q + 1] = 0;
-            img.data[q + 2] = 255 * (1 - r);
-            img.data[q + 3] = 255;
+            var c = colorscale(z);
+            img.data[q + 0] = 255 * c.r;
+            img.data[q + 1] = 255 * c.g;
+            img.data[q + 2] = 255 * c.b;
+            img.data[q + 3] = 255 * c.a;
         }
     }
 
     ctx.putImageData(img, 0, 0);
 
     call.after();
 };
+
+function fn (v) {
+    return Math.sin(v * Math.PI);
+}
+
+function colorscale (ratio) { // 0 to 1
+    var v = 2 * ratio - 1; // -1 to +1
+
+    return {
+        r: v > 0 ? fn(v) : 0,
+        g: 0,
+        b: v > 0 ? 0 : fn(-v),
+        a: Math.abs(v)
+    };
+}

interactive_plot.js

@@ -31,7 +31,13 @@ module.exports = function interactivePlot (grid, div, call) {
         type: "heatmap",
         z: z,
         hovertemplate: "%{z:.1f}K<extra>(%{x}, %{y})</extra>",
-        colorscale: "Portland",
+        colorscale: [
+            [0.0, "rgb(0, 0, 127)"],
+            [0.2, "rgb(0, 0, 255)"],
+            [0.5, "rgb(255, 255, 255)"],
+            [0.8, "rgb(255, 0, 0)"],
+            [1.0, "rgb(127, 0, 0)"]
+        ],
         colorbar: {
             len: 0.5
         }

opengrib2.js

@@ -1,6 +1,7 @@
 "use strict";
 
-var isInteractive = true; // could be set to false for non-interactive graphs - useful e.g. for working with the ensembles
+var isInteractive = true; // true: using plotly.js | false: without plotly.js - useful e.g. for working with the ensembles
+var showConsoleLogs = false;
 
 var basicPlot = isInteractive ? null : require("./basic_plot.js");
 var interactivePlot = isInteractive ? require("./interactive_plot.js") : null;
@@ -49,16 +50,20 @@ function getLocalMocks () {
     ];
 }
 
-console.log("process.env.NODE_ENV='" + process.env.NODE_ENV + "'");
+function echo (txt) {
+    if (showConsoleLogs) console.log(txt);
+}
+
+echo("process.env.NODE_ENV='" + process.env.NODE_ENV + "'");
 var mocks;
 switch (process.env.NODE_ENV) {
     case "proxy-data":
         mocks = getLiveMocks();
-        console.log("Using grib2 data fetched from Datamart using proxy server!");
+        echo("Using grib2 data fetched from Datamart using proxy server!");
         break;
     case "local-data":
         mocks = getLocalMocks();
-        console.log("Using local (already downloaded) grib2 data");
+        echo("Using local (already downloaded) grib2 data");
         break;
     default:
         console.error("BAD BUNDLE");
@@ -99,7 +104,7 @@ var beforeAfter = {
 };
 
 function go (link) {
-    console.log("Loading:'" + link + "'");
+    echo("Loading:'" + link + "'");
     enableLoading();
 
     link = link.replace("https://", "http://");
@@ -125,7 +130,7 @@ function go (link) {
         });
         res.on("end", function () {
             myGrid.parse(Buffer.concat(allChunks));
-            console.log(myGrid);
+            echo(myGrid);
 
             if (isInteractive) {
                 interactivePlot(myGrid, document.getElementById("interactivePlot"), beforeAfter);