Python Tutorial: Customizing glyphs

We've seen how to create and use glyphs and specify their basic visual properties. Sometimes it's useful to be able to alter the appearance of a glyph in certain situations. For instance, when a user makes a selection or hovers over the glyphs. Let's see how the visual appearance of glyphs can be altered in these situations. Bokeh has several different tools to enable users to select points on a plot using a mouse or touch interactions. In this example, we create a figure that specifies tools Box select Lasso select this configures our plot to have two different kinds of selection tools. A Box select tool that allows users to select points by dragging a rectangular region over the plot, and a lasso tool that allows points to be selected by drawing a freeform curve when points are selected using one of Bokeh's selection tools. How is this fact made visually evident? By default, once a selection is made, Bokeh draws all the non selected points with a very low transparency or alpha value. However, it's possible to customize this behavior. To do so, we simply pass additional arguments to the glyph method. These arguments are the same visual properties we've already seen, such as fill color, except that they either have the prefix selection or non selection. Let's take a look at the call to circle in this example. Here we specify selectioncolor red. This configures the plot so that whenever a selection is active, all the selected points have a fill color of red. Note that the argument color is just a shorthand for specifying fill color and line color at the same time. Additionally, we specify non selection fillalpha equals 0.2 and non selection fillcolor gray. These two arguments configure the plot so that whenever there is a selection made, all the non selected points will be shaded gray with a high transparency. The two plots here show the effects before and after a selection. Before the selection, all the circles are drawn with a default appearance after a selection is made. With the Box select tool, the unselected points outside the box are gray and transparent, and the selected points inside the box are all shaded red. It's also possible to add a hover tool to Bokeh plots. The hover tool can be used to drive hover tooltips, which we'll see later, but can also be used to inform changes to the visual appearance of glyphs. The hover tool is a bit more sophisticated. Let's first take a look at how it's added. In this example, first we import hovertool From Bokeh models, we create a hover tool instance called hover. By calling the hovertool initializer, we pass in the arguments tooltips none and mode equals hline. This configures the hover tool not to display any tooltips and to use a horizontal line under the current mouse position to perform hover inspections. We add this tool as well as a crosshair tool to our plot by passing a list containing the hover tool and the string name crosshair to the tool's argument to figure out. Having added our hover tool, we can now also specify a hover policy. This is very similar to how selection policies are specified. Instead of property names prefixed with selection or non selection, we can add property names prefixed with hover. In this example, we have added hovercolor red to our call to circle. Accordingly, whenever a circle is hovered over, it is drawn as red. All other circles are drawn in their normal fashion. Finally, let's look at one more important way to customize visual appearance that has to do with shading groups of data differently. Let's consider the iris data, which has data for three different species of flower. What if we want to shade each species differently? We could make three separate calls to circle, each with a subset of the data and a different single color. Or we could make a single call to circle with a column of colors that we compute by hand based on the species. But there's often a better way, which is to configure the color properties with a color mapper that refers to some other column that should already be in the data. Let's take a closer look. First, we need to create a categorical color mapper. In this example, we want to import it from Bokeh models. The colormapper needs to be configured with two arguments. The first is a list of the values to map. In this case, it's the three species names from the data Setosa, Virginica and Versicolor. Next, we also have to supply a palette which is just a list of colors. We provide an explicit palette red, green, blue. But there are many built in palettes available in the Bokeh palettes module that can be used as well. Finally, we configure the glyph to use this mapper. This is done in a slightly different way than we have seen so far. For the color argument, we pass a dictionary. This dictionary has a key for field with the value being the name of the column to map. In this case, it's the column name species. It also has a key for transform, which is the color map for the associated value. By passing this special dictionary, the color mapping now happens in the browser automatically. Looking at the plot here, we can see that the points are shaded according to their species value and the color map we provided.