# First steps 5: Vectorizing glyph properties¶

In the previous first steps guide, you customized various aspects of your plot by adding and changing attributes.

In this section, you will use vectors of data to influence aspects of your plot and its elements.

## Vectorizing colors¶

So far, you have assigned specific colors to a glyph by using properties such as `fill_color`.

To change colors depending on values in a variable, pass a variable containing color information to the `fill_color` attribute:

```import random

from bokeh.plotting import figure, show

# generate some data (1-10 for x, random values for y)
x = list(range(0, 26))
y = random.sample(range(0, 100), 26)

# generate list of rgb hex colors in relation to y
colors = ["#%02x%02x%02x" % (255, int(round(value * 255 / 100)), 255) for value in y]

# create new plot
p = figure(
title="Vectorized colors example",
sizing_mode="stretch_width",
max_width=500,
plot_height=250,
)

# add circle and line renderers
line = p.line(x, y, line_color="blue", line_width=1)
circle = p.circle(x, y, fill_color=colors, line_color="blue", size=15)

# show the results
show(p)
```

In this example, the color of every circle corresponds to the y value of that circle.

See also

For more information on how to map data points to colors and color palettes, see Using mappers in the user guide.

## Vectorizing colors and sizes¶

To create a plot with colors and sizes in relation to your data, apply the same principle to the `radius` argument of your renderer:

```import numpy as np

from bokeh.plotting import figure, show

# generate some data
N = 1000
x = np.random.random(size=N) * 100
y = np.random.random(size=N) * 100

# generate radii and colors based on data
radii = y / 100 * 2
colors = ["#%02x%02x%02x" % (255, int(round(value * 255 / 100)), 255) for value in y]

# create a new plot with a specific size
p = figure(
title="Vectorized colors and radii example",
sizing_mode="stretch_width",
max_width=500,
plot_height=250,
)

# add circle renderer
p.circle(
x,
y,
radius=radii,
fill_color=colors,
fill_alpha=0.6,
line_color="lightgrey",
)

# show the results
show(p)
```

In this example, the color and diameter of every circle correspond to the y value of that circle.

## Color mapping with palettes¶

Bokeh comes with dozens of pre-defined color palettes that you can use to map colors to your data. This includes palettes from Brewer, D3, or Matplotlib. See `palettes` for a list of all available palettes.

First, use the `linear_cmap()` function to create a color map for your data. The required attributes for this function are:

• `field_name`: the data sequence to map colors to

• `palette`: the palette to use

• `low`: the lowest value to map a color to

• `high`: the highest value to map a color to

Then assign your color mapper to the `color` parameter of your renderer:

```from bokeh.io import show
from bokeh.palettes import Turbo256
from bokeh.plotting import figure
from bokeh.transform import linear_cmap

# generate data
x = list(range(-32, 33))
y = [i**2 for i in x]

# create linear color mapper
mapper = linear_cmap(field_name="y", palette=Turbo256, low=min(y), high=max(y))

# create plot
p = figure(plot_width=500, plot_height=250)

# create circle renderer with color mapper
p.circle(x, y, color=mapper, size=10)

show(p)
```

See also

For more information about color mapping and other similar operations, see Using mappers and Transforming data in the user guide. In addition to `linear_cmap`, this includes `log_cmap` and `factor_cmap`, for example.

To learn more about Bokeh’s color palettes, see `palettes` in the reference guide. This document contains an overview of all available palettes and the various ways you can make those palettes available to your plots.