Xarray datetime hover tooltip

Hi,

trying to plot an xarray data source which has a datetime64 coordinates dimension:

Coordinates:
  * time     (time) datetime64[ns] 1979-01-01 ... 2021-03-25T08:00:00

but I am not able to find the right way to format the hover tooltip for the time dimension.

What I got so far is:

import holoviews as hv
from bokeh.models import HoverTool
from holoviews import opts
import xarray as xr

hv.extension("bokeh")

url = "https://thredds.met.no/thredds/dodsC/met.no/observations/stations/SN99710.nc"

rawdata = xr.load_dataset(url)

tmp = rawdata["air_temperature_2m"].where(rawdata["time.year"] >= 1979, drop=True)
data = tmp.where(tmp < 300)

grid_style = {
    "grid_line_color": "black",
    "grid_line_width": 1.1,
    "minor_ygrid_line_color": "lightgray",
    "minor_xgrid_line_color": "lightgray",
    "xgrid_line_dash": [4, 4],
}

hv.Curve((data.time, data.variable), label='SN99710').opts(
    tools=[
        HoverTool(
            tooltips=[
                ("Station", "SN99710"),
                ("Date", "$index{%F}"),
                ("Temp", "$y"),
            ],
            toggleable=False,
            formatters={"$index": "datetime"},
        )
    ],
    xrotation=45,
    width=900,
    height=400,
    gridstyle=grid_style,
    show_grid=True,
)

which gives me a tooltip with a fixed datetime at 1970-01-01

Any clue on what I am doing wrong?

I am using the following version for bokeh and holoviews:

bokeh.__version__
'2.2.3'
hv.__version__
'1.14.0'

A notebook to reproduce the example is available at:

Try changing $index{%F} to @index{%F} in tooltips and $index to @index in formatters.

Thanks, I tried it earlier (using @ instead of $ but then the hover tool returns: β€˜???’ in the tooltip.

Edit:
I don’t know if can be of any help to undesrand the issue, but if I remove the formatting by using just:

            tooltips=[
                ("Station", "SN99710"),
                ("Date", "$index"),
                ("Temp", "$y"),
            ],

I see the tooltip returns an integer like: 129941 for a datetime index that points around the date: 3/Jan/2011 - which is too little, and I guess the datetime formatter will defaults the rendered tooltip to the lowest value possible.

Try this

hv.Curve(data, label='SN99710').opts(
    tools=[
        HoverTool(
            tooltips=[
                ("Station", "SN99710"),
                ("time", "$x{%F}"),
                ("Temp", "$y"),
            ],
            toggleable=False,
            formatters={"$x": "datetime"},
        )
    ],
    xrotation=45,
    width=900,
    height=400,
    gridstyle=grid_style,
    show_grid=True,
)
1 Like

Yes! that worked :slight_smile: Thank you!!!