Plotly pane ignored timezone information when adding shapes to a plot with a time axes and used local timezone instead

[owenlamont]

ALL software version info

OS: Windows 11 Pro 10.0.22621 Browser: Vivaldi 6.1.3035.111 (Stable channel) (64-bit) Panel 1.2.0 Plotly 5.15.0 Bokeh 3.1.1 Jupyterlab 4.0.2

Description of expected behavior and the observed behavior

When adding a Plotly shape (in this case a vline) to a time axes plot - I noticed the timezone of the shape position is ignored and my local timezone (in this case +9:30 UTC) was used instead. Plotting with Plotly directly works fine, this only happens when passing a plot to a Plotly pane.

Complete, minimal, self-contained example code that reproduces the issue

Here's a code example from Jupyter running in a conda environment (I have reproduced the same issue in PyScript too).

from datetime import datetime, UTC
import panel as pn
import plotly.express as px
import pandas as pd

pn.extension("plotly")

start = pd.Timestamp('2022-05-11 0:00:00', tz=UTC)
date_range = pd.date_range(start=start, periods=20, freq='h')

df = pd.DataFrame({
    "x": date_range,
    "y": list(range(len(date_range))),
})

plotly_figure = px.scatter(df,
                           x="x",
                           y="y",
                           width=640,
                           height=480,
                          )
plotly_figure.add_vline(
    x=pd.Timestamp('2022-05-11 9:00:00', tz=UTC),
    line_dash="dash",
    line_color="green",
)
plotly_figure

pn.pane.Plotly(plotly_figure)

Screenshots or screencasts of the bug in action

[owenlamont]

Any chance this can be triaged @MarcSkovMadsen / @philippjfr so I can have some idea of when it might get actioned? I know it's a pretty niche edge case but it is impacting my co-workers that use a dashboard I made with Panel and I thought distorting data on a plot was a relatively serious bug.

I've got a lot going on right now but I will see if I can dive into the weeds a bit deeper in a week or two to try and narrow down where this might be going wrong.

[owenlamont]

I recently discovered Plotly.py itself has a very similar issue https://github.com/plotly/plotly.py/issues/3065 although in that case the issue was only manifesting when adding a text label to the vertical line.

From reading the comments on that ticket Plotly.js does some weird hacky local timezone conversions - which probably relates to the problem we see here too. Some of the work-arounds people would do to avoid the bug by converting datetimes to Unix timestamps on vlines would produce identical issues to what I found here where the trends were shown in one timezone and the vlines in a different timezone (one was client local time and the other in its original datetime timezone).