Twitter Dots

This polka-dot visualization shows a dot for each of 140 popular Twitter feeds (as identified by Time Magazine).

The size of the dot indicates popularity. Justin Bieber should be easy to find: the biggest green dot indicates Justin.
- Try to find Justin: click and drag the sphere to turn it around - To see Justin's latest tweets, point at his dot for a second

Having trouble finding Justin? He's here.

The color of the dot indicates category. Notice a lot of light green dots near Justin? Those are Celebrities such as:
Lady Gaga,
Taylor Swift and
Felicia Day

Next: Trenders

Tweet Clusters

Like many entertainers, the stars of Twitter trend up and down. Some twitter stars trend together: they peak and fall similarly. Dots close to each other trend together.

For example, there is a group of commentators such as:
Conan O'Brien (a TV host),
Tim Siedell (a satirist), or
Nick Kristof (a journalist).

There are loners in sparse regions where the tweeters have few correlations, such as:
John McCain (a politician),
Michelle Malkin (a blogger), or
Xeni Jardin (a tech culture journalist).

And there are a surprising number of deal feeds near the celebrities.

Next : Anti-Justin

Focus Tweeter

To see the correlations to any particular dot, click that dot (e.g. click on Justin Bieber) and all other dots will color according to their trend correlation, from
- greens (strongly correlated)
- yellow (no correlation)
- reds (inversely correlated).

Close dots, in bright green, are highly correlated. Far away dots, in red, are inversely correlated.

Compared to Justin, on the flip side are users whose tweets trend inversely, such as:
Alyssa Milano,
Margaret Atwood, or
Harvard Business Review.

In between, yellowish-green, are tweeters that do not trend at all like Justin, such as:
Nancy Pelosi (a politician),
Pimco (a financial company), or
Paul Kedrosky (an economist)

Next : Rising Stars

Up and Comers

Uptrends in the last few months of 2011 are indicated by needles pointing out from the dot:
Colson Whitehead (author),
Apolo Ohno (speed skater)
Similarly recent downtrends are are indicated by needles pointing in, e.g.:
Aziz Ansari (comedian)

Explore

Look around: There are lots of ways to explore the sphere. Drag, point or click. Or on the left panel:

Start typing in the search box to find feeds, e.g. “john”
Click any category in the legend to see those feeds located relative to each other
Click flip to see who is on the opposite side of the current view.

Alternate Layouts

The sphere provides an intuitive paradigm for correlations - what's inversely correlated is on the opposite side of the sphere. It is also interesting to see how these clusters appear in other layouts.

More Info

This twitter sphere is based on Time Magazine's 140 Best Twitter Feeds. There are many ways to compute correlations: here we used Google Trends to get a half decade of data, calculated all correlations (19,600 combinations) and set out the dots using a force-based algorithm (click recalc at the bottom to recompute the layout).

Spheres can be used to visualize a wide variety of correlation data - but not all data is best visualized on spheres. We are researching sphere-based visualizations to determine what works and what doesn't. Email us for more information.

Stock Correlation

Correlations can be useful in financial portfolios to increase diversification, evaluate hedges, and find similar alternatives.

For example, diversification reduces risk by investing in a variety of assets. If the asset values do not move up and down in synchrony, a diversified portfolio will have less risk than the average risk of its constituent assets.

Correlations are a way to compute the relationship between any two assets. In this visualization, close dots have strong correlations. Dots on the opposite side of the sphere have inverse correlations.

For example, Exxon (XOM), Walmart (WMT) and Google (GOOG) are all closely correlated, meaning their prices tended to move up and down towgether in 2010.

Next > Inverse.

1 2 3 Next >

Inverse Correlations

Stocks on the opposite side of the sphere are as far away as possible from each other and tend to be inversely correlated.

For example, Apple and Microsoft moved inversely during 2010 as can be seen by being opposite on the sphere. In 2010, owning both of these stocks could have offset the returns of the other.

To see the correlations to any particular dot, click that dot and all other dots will color according to their correlation, from
- green (strongly correlated) to
- yellow (no correlation) to
- red (inversely correlated).

To see the inverse correlation, click the flip button on the left panel.

Mouse over any dot to see the name of that stock, and to see the degree of correlation with the selected stock.

Next > Filter and Search

1 2 3 Next >

Filter and Search

Interestingly, stocks do not necessarily cluster by industry. For example, many stocks in the Info Tech sector are NOT clustered together NOR opposite meaning that prices between those stocks were loosely correlated, while stocks in the Utilities sector and Telco sector are somewhat closer. Click on any industry in the legend to highlight those stocks.

Use Search to find specific stocks and identify highly correlated stocks close by. E.g. enter IBM, HNZ (Heinz) or BA (Boeing).

Note that some stocks, such as AAPL (Apple) have many other highly correlated stocks close by, while some stocks do not have any close correlations, as can be seen by their isolation, e.g. BA (Boeing) or MET (Metlife)

1 2 3 Restart Twitter and more

// The 4x4 world view projection matrix.
        uniform mat4 worldViewProjection;
        uniform mat4 worldInverseTranspose;

// positions of the light and camera
        uniform vec3 light_pos;
        uniform vec3 camera_pos;

// input parameters for our vertex shader
        attribute vec4 position;
        attribute vec4 color;
        attribute vec3 normal;

// pass to the fragment shader
        varying vec3 pViewPosition;
        varying vec3 pLightVector;
        varying vec3 pNormal;
        varying vec4 fragmentColor;

// All vectors are normalized for proper calculations.
        void main() {
        vec3 lightVector = light_pos - position.xyz;
        vec3 viewPosition = camera_pos - position.xyz;

pLightVector = normalize(lightVector);
        pNormal = normalize(worldInverseTranspose * vec4(normal, 0.0)).xyz;
        pViewPosition = normalize(viewPosition);

gl_Position = worldViewProjection * position;
        fragmentColor = color;
        }

// phong lighting components of the light source
        uniform vec4 light_ambient;
        uniform vec4 light_diffuse;

// Fog parameters
        uniform vec4 fog_color;
        uniform float fog_density;

// shininess of the material. (for specular lighting)
        uniform float shininess;

// global alpha
        uniform float alpha;

// passed from the vertex shader
        varying vec3 pViewPosition;
        varying vec3 pLightVector;
        varying vec3 pNormal;

// color of the material
        varying vec4 fragmentColor;

/**
        * We use the standard phong illumination equation here.
        * We restrict (clamp) the dot products so that we
        * don't get any negative values.
        * All vectors are assumed normalized by the vertex shader.
        *
        * The output color is the summation of the
        * ambient, diffuse, and specular contributions.
        */
        void main() {

float lightSign = dot(pNormal, pLightVector);
        float cameraSign = dot(pNormal, pViewPosition);

//float diffuseComp = cameraSign < 0.0 ? dot(-0.15 * pNormal, pLightVector) : lightSign;

float diffuseComp = cameraSign <= 0.0 ? 0.1 : lightSign;
        float ambientComp = max(0.4, 1.0 - diffuseComp);

/*
        // Per-pixel exponential fog
        const float LOG2 = 1.442695;
        float z = gl_FragCoord.z / gl_FragCoord.w;
        float fogFactor = exp2( -fog_density * z * z * LOG2 );
        fogFactor = clamp(fogFactor, 0.0, 1.0);

gl_FragColor = mix(fog_color, color, fogFactor);
        */

}

// phong lighting components of the light source
        uniform vec4 light_ambient;
        uniform vec4 light_diffuse;

// Fog parameters
        uniform vec4 fog_color;
        uniform float fog_density;

// shininess of the material. (for specular lighting)
        uniform float shininess;

// global alpha
        uniform float alpha;

// passed from the vertex shader
        varying vec3 pViewPosition;
        varying vec3 pLightVector;
        varying vec3 pNormal;

// color of the material
        varying vec4 fragmentColor;

float lightSign = dot(pNormal, pLightVector);
        float diffuseComp = lightSign;
        float ambientComp = max(0.15, 1.0 - diffuseComp);

vec4 ambient = light_ambient * ambientComp * fragmentColor;
        vec4 diffuse = light_diffuse * diffuseComp * fragmentColor;
        vec4 color = vec4((ambient + diffuse).rgb, alpha);
        gl_FragColor = color;
        /*
        // Per-pixel exponential fog
        const float LOG2 = 1.442695;
        float z = gl_FragCoord.z / gl_FragCoord.w;
        float fogFactor = exp2( -fog_density * z * z * LOG2 );
        fogFactor = clamp(fogFactor, 0.0, 1.0);

gl_FragColor = mix(fog_color, color, fogFactor);
        */

}

Twitter Correlation Sphere

Interact

Find

Colors

Twitter Dots

Tweet Clusters

Focus Tweeter

Up and Comers

Explore

Alternate Layouts

More Info

Stock Correlation

Inverse Correlations

Filter and Search