Sunday, July 20, 2014

Trends of gridded BEST and GISS shown with WebGL

This is a next stage in the display of Earth data with WebGL. It uses the general framework described here. BEST and GISS are temperature anomaly datasets, available on a 2° by 2° grid. In fact, BEST has 1° resolution, but I amalgamated cells to match GISS, mainly to alleviate download time. GISS uses ERSST ocean data.

For each cell, an OLS trend coefficient over time (°C/century) is calculated and shown with color shading. You can choose start and end years, from 1889 to 2013. Press "Plot New" when you have made a choice. The Earth is a trackball, as in Google Earth. You can press "Orient" to get it right way up.

When you click on any point, the location and trend are shown on the right.

BEST describe their methodology in various papers, access from here. GISS methods are described here, with links.

Update. I've implemented Carrick's suggestions - see below plot for details.


Following Carrick's suggestions I have provided a new set of inputs, blue box on right. The simplest is "Level"; you can enter a level (eg 0) that you want to show in white. It isn't complete for contouring because in some gradients that level will be skipped. But it gives a guide.

The top window is marked mean,sd. The color scheme is set by two parameters, mean and sd of data. These are shown below the text box. If you enter two corresponding numbers in the text box, that will override. Two ways you might use this:
  • You can force two plots to have matching color levels. Just copy the numbers from one into the text box of the other.
  • If you really want to emphasise the transition through a certain level, choose that as the mean, and put in a fairly small sd. The result will be mainly red and blue, but showing the transition region (eg 0) in colors.
In both cases, when you have entered the numbers you want, click the Go button. This will implement and redraw. If you want to go back to the way things were, enter NaN as number data and click Go.

More on how it works

You can check the gallery for other similar WebGL interfaces.  There is a general discussion of WebGL here. You can zoom the plot by moving the pointer vertically with the right button pressed. Up is bigger.


I'll include HADCRUT and NCDC grids and promote to a page, when it has ettled. HAD and NCDC only have 5° resolution. I'm also planning to make a gridded plot of just GISS anomalies as a maintained page, since GISS keeps data up to date.


  1. Nick, thanks for another great visualization tool. The only things I wish were different were

    1) a common scale for the two series.
    2) A visual way to distinguish positive from negative trends.
    3) having a way to compare them together like this would be ultra cool.

    1. Thanks, Carrick. On common color scale, I rely on automatic scale setting (locally, in JS). The range varies a lot with length of time period. To make them comparable, I'd have to preset. But the data I store is currently cumulative sums of yx and y, and it only gets converted into trends at the user end. So it's awkward.

      The simplest way to do side by side is with two browser windows. I use absolute picture setting, so you can contract the window to leave just the picture, and resize with Ctrl- etc.

      On pos and neg, I have sometimes made 0 a special color. It's too messy for general use, but I could offer it as an option. In fact, I guess I could offer complete user control of color scheme. That might fix everything, for sophisticated users.