Showing posts with label data visualisation. Show all posts
Showing posts with label data visualisation. Show all posts

Friday, 12 December 2014

Tides

Ocean tides are one of the most amazing but overlooked natural wonders of our planet. As the Earth rotates relative to the sun and the moon, their gravity drags the Earth's water about, raising and lowering it in synchrony with the heavens. The importance of tides reaches further than just surfing, sunbathing and shipping: Tides are the reason the moon is drifting away from the Earth at 3.8 cm per year. Tides allow the formation of beaches with rock pools at low tide, that some biologists argue helped the evolution of early life. Tides (of the atmosphere) are the reason a satellite in a low orbit is more likely to burn up on the side of the Earth nearest or opposite to the moon. Tides even influence the time  earthquakes happen.

The explanation of why tides happen is classic high school geography/physics. The gravitational pull of an object is felt more strongly by something close to it. In the case of the Earth, this means that the oceans on the closest side of the Earth to the moon feels a stronger gravitational pull than the Earth as a whole, and the oceans on the far side feel a weaker pull. This means that the oceans on the near side of the Earth are pulled into a bulge (a region of high tide) and the oceans in the far side are also flung outward into a bulge (another region of high tide). This causes high and low tides twice per day. Throw in the similar contribution of the sun's gravitational pull, and it also explains spring tides around the time of the new and full moon.

Of course this is all a bit of a lie to simplify things. Many places have one  high and low tide per day, and a few places even have four. Some places have barely any tide, while others have very large tides where the water level can change by many metres. Why? Because the land gets in the way! It is impossible to have a bulge of water where Africa is, even if the moon was directly over the Sahara. So what does the pattern of tides actually look like?

Something like this:


[Watch in HD on YouTube]

This animation shows sea levels over the course of one day, where orange represents high water level, and blue represents low water level. Instead of the water levels changing because of two big bulges of water, there are instead complex patterns of water level change.

So, how does the simple rotation of the Earth relative to the sun and moon generate such complexity? It is easiest to think about the oceans as containers of water which gently slosh about as the water gets pulled by the gravity of the sun and moon. It is a bit like the sloshing of water you get carrying a glass of water, or when you climb out of a bathtub. The precise pattern of the sloshing depends on many things; the strength and direction of the gravitational force driving the sloshing, the depth of the water, and how the oscillating sloshing movement resonates when it gets trapped against the coastline.

The different water movements that make up the final tidal moment can be broken down by the force that generated them (the sun, the moon) and their frequency (once a day, twice a day). The two biggest contributing movements are a twice daily movement arising from the moon, and a once daily movement due to the combined action of the sun and moon.

These individual movements are mapped through their amplitude (how much the water changes height) and their phase (the relative time of high tide). These maps are surprisingly beautiful! Here are a couple of examples:


These are the patterns of movement of the "M2" part of tides, which is a twice daily water movement arising from the primary action of the moon's gravity. Brightness represents the amplitude, from black (zero amplitude) to white (5 metres amplitude). The coloured lines are a bit more complex. They represent the places where the highest water level occurs due to the M2 tidal component at different times, from red (at 0 hours) through the colours of the spectrum at 1 hour steps.



These are the patterns of movement of the "K1" part of tides, which is a once daily water movement arising from the combined action of the sun's and moon's gravity. Again, brightness represents amplitude, but the amplitudes are smaller and white represents only 2.5 metres. The coloured lines represent the time when highest water level due to the K1 tidal component occur, but this time separated by 2 hour steps.

These are just the two largest components of tides, there are many complex contributing factors: M2: principal semi-diurnal lunar, S2: principal semi-diurnal solar, N2: larger semi-diurnal elliptical lunar, K2: declinational semi-diurnal solar/lunar, 2N2: second-order semi-diurnal elliptical lunar, K1: principal diurnal solar/lunar, O1: principal lunar, P1: principal diurnal solar, Q1: larger diurnal elliptical lunar. Each of these components has similarly beautiful patterns of movement.

Software used:
ImageJ: HAMTIDE tital data plotting.

Thursday, 30 January 2014

Figuring Out Good Figures

The main point of doing scientific research is to share the things you discover. After all, what is the point if discovering something if no one knows about it, to work or learn from it? Science is typically shared in research papers, but the actual date is normally just in the figures (the graphs and images) while the the text describes what it means (as I have talked about before). Sharing scientific data is important, therefore good design of figures is also important. So how do you make a good figure?

Each term I make a research comic for the Oxford University Biochemical Society magazine called Phenotype. This one is all about figuring out figures. How do you make a good one, and how can you avoid getting tricked by bad ones?



Check out the comic here, the whole issue is available to download for free from here.

