自定义散景德州失业的例子

时间:2017-01-21 12:46:01

标签: javascript python data-visualization bokeh

我在散景教程页面上浏览了this 示例。我想知道是否可以稍微定制悬停动作。我想要实现的是在悬停的多边形上生成一个暗加权边框,以便将其与其他多边形分开。像this leafletjs一样。此外,我希望色彩图显示每种颜色代表的含义。我真的很感激一些帮助。

1 个答案:

答案 0 :(得分:3)

此答案的行为与您引用的leafletJS示例完全相同,但它几乎就在那里。用户现在可以在悬停时隔离该县。

# # Uncomment the following 3 lines for display in Jupyter notebook.
# from bokeh.io import push_notebook, show, output_notebook
# from bokeh.resources import INLINE
# output_notebook(resources=INLINE)

from bokeh.io import show
from bokeh.models import (
    ColumnDataSource,
    HoverTool,
    LogColorMapper,
    CustomJS
)
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()

counties = {
    code: county for code, county in counties.items() if county["state"] == "tx"
}

county_xs = [county["lons"] for county in counties.values()]
county_ys = [county["lats"] for county in counties.values()]

county_names = [county['name'] for county in counties.values()]
county_rates = [unemployment[county_id] for county_id in counties]
color_mapper = LogColorMapper(palette=palette)

source = ColumnDataSource(data=dict(
    x=county_xs,
    y=county_ys,
    name=county_names,
    rate=county_rates,
))

TOOLS = "pan,wheel_zoom,box_zoom,reset,hover,save"

p = figure(
    title="Texas Unemployment, 2009", tools=TOOLS,
    x_axis_location=None, y_axis_location=None
)
p.grid.grid_line_color = None

p.patches('x', 'y', source=source,
          fill_color={'field': 'rate', 'transform': color_mapper},
          fill_alpha=0.7, line_color="black", line_width=0.5)


hover = p.select_one(HoverTool)
hover.point_policy = "follow_mouse"
hover.tooltips = [
    ("Name", "@name"),
    ("Unemployment rate)", "@rate%"),
    ("(Long, Lat)", "($x, $y)"),
]

code = "source.set('selected', cb_data['index']);"
callback = CustomJS(args={'source': source}, code=code)

hover.callback = callback

show(p)