I am trying to add a RangeSlider for dates to a graph in Bokeh 2.0.
Code looks like that (data comes from a dataframe in pandas):
p = figure(plot_width = 800, plot_height = 350, x_axis_type = "datetime")
p.line(df['date'], df['cases'], color='navy', alpha=0.5, legend_label = "cases", line_width = 2)
How do I add a slider to set and narrow the focus?
Thanks and cheers,
Ulrich
A couple of things to note:
It will produce the CDSView filters are not compatible with glyphs with connected topology suchs as Line and Patch warning. I leave it to you to decide whether it's something you care about
Changing the slider value will not alter the data range - I think, for the exact same reason, simply because using circle instead of line works just fine
import pandas as pd
from bokeh.io import show
from bokeh.layouts import column
from bokeh.models import ColumnDataSource, BooleanFilter, CDSView, DateRangeSlider, CustomJS
from bokeh.plotting import figure
df = pd.DataFrame(dict(date=['2020-01-01', '2020-01-02', '2020-01-03'], cases=[1, 2, 3]))
df['date'] = pd.to_datetime(df['date'])
p = figure(plot_width=800, plot_height=350, x_axis_type="datetime")
init_value = (df['date'].min(), df['date'].max())
slider = DateRangeSlider(start=init_value[0], end=init_value[1], value=init_value)
ds = ColumnDataSource(df)
date_filter = BooleanFilter(booleans=[True] * df.shape[0])
slider.js_on_change('value', CustomJS(args=dict(f=date_filter, ds=ds),
code="""\
const [start, end] = cb_obj.value;
f.booleans = Array.from(ds.data['date']).map(d => (d >= start && d <= end));
// Needed because of https://github.com/bokeh/bokeh/issues/7273
ds.change.emit();
"""))
p.circle('date', 'cases', source=ds, view=CDSView(source=ds, filters=[date_filter]),
color='navy', alpha=0.5, legend_label="cases", line_width=2)
show(column(p, slider))
Related
I tried to write these codes to display the dataseries plot, but no data was not displayed.
I dont know where is the problem exactly.
data=pd.read_csv('weather.csv')[['STA','Date','Precip','MaxTemp','MinTemp','MeanTemp','Snowfall']].dropna()
data = data[data['Precip'] != 'T']
data['Precip'].astype(float)
data['STA']=data['STA'].astype("string")
data['Date']=pd.to_datetime(data['Date'])
stations=list(set(data['STA']))
stations.sort()
select_inital=select.value
colors = list(Category20_16)
colors.sort()
subset=data[data['STA']==select_inital]
initial_values= list(set(subset['STA']))
for i, j in enumerate(initial_values):
subset=data[data['STA']==j]
d=subset[['Date','Precip']]
d.sort_values('Date')
x=d['Date']
y=d['Precip']
d = ColumnDataSource(d)
p = figure(plot_width=700, plot_height=700, x_range=(0,200), title='Weather Evolution',x_axis_label='Date', y_axis_label='Precip',x_axis_type='datetime')
p.line(x,y, legend_label="Evolution", line_width=2)
show(p)
This is just guessing but I believe the problem is, that you are trying to set limits to the x_range. Bokeh is evaluating dates as milliseconds from 1970-01-01 00:00 and your x_range=(0,200) is also interpreted as millisecond. This means the visible area is very small and starts at January 1st 1970. You could use the defaults by bokeh instead.
Minimal example
This is your code for the figure except I removed the x_range.
import pandas as pd
from bokeh.plotting import figure, show, output_notebook
output_notebook()
x = pd.date_range('2022-12-01', '2022-12-24', freq='D')
y = list(range(1,25))
p = figure(
plot_width=700,
plot_height=700,
# x_range=(0,200),
title='Weather Evolution',
x_axis_label='Date',
y_axis_label='Precip',
x_axis_type='datetime'
)
p.line(x,y, legend_label="Evolution", line_width=2)
show(p)
Bokeh default x_range
x_range by user
Comment
If you want to set the x_range for a axis with type "datetime" you can pass timestamp objects to it.
Valid are among other things (e.g. float)
# datetime
from datetime import datetime
x_range=(datetime(2022,12, 7),datetime(2022,12, 10))
# pandas
import pandas as pd
x_range=(pd.Timestamp('2022-12-07'),pd.Timestamp('2022-12-10'))
My goal is to add an HoverTool to my figure which displays the weekday by name. The date is defined by the x-axis values. I want to display this information at a fixed position even if the visible section is changed by a tool like BoxZoom.
Since the HoverTool needs at least one renderer I first tried to define a line but I did not find a way to define the position relative to the figure. In fact if I zoom it can happen, that this line is not in the visible part and the HoverTool isn't working anymore (or in an area which is not visible).
My second attempt was to define an extra_y_range to draw the line relative. But I did not find a way to unselect the BoxZoom for this axis.
import pandas as pd
from bokeh.plotting import figure, output_notebook, show
from bokeh.models import (
HoverTool,
LinearAxis,
Range1d,
)
output_notebook()
dr = pd.date_range('2020-01-01', '2020-01-05', freq='D')
p = figure(title="line", plot_width=300, plot_height=300, x_axis_type='datetime')
p.line(x=dr, y=[6, 7, 2, 4, 5])
p.extra_y_ranges.update({"extra": Range1d(0, 1)})
p.add_layout(LinearAxis(y_range_name="extra", axis_label=''), "right")
l = p.line(x=dr, y=0.8, color='gray', **{"y_range_name":"extra"})
p.add_tools(
HoverTool(
tooltips=[("", "#x{%A}")],
renderers=[l],
mode="vline",
formatters={"#x": "datetime"},
))
show(p)
Is there a way to add an HoverTool which stays at the same position in the visible area even if this area is effected by tools?
You can try this solution which works for Bokeh v2.1.1. In the code below the tooltip is fixed at absolute position on the screen. You can add yourself more generic solution independent of the plot position on the screen.
from bokeh.models import CustomJS
from bokeh.models import HoverTool
from bokeh.plotting import show, figure
import numpy as np
p = figure(plot_width = 300, plot_height = 300, tooltips = [('value X', '#x'), ('value Y', '#y')])
circles = p.circle(x=np.random.rand(10)*10, y=np.random.rand(10)*10, size=10)
callback = CustomJS(args={'p': p}, code="""
var tooltips = document.getElementsByClassName("bk-tooltip");
const tw = 100;
for (var i = 0; i < tooltips.length; i++) {
tooltips[i].style.top = '5px';
tooltips[i].style.left = p.width/2 - tw/2 + 'px';
tooltips[i].style.width = tw + 'px';
} """)
hover = p.select_one(HoverTool)
hover.renderers = [circles]
hover.callback = callback
hover.show_arrow = False
show(p)
Result:
I'm getting this error:
TypeError: Object of type Interval is not JSON serializable
Here is my code.
import pandas as pd
import numpy as np
import matplotlib.pyplot as plt
import math
from bokeh.io import output_file, show
from bokeh.plotting import figure
from bokeh.models import ColumnDataSource
from bokeh.models import NumeralTickFormatter
def construct_labels(start, end):
labels = []
for index, x in enumerate(start):
y = end[index]
labels.append('({}, {}]'.format(x, y))
return labels
values = {'Length': np.random.uniform(0, 4, 10)}
df = pd.DataFrame(values, columns=['Length'])
bin_step_size = 0.5
# List of bin points.
p_bins = np.arange(0, (df['Length'].max() + bin_step_size), bin_step_size)
# Reduce the tail to create the left side bounds.
p_left_limits = p_bins[:-1].copy()
# Cut the head to create the right side bounds.
p_right_limits = np.delete(p_bins, 0)
# Create the bins.
p_range_bins = pd.IntervalIndex.from_arrays(p_left_limits, p_right_limits)
# Create labels.
p_range_labels = construct_labels(p_left_limits, p_right_limits)
p_ranges_binned = pd.cut(
df['Length'],
p_range_bins,
labels=p_range_labels,
precision=0,
include_lowest=True)
out = p_ranges_binned
counts = out.value_counts(sort=False)
total_element_count = len(df.index)
foo = pd.DataFrame({'bins': counts.index, 'counts': counts})
foo.reset_index(drop=True, inplace=True)
foo['percent'] = foo['counts'].apply(lambda x: x / total_element_count)
foo['percent_full'] = foo['counts'].apply(lambda x: x / total_element_count * 100)
bin_labels = p_range_labels
# Data Container
source = ColumnDataSource(dict(
bins=foo['bins'],
percent=foo['percent'],
count=foo['counts'],
labels=pd.DataFrame({'labels': bin_labels})
))
p = figure(x_range=bin_labels, plot_height=600, plot_width=1200, title="Range Counts",
toolbar_location=None, tools="")
p.vbar(x='labels', top='percent', width=0.9, source=source)
p.yaxis[0].formatter = NumeralTickFormatter(format="0.0%")
p.xaxis.major_label_orientation = math.pi / 2
p.xgrid.grid_line_color = None
p.y_range.start = 0
output_file("bars.html")
show(p)
The error comes from here:
source = ColumnDataSource(dict(
bins=foo['bins'],
percent=foo['percent'],
count=foo['counts'],
labels=pd.DataFrame({'labels': bin_labels})
))
The bins you passed in is a interval type that cannot be JSON serialized.
After review your code, this bins variable is not used in your plotting, so you can change it to:
source = ColumnDataSource(dict(
percent=foo['percent'],
count=foo['counts'],
labels=bin_labels
))
Notice that I also changed your labels to bin_labels, which is a list and ColumnDataSource can use list as input. But you may want to further format these labels, as right now they are just like
['(0.0, 0.5]',
'(0.5, 1.0]',
'(1.0, 1.5]',
'(1.5, 2.0]',
'(2.0, 2.5]',
'(2.5, 3.0]',
'(3.0, 3.5]',
'(3.5, 4.0]']
You might want to format them to something prettier.
After this small change you should be able to see your bar graph:
I am trying to plot a few points on a graph, similarly to a heat map.
Sample code (adapted from the heat map section here):
import pandas as pd
from bokeh.io import output_notebook, show
from bokeh.models import BasicTicker, ColorBar, ColumnDataSource, LinearColorMapper, PrintfTickFormatter
from bokeh.plotting import figure
from bokeh.transform import transform
import numpy as np
# change this if you don't run it on a Jupyter Notebook
output_notebook()
testx = np.random.randint(0,10,10)
testy = np.random.randint(0,10,10)
npdata = np.stack((testx,testy), axis = 1)
hist, bins = np.histogramdd(npdata, normed = False, bins = (10,10), range=((0,10),(0,10)))
data = pd.DataFrame(hist, columns = [str(x) for x in range(10)])
data.columns.name = 'y'
data['x'] = [str(x) for x in range(10)]
data = data.set_index('x')
df = pd.DataFrame(data.stack(), columns=['present']).reset_index()
source = ColumnDataSource(df)
colors = ['lightblue', "yellow"]
mapper = LinearColorMapper(palette=colors, low=df.present.min(), high=df.present.max())
p = figure(plot_width=400, plot_height=400, title="test circle map",
x_range=list(data.index), y_range=list((data.columns)),
toolbar_location=None, tools="", x_axis_location="below")
p.circle(x="x", y="y", size=20, source=source,
line_color=None, fill_color=transform('present', mapper))
p.axis.axis_line_color = None
p.axis.major_tick_line_color = None
p.axis.major_label_text_font_size = "10pt"
p.axis.major_label_standoff = 10
p.xaxis.major_label_orientation = 0
show(p)
That returns:
Now, as you can see, the grid lines are centered on the points(circles), and I would like, instead to have the circles enclosed in a square created by the lines.
I went through this to see if I could find information on how to offset the grid lines by 0.5 (that would have worked), but I was not able to.
There's nothing built into Bokeh to accomplish this kind of offsetting of categorical ticks, but you can write a custom extension to do it:
CS_CODE = """
import {CategoricalTicker} from "models/tickers/categorical_ticker"
export class MyTicker extends CategoricalTicker
type: "MyTicker"
get_ticks: (start, end, range, cross_loc) ->
ticks = super(start, end, range, cross_loc)
# shift the default tick locations by half a categorical bin width
ticks.major = ([x, 0.5] for x in ticks.major)
return ticks
"""
class MyTicker(CategoricalTicker):
__implementation__ = CS_CODE
p.xgrid.ticker = MyTicker()
p.ygrid.ticker = MyTicker()
Note that Bokeh assumes CoffeeScript by default when the code is just a string, but it's possible to use pure JS or TypeScript as well. Adding this to your code yields:
Please note the comment about output_notebook you must call it (possibly again, if you have called it previously) after the custom model is defined, due to #6107
I am unable to plot the area chart in bokeh for some reason..
Below is the code used for the same..
from bokeh.charts import Area, show, output_file
Areadict = dict(
I = df['IEXT'],
Date=df['Month'],
O = df['OT']
)
area = Area(Areadict, x='Date', y=['I','O'], title="Area Chart",
legend="top_left",
xlabel='time', ylabel='memory')
output_file('area.html')
show(area)
All i see if the date axis getting plotted, but no signs of the two areacharts that I am interested in.
Please advise
I would recommend looking at Holoviews which is a very high level API built on top of Bokeh, and is endorsed by the Bokeh team. You can see an Area chart example in their documentation. Basically it looks like:
# create holoviews objects
dims = dict(kdims='time', vdims='memory')
python = hv.Area(python_array, label='python', **dims)
pypy = hv.Area(pypy_array, label='pypy', **dims)
jython = hv.Area(jython_array, label='jython', **dims)
# plot
overlay.relabel("Area Chart") + hv.Area.stack(overlay).relabel("Stacked Area Chart")
Which results in
Otherwise, as of Bokeh 0.13 to create a stacked area chart with the stable bokeh.plotting API, you will need to stack the data yourself, as shown in this example:
import numpy as np
import pandas as pd
from bokeh.plotting import figure, show, output_file
from bokeh.palettes import brewer
N = 20
cats = 10
df = pd.DataFrame(np.random.randint(10, 100, size=(N, cats))).add_prefix('y')
def stacked(df):
df_top = df.cumsum(axis=1)
df_bottom = df_top.shift(axis=1).fillna({'y0': 0})[::-1]
df_stack = pd.concat([df_bottom, df_top], ignore_index=True)
return df_stack
areas = stacked(df)
colors = brewer['Spectral'][areas.shape[1]]
x2 = np.hstack((df.index[::-1], df.index))
p = figure(x_range=(0, N-1), y_range=(0, 800))
p.grid.minor_grid_line_color = '#eeeeee'
p.patches([x2] * areas.shape[1], [areas[c].values for c in areas],
color=colors, alpha=0.8, line_color=None)
show(p)
which results in