Plotting multiple states bokeh - bokeh

Question

I'm trying to plot two things:
Counties for MD, VA, and DC
Lats/Longs for housing listings in that area (most expensive in a certain color
and least expensive in another color)
However, I'm having trouble with part 1, and cannot seem to plot the counties without getting the error message:
"Javascript error adding output!
Error: Error rendering Bokeh model: could not find tag with id: xxxxxxxxxxx
See your browser Javascript console for more details."
where xxxxx are numbers
from bokeh.io import show
from bokeh.models import (
ColumnDataSource,
HoverTool,
LogColorMapper)
from bokeh.palettes import Viridis6 as palette
from bokeh.plotting import figure
from bokeh.sampledata.us_counties import data as counties
from bokeh.sampledata.unemployment import data as unemployment
palette.reverse()
va_counties = {
code: county for code, county in counties.items() if county["state"] == "va"
}
md_counties = {
code: county for code, county in counties.items() if county["state"] == "md"
}
dc_counties = {
code: county for code, county in counties.items() if county["state"] == "dc"
}
va_county_xs = [county["lons"] for county in va_counties.values()]
va_county_ys = [county["lats"] for county in va_counties.values()]
md_county_xs = [county["lons"] for county in md_counties.values()]
md_county_ys = [county["lats"] for county in md_counties.values()]
dc_county_xs = [county["lons"] for county in dc_counties.values()]
dc_county_ys = [county["lats"] for county in dc_counties.values()]
va_county_names = [county['name'] for county in va_counties.values()]
md_county_names = [county['name'] for county in md_counties.values()]
dc_county_names = [county['name'] for county in dc_counties.values()]
#county_rates = [unemployment[county_id] for county_id in counties]
color_mapper = LogColorMapper(palette=palette)
va_source = ColumnDataSource(data=dict(
x=va_county_xs,
y=va_county_ys,
name=va_county_names,
))
md_source = ColumnDataSource(data=dict(
x=md_county_xs,
y=md_county_ys,
name=md_county_names,
))
dc_source = ColumnDataSource(data=dict(
x=dc_county_xs,
y=dc_county_ys,
name=dc_county_names,
))
TOOLS = "pan,wheel_zoom,reset,hover,save"
va = figure(
title="Texas Unemployment, 2009", tools=TOOLS,
x_axis_location=None, y_axis_location=None
)
va.grid.grid_line_color = None
md = figure(
title="Texas Unemployment, 2009", tools=TOOLS,
x_axis_location=None, y_axis_location=None
)
md.grid.grid_line_color = None
dc = figure(
title="Texas Unemployment, 2009", tools=TOOLS,
x_axis_location=None, y_axis_location=None
)
dc.grid.grid_line_color = None
va.patches('x', 'y', source=va_source,
fill_color={'field': 'rate', 'transform': color_mapper},
fill_alpha=0.7, line_color="white", line_width=0.5)
md.patches('x', 'y', source=md_source,
fill_color={'field': 'rate', 'transform': color_mapper},
fill_alpha=0.7, line_color="white", line_width=0.5)
dc.patches('x', 'y', source=dc_source,
fill_color={'field': 'rate', 'transform': color_mapper},
fill_alpha=0.7, line_color="white", line_width=0.5)
hover = p.select_one(HoverTool)
hover.point_policy = "follow_mouse"
hover.tooltips = [
("Name", "#name"),
("(Long, Lat)", "($x, $y)"),
]
show(va)
show(md)
show(dc)

Answer 1

Bokeh maintains an implicit "current document" and by default everything you make gets added to that. This makes it very simple to have a script that generates one HTML file, and especially makes usage in the Jupyter notebook much more simple and transparent. In general this is a net positive, but it does make certain other usage patterns need to be slightly more verbose. In particular in your case with multiple show calls, each call to show gets the same document which is probably not what you intend. The solution is to create and show each plot in order, and call reset_output in between. Additionally, you would really need to specify unique filenames for each separate output, by using output_file. Here is a small complete example:
from bokeh.io import output_file, reset_output, show
from bokeh.plotting import figure
# create and show one figure
p1 = figure(title="plot 1")
p1.circle([1,2,3], [4,6,5])
output_file("p1.html")
show(p1)
# clear out the "current document"
reset_output()
# create and show another figure
p2 = figure(title="plot 2")
p2.circle([1,2,3], [8,6,7])
output_file("p2.html")
show(p2)
There are other ways to do this by managing Bokeh Document objects explicitly yourself, but I would probably say this is the simplest to get started.