Software used:
Inkscape: Page layout and drawing.

Thursday, 17 January 2013

Colour Monitor


Mood of an image is hard to measure... but with hue, saturation and luminance ("spectral shade", "colourfulness" and "brightness") you can get a good idea. I wrote a website that can analyse the colours present in any image you give it. You can try it out here.

So how about some simple examples? Lets try these images:

Blue, a wet car.

Green, a conifer frond.

Red, champagne bubbles.

These simple examples give a clear impression about how the plots work: in the middle is a circular histogram of the colours (spectral shades) in the image, and gives an idea of how much of each colour there is. Up the left is a histogram of image brightness (lightness of colour), and up the right is a histogram of colour saturation (vibrancy).

Together these three measures give an impression of the mood of an image: its key colours, how vibrant they are and how bright they are. The main colours of this image are easy to pick out:


While my site lets you explore the colours that make an image appear vibrant and interesting it also reveals one of the tragedies of modern cinema; the teal/orange colour grading madness.

Screenshots from Transformers 2, Tron: Legacy, Hot Tub Time Machine, Iron Man and Wolfman.

So many blockbusters use orange and teal colour grading that a lot of modern films basically only have two colours: teal or orange. Bring back our other colours!


Software used:
Paint.NET: screenshot management.

Wednesday, 14 November 2012

Live Earthquake Monitor - WebGL

Earthquakes, while devastating, are an amazing natural phenomenon. When, where and how deep under the Earth's surface tell us a huge amount about the way the Earth works...

About 18 months ago I made an interactive, live and very informative website mapping recent earthquakes:

This was my first ever interactive website of this type of complexity and I am still very proud of the result! Still, styles change, my programming ability improves and, most importantly, new technology becomes available. This is the all-new updated result:

This new version makes use of WebGL which is a new way of displaying 3D graphics in your browser. This technology is not available in all web browsers yet (it is available in recent versions of Firefox and Chrome) but allows fast, smooth, full 3D graphics. In short it looks beautiful, try it out!

Software used:
Three.js: Excellent javascript library to simplify using WebGL.

Wednesday, 3 October 2012

Dynamic word mapping

Word maps or word clouds are a great way of mapping out the important words in a paragraph of text. Words that appear more often (excluding very common words) appear larger, concisely summarising the paragraph.

This dynamic word map:
Is the word map from this paragraph of text (from Wikipedia):
A mind map is a diagram used to represent words, ideas, tasks, or other items linked to and arranged around a central key word or idea. Especially in British English, the terms spidergram and spidergraph are more common, but they can cause confusion with the term spider diagram used in mathematics and logic. Mind maps are used to generate, visualize, structure, and classify ideas, and as an aid to studying and organizing information, solving problems, making decisions, and writing.The elements of a given mind map are arranged intuitively according to the importance of the concepts, and are classified into groupings, branches, or areas, with the goal of representing semantic or other connections between portions of information. Mind maps may also aid recall of existing memories.By presenting ideas in a radial, graphical, non-linear manner, mind maps encourage a brainstorming approach to planning and organizational tasks. Though the branches of a mindmap represent hierarchical tree structures, their radial arrangement disrupts the prioritizing of concepts typically associated with hierarchies presented with more linear visual cues. This orientation towards brainstorming encourages users to enumerate and connect concepts without a tendency to begin within a particular conceptual framework.The mind map can be contrasted with the similar idea of concept mapping. The former is based on radial hierarchies and tree structures denoting relationships with a central governing concept, whereas concept maps are based on connections between concepts in more diverse patterns. However, either can be part of a larger personal knowledge base system.


There are some very cool online tools, like Wordle, for making word maps like these, but they are not "dynamic". I wanted one where it constantly updates as you type the words in... so I made one! Try it out here.

The logic for making the word map is quite simple. Imagine making a word map based on each word that appears in this sentence, what would that word map look like?

  1. Take the input: "Imagine making a word map based on each word that appears in this sentence, what would that word map look like?"
  2. Filter out the 100 most common words and all capital letters and punctuation. This leaves: imagine, making, map, based, appears, sentence, map
  3. Count the number of times each of these words occurs: imagine (1), making (1), map (2), based (1), appears (1), sentence (1)
  4. Starting with the most common word add them to the mind map. For each word start in the middle and spiral outwards, placing each word at the first place where there is a big enough space for it (based on its bounding box):
This is a really simple way to summarise text in a surprisingly accurate way, this is the word map of the abstract from my PhD thesis:
I think it summarises what I worked on very well!

Websites:
Dynamic word mapper at richardwheeler.net

Sunday, 13 May 2012

FatFonts

FatFonts are a great new concept by Miguel Nacenta, Uta Hinrichs, and Sheelagh Carpendale for presenting numerical data in an easy to understand way, but while leaving the numbers readable.

The idea is that numbers with a large value appear fatter and darker than numbers with a small value which appear thinner and lighter. This means that if you want to plot something like a height map, where each pixel has a value equal to its height, you can just write out the numbers and they build the image for you. The really clever bit is that if you have a multiple digit number, like 8242, the 8 (8 thousand) appears biggest, the first 2 (2 hundred) appears a bit smaller, the 4 (4 tens) appears even smaller and the last 2 (2 units) appears tiny.

It is always easier to explain concepts like this with a picture, so here is some data:


It is hard to look at this and see the shape of the data, but if you use a FatFonts presentation (this font is called Miguta):


You can now actually see the shape of the data, where the bigger numbers are and where the smaller numbers are. This example is of the number 8242 I mentioned above:


The 8 is biggest (8 thousands), the 2 is nested inside it (2 hundreds), then the 4 (4 tens) and finally the last 2 (2 units) is too small to see.

I have coded a couple of fonts (Miguta and 7 Segments) for Miguel Nacenta to make this technique really easy to use. Check out the FatFonts 'how to use' guide for more information.

Update: 17/05/2012
And here is an example of my FatFonts 7 Segments design in action; http://studiolakmoes.nl/datavisualisatie-met-fat-fonts/

Software used:
Inkscape: Managing Miguel's glyph designs
Fontforge: Font preparation and contextual alternates coding

Monday, 17 January 2011

Visualising Large Data Sets - Exoplanets - The Video

Exoplanet discovery, from 1988 to 2010...

Watch it on YouTube! Over a decade of data, 300 planetary systems and 50 million cubic light years in just over 2 minutes.

Software used:
ImageJ - scripting and rendering of the video frames
FFMpeg - video transcoding

Sunday, 16 January 2011

Visualising Large Data Sets - Exoplanets

Extremely large data sets pose extremely large challenges... A data set like all confirmed planets around stars other than the Sun (518) and where they sit among the 70000 stars that lie within 200 parsecs (670 light years) of the Sun is a challenge. What better way to show it than with an animation which tracks the discovery of each exoplanet, which star it orbits, where that star is in 3D space relative to the Sun, and the various orbital properties of the planet...

The data
The data I have used is from two totally open, and very useful, data sets: http://exoplanets.org/ for panetary data and http://astronexus.com/node/34 for star data.

Step 1: The timeline.
Exoplanet discovery streaches from 1988 to now. Back in 1988 the first report of evidence for a planet around another star, gamma Cephei, was published and was eventually confirmed as correct in 1996. This sparked huge new interest in exoplanets and since then the number of exoplanets discovered each year has shot up, reaching nearly 100 in 2010. As data from NASA's Kepler mission is confirmed over the course of 2011 this number is likely to shoot up again.
Each planet is added to the final diagram, showing both its 3D location and orbital properties, in the year of its discovery. The entire animation lasts 3200 frames; roughly 2 mins. In 2010 a new planet appears nearly every frame of the animation!

Step 2: The 3D location
The 3D location of many stars near Earth are known, their position is calculated by the position they lie in the sky and the distance to the star as calculated from stellar parallax. This gives fairly accurate 3D locations for many stars within aroun 200 parsecs of Earth. Data about the star's brightness (absolute magnitude) and colour (from the B-V index) can also be used to make a nice looking picture of the Sun's neighbourhood. Unfortunately not many programs can cope with this kind of complex plotting, so I wrote my own:

I use the camera location (rotation around the z axis (theta), angle of elevation (phi) and image scale) and the x, y, z location of a star to project the location of the star onto a 2D image.
a=x*sin(theta)+y*cos(theta)
b=-x*cos(theta)+y*sin(theta)
c=b*sin(phi)+z*cos(phi)
The projected position of the star in the final image is a, c. The star's brightness and colour were then calculated to choose the pixel colour at the star's position.

This picture shows a section of the final 3D starmap. It is animated by rotating it gradually around the z axis to highlight the 3D effect.

Step 3: The planetary system
The most interesting thing about the exoplanet star systems is their arrangement; how big the planets are, how far they are from their parent star and what shape their orbits are. All these properties are summarised in just 3 numbers: estimated minimum mass (measured in Jupiter masses), semi-major axis (a measure of orbit size, normally measured in astronomical units) and orbit ellipticity (which describes how far from circular the orbit is). With a bit more maths a to-scale diagram of the planetary system is drawn in the animation as each new exoplanet is discovered.

The animation
The full animation should be finished soon, I will post it here when it is done...