In [1]:
import sys
path ="/home/sergio/github/shaolin-master"
sys.path.append(path)

In [2]:
%%HTML
<style>
.container { width:100% !important; }
.input{ width:60% !important;
       align: center;
      }
.text_cell{ width:70% !important;
            font-size: 16px;}
.title {align:center !important;}
</style>


Disclaimer:

This notebook is a little oudated. The ColormapPicker now has been revamped with a new interface and includes all the colormaps from the colorcet package.


In [5]:
from IPython.display import Image #this is for displaying the widgets in the web version of the notebook
Image(filename='colors_data/new_cmappicker.png')


Out[5]:

Bending colors to your will with Shaolin

Index

1 Introduction

Choosing the right colors for a plot is a crucial step when trying to visualize data. As we all know, choosing the wrong colormap can totally change the way the end user percieves the meaning of the data and can distract the person who is interpreting the plot by emphatysing meaningless datapoints. When trying to simplify the colormap choosing when making a plot, Shaolin comes batteries included too! We are proud to announce that you no longer need to worry about color schemes.

2 Shaolin MasterPalette

The MasterPalette is a Dashboard inspired in the Seaborn palette widgets. It can generate any colormap from matplotlib or any colormap/palette generated with seaborn and creates both a colormap and a color palette with the selected colors that can be modified indepentdently.

In order to use it you only have to import the MasterPalette class.


In [3]:
from shaolin.dashboards.colormap import MasterPalette

In [4]:
mp = MasterPalette()

In [5]:
mp.widget

In [6]:
Image(filename='colors_data/img_1.png')


Out[6]:

In [7]:
Image(filename='colors_data/seq_pal.png')


Out[7]:

In [8]:
Image(filename='colors_data/cb_palette.png')


Out[8]:

In [9]:
Image(filename='colors_data/cubehelix_palette.png')


Out[9]:

In [10]:
Image(filename='colors_data/sea_palette.png')


Out[10]:

As you can see you have all the seaborn capabilities in a single widget. There are also two other improvements:

  • You can convert any scheme color to a list or a colormap with no limitation.
  • You can choose matplotlib colormaps directly from the seaborn palette widget when selecting as_cmap (not only palettes).
  • The last modified colormap can be accessed in the cmap attribute.
  • The last modified color palette can be accessed in the pal attribute.

3 Using the MasterPalette

3.1 Plotting the selected cmap and palette

The only limitation is that data should be flattened out, working with column vectors is not allowed.

Let's check if the colormap and the palette are generated correclty:


In [11]:
%pylab inline


Populating the interactive namespace from numpy and matplotlib

In [12]:
from seaborn.rcmod import axes_style
with axes_style("white"):
    f, ax = plt.subplots(figsize=(13.25, .75))
ax.set(xticks=[], yticks=[])
x = np.linspace(0, 1, 256)[np.newaxis, :]
mp.cmap,ax.pcolormesh(x, cmap=mp.cmap)


Out[12]:
(<matplotlib.colors.LinearSegmentedColormap at 0x7f16903d35f8>,
 <matplotlib.collections.QuadMesh at 0x7f1690238978>)

In [13]:
from seaborn import palplot
mp.pal,palplot(mp.pal)


Out[13]:
([array([ 0.91574749,  0.53728072,  0.03927007,  1.        ]),
  array([ 0.71391412,  0.43307751,  0.06353485,  1.        ]),
  array([ 0.50901245,  0.3272902 ,  0.0881685 ,  1.        ]),
  array([ 0.29595275,  0.21729102,  0.11378293,  1.        ]),
  array([ 0.133,  0.133,  0.133,  1.   ]),
  array([ 0.133,  0.133,  0.133,  1.   ]),
  array([ 0.11479329,  0.25300446,  0.22974791,  1.        ]),
  array([ 0.09050262,  0.40979444,  0.35606777,  1.        ]),
  array([ 0.06714203,  0.56058094,  0.47755085,  1.        ]),
  array([ 0.04413126,  0.7091095 ,  0.59721479,  1.        ])],
 None)

3.2 Mapping data to colors

Directly mapping data to colors is an straightforward process. You only have to pass the data you want to map to the map_data function of the MasterPalette. Lets generate some sample data to map first.


In [14]:
import numpy as np
data = np.random.normal(size=(50))
data[:5]


Out[14]:
array([ 0.17162542, -0.32607026, -0.16682964, -0.04760985, -0.58154984])

In [15]:
mapped_data = mp.map_data(data)
mapped_data[:5]


Out[15]:
array([[ 0.133     ,  0.133     ,  0.133     ,  1.        ],
       [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
       [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
       [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
       [ 0.21541914,  0.17571287,  0.12346483,  1.        ]])

Now let's check how the data mapping turned out


In [16]:
palplot(mapped_data)


3.3 Colors in Hex format

It is also posible to map data directly to web colors by changing the attribute _hex of the MasterPalette


In [17]:
mp._hex = True

if instead of changing the attribute _hex you pass hex=True as a parameter to the map_data function the mappa will be mapped as a hex value, but the default type of maping wont change if you map_data with no hex value.


In [18]:
mapped_data = mp.map_data(data)
mapped_data_no_hex = mp.map_data(data, hex=False)
mapped_data[:5],mapped_data_no_hex[:5]


Out[18]:
(['#222222', '#222222', '#222222', '#222222', '#372D1F'],
 array([[ 0.133     ,  0.133     ,  0.133     ,  1.        ],
        [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
        [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
        [ 0.133     ,  0.133     ,  0.133     ,  1.        ],
        [ 0.21541914,  0.17571287,  0.12346483,  1.        ]]))

4 Colormap picker

It is possible to use the MasterPalette as a standalone widget, but Shaolin also comes with a colormap picker ready to embed in any Dashboard. You only have to import it and its ready to use.

Its internal workings are just the same as the MasterPalette but with a more usefull layout.

You can click on the button to open the MasterPalette color selection menu, and the currently selected colormap will be displayed on the plot.


In [19]:
from shaolin.dashboards.colormap import ColormapPicker

In [20]:
cmp = ColormapPicker()

In [21]:
cmp.widget
Image(filename='colors_data/img_2.png')


Out[21]:

In [22]:
palplot(cmp.map_data(data))


The hex mode can be set by changing the master_palette._hex attribute of the ColormapPicker.