Add a new variable to the hover tool

HoloViews
1

Hi, I want to add a new variable to the hover tool in an interactive bar chart, however, the value of the variable would be shown as " ???" as can be seen in the attached screenshot.

Untitled
Untitled839×531 15.5 KB

I provided the code and an example of data used in the code.
products:
products_test.csv (5.2 KB)
patents:
patents_test.csv (3.6 KB)
companies:
companies_test.csv (14.9 KB)
title_list:
Nace code titles list.csv (13.0 KB)

import panel as pn
import panel.widgets as pnw
import holoviews as hv
from bokeh.plotting import figure
from bokeh.models import Div, CustomJS, RadioButtonGroup

from bokeh.models.widgets import Panel, Tabs
hv.extension('bokeh')

from bokeh.models import HoverTool, BoxZoomTool, ResetTool, PanTool, WheelZoomTool, SaveTool, LassoSelectTool
LABELS = ["Companies", "Products", "Patents"]

nacettl = pd.read_csv('title_list.csv', dtype={'Nace code':str}).rename(columns = {'Nace code':'Nace Code'})

opt = pnw.RadioButtonGroup(options = LABELS)
@pn.depends(opt = opt.param.value)
def country_list(opt):
        
    if opt == 'Patents':
        l = ["All"] + list(patents['Country Code'].unique())      
    
    elif opt == 'Products':
        l = ["All"] + list(products['Country Code'].unique())
    
    else:
        l = ["All"] + list(companies['Country Code'].unique())

           
    return l

select_country = pnw.Select(name = 'Country Code', options = country_list(opt) , value = "All", width = 200)

@pn.depends(select_country = select_country.param.value, opt = opt.param.value )


def fig(select_country,opt):
    
    if opt == 'Companies':
        df = companies
        string = '(Companies)'
        
    elif opt == 'Products':
        df = products
        string = '(Products)'
    else:
        opt = patents
        string = '(Patents)'
    
    
    df = pd.merge(df,nacettl, how = 'inner', on = ['Nace Code'])
    
    hover = HoverTool(description='Custom Tooltip', tooltips = [('Nace Title', '@Nace Title'),('Count', '@Count')])              
    opts = dict(width = 1500, height = 300, line_color = 'black' ,
                 tools = [hover], apply_ranges = True)

    if select_country == "All":
        selected = df.groupby(['Nace Code']).sum().reset_index().rename(columns = {0:'Count'}).sort_values(by ='Count', ascending = False )[:30]
        selected
    else:
        selected = df[df['Country Code'] == select_country].sort_values(by ='Count', ascending = False )[:30]
    
    return hv.Bars(selected, 'Nace Code', 'Count').opts(**opts)

pn.Column(opt, select_country, pn.Column(fig, scroll=True, width=500))
1 Like
2

I think

hv.Bars(selected, [‘Nace Code’, “Nace Title”], ‘Count’).opts(**opts)

3

tooltips = [(‘Nace Code’, ‘@{Nace Code}’),(‘Nace Title’, ‘@{Nace Title}’),(‘Count’, ‘@Count’)])

1 Like
4

My hypothesis is that this is caused by the space in the tooltips definition. Try to take a look at bokeh documentation or discourse to find out how you should handle spaces. Or try surrounding the Nace Title with () like @(Nace Title). Or try other symbols like { and }.

image

5

i regenerated the following code with some minor changes . But the Nace Title it’s the same ?? thing

chrome_jGf7JSTKEl
chrome_jGf7JSTKEl957×638 43.2 KB 

LABELS = ["Companies", "Products", "Patents"]

nacettl =  pd.read_csv('titles_list.csv', dtype={'Nace code':str},encoding='latin').rename(columns = {'Nace code':'Nace Code'})
patents =pd.read_csv('patents.csv', dtype={'Nace code':str},encoding='latin').rename(columns = {'Nace code':'Nace Code'})
products=pd.read_csv('products.csv', dtype={'Nace code':str},encoding='latin').rename(columns = {'Nace code':'Nace Code'})
companies=pd.read_csv('companies.csv', dtype={'Nace code':str},encoding='latin').rename(columns = {'Nace code':'Nace Code'})

patents['Nace Code']=patents['Nace Code'].astype(str)
products['Nace Code']=products['Nace Code'].astype(str)
companies['Nace Code']=companies['Nace Code'].astype(str)
nacettl['Nace Code']=nacettl['Nace Code'].astype(str)

opt = pnw.RadioButtonGroup(options = LABELS)
@pn.depends(opt = opt.param.value)
def country_list(opt):
        
    if opt == 'Patents':
        l = ["All"] + list(patents['Country Code'].unique())      
    
    elif opt == 'Products':
        l = ["All"] + list(products['Country Code'].unique())
    
    else:
        l = ["All"] + list(companies['Country Code'].unique())

           
    return l

select_country = pnw.Select(name = 'Country Code', options = country_list(opt) , value = "All", width = 200)

@pn.depends(select_country = select_country.param.value, opt = opt.param.value )


def fig(select_country,opt):
    df=''
    if opt == 'Companies':
        df = companies
        string = '(Companies)'
        
    elif opt == 'Products':
        df = products
        string = '(Products)'
    else:
        opt = patents
        string = '(Patents)'
    
    
    df = pd.merge(df,nacettl, how = 'left', on = ['Nace Code'])
    
    hover = HoverTool(description='Custom Tooltip', tooltips = [('Nace Code', '@{Nace_Code}'),('Titles', '@{Nace_Title}'),('Count', '@Count')])              
    opts = dict(width = 1500, height = 300, line_color = 'black' ,
                 tools = [hover], apply_ranges = True)

    if select_country == "All" :
        selected = df.groupby(['Nace Code']).sum().reset_index().rename(columns = {0:'Count'}).sort_values(by ='Count', ascending = False )[:30]
        selected.rename(columns={"Nace Code": 'Nace_Code'},inplace=True)
        selected.rename(columns={"Nace Title": 'Nace_Title'},inplace=True)
        selected.fillna('Not_avialable',inplace=True)
       
        
    else:
        selected = df[df['Country Code'] == select_country].sort_values(by ='Count', ascending = False )[:30]
        selected.rename(columns={"Nace Code": 'Nace_Code'},inplace=True)
        selected.rename(columns={"Nace Title": 'Nace_Title'},inplace=True)
        selected.fillna('Not_avialable',inplace=True)
        
    return  hv.Bars(selected).apply.opts(**opts)
6

i dig down and change the return hv.Table(selected)

now with country code=‘All’ . No Nace_Title column in datacolumn so it is understandable why ??? appear in tooltip

image

but it is confusing still ??? in tooltip when selected with other country and Nace_Title appear in the column. I hope i make myself clear

image
image888×562 24.1 KB

7

Yes, you are right, actually, I try to merge the title dataframe in the last step in the function, after aggregating the dataframe to “All” Nace code, so there would be title column in the dataframe as well. but I still get ??? in the hovertool.

8

Kindly check to include Nace_Title in group by
And then change hv.Bar accordingly