
Show HN: A WebGL visualization to show how global temperature changed since 1850 - callumprentice
http://callumprentice.github.io/apps/global_temperature_change_webgl/index.html
======
McKayDavis
Nice, but the rotate controls are a way too sensitive and spin the globe too
fast. I recommend you look into arcball rotation [1]. It's perfect for a
globe.

[1]
[http://nehe.gamedev.net/tutorial/arcball_rotation/19003/](http://nehe.gamedev.net/tutorial/arcball_rotation/19003/)

edit: Love the animated transition between the plate carrée projection and
sphere!

~~~
callumprentice
I like the feel of that affordance and will experiment with it. Have to bathe
my 5 year old princess now and read stories but I'll get to it later :)
Thanks!

------
euyyn
1998 looks like an inflection point. Before then, you'd see blues and reds;
after that, it's mostly just red everywhere. What's up with that?

~~~
more_original
In 1998 there was one of the strongest El Nino events.

[https://en.wikipedia.org/wiki/1997%E2%80%9398_El_Ni%C3%B1o_e...](https://en.wikipedia.org/wiki/1997%E2%80%9398_El_Ni%C3%B1o_event)

Maybe this made for a sudden increase, rather than a more gradual one.

------
TeMPOraL
Great and very pretty!

Besides the rotation issue pointed out by 'McKayDavis, I'd also suggest adding
some legends for data - maybe a constantly visible data range on the side,
that would help mapping the different shades of blue/red to actual values, and
also some popup when you hover or click on a particular tile of the globe/map.

~~~
thebeardedone
Really cool and interesting visualization.

Since this is most likely a common chart for people looking at climate change
and it may be explained by the parents feedback, I was wondering if anyone
knew what shades are held in reference to? Are they being compared to the
average temperature of the last century, average compared to 1849, or whether
its sort of a running diff to the previous year?

~~~
phaemon
If you click the question mark it gives some details on the data.

The temperatures are relative to a 1961-1990 average.

------
simple10
Love it! A few suggestions...

\- Set your Fb app to production so people can share on Facebook; currently
shows error about dev mode

\- Maybe increase the transparency of the tiles; people often like to focus on
their home country on a map; would make it easier

\- Add help tooltips over the navigation so it's easier to tell what each
button does

Thanks for creating this!

~~~
callumprentice
I made the changes you suggested - Facebook "add a share" button is a little
hard to grok but I think I fixed it.

Thank you!

~~~
gavinpc
I love the fact that you made this really slick interactive 3D data
visualization, but the Facebook share button is "a little hard to grok"!

Again, very well made. Really pleasant to play with, though troubling to see.
One thing I wonder is how are the temperature differentials normalized? In
other words, how are "full red" and "full blue" defined? The max and min of
the recorded ranges? Overall, or for that section/year? Etc.

Also, are those stars random?

Also, see
[https://news.ycombinator.com/item?id=12476945](https://news.ycombinator.com/item?id=12476945)

~~~
callumprentice
Thank you. I make a pass over the data, find the min/max values for cooler and
warmer and then use that to scale the color from full intensity (largest
changes) to least intensity (smallest change). Visually at least, it seems
mostly to agree with what the clever climate scientists have made in static
images. The range is calculated for the whole period so that comparing year to
year should be valid.

I didn't even consider blocked cookies - I set that flag in local storage
since it seemed important to show some instructions the first time you see it
but not thereafter. I'll experiment a bit and see if I can work around that.

Edit: stars are just a bitmap wrapper around a large sphere.

Cheers!

------
nojvek
Renders great on an iPhone. The zooming is a bit weird. You should look into
locking the viewport. Once you get to a zoom level it's really hard to get out
of it.

~~~
callumprentice
Thanks for the feedback. I tried adding a meta tag in the HTML header and that
actually makes a lot of things look nice (large, easy to hit buttons for
example) but disables pinch zoom.

Also hard to make everything fit - the UI components are all scaled up which
is nice but they no longer fit.

Lots to investigate!

------
gunn
"Your graphics card does not seem to support WebGL".

I've never failed to run WebGL before. Using chrome on mac.

~~~
callumprentice
That's odd - same sort of configuration as me (Chrome 51 on a pretty old iMac)

Fairly recent version of Chrome I presume? Other WebGL apps still run ok?

~~~
gunn
Huh, actually other WebGL demos aren't working for me now.

I'm on chrome 53 and chrome://gpu/ says: "WebGL: Hardware accelerated" but
canvas.getContext('webgl') returns null.

Anyway, I can run it nicely in firefox.

~~~
callumprentice
Interesting. I _think_ Chrome blacklists some GPUs and drivers occasionally so
maybe that's what happened. Glad it works ok on Firefox and thanks for the
feedback.

------
Annatar
"Waiting for syndication.twitter.com"

...and this is where I click the close button. No, you will not use me for
racking up your whatever.

------
mgalka
Cool map! Is that coded with Cesium?

~~~
callumprentice
No although that's a really great SDK. It uses three.js and plain old
JavaScript.

