Altair Tooltip Offset

[timbmg]

Bug description

Similar to #2430, the tooltip has an offset / the "border" of the tooltip does not correspond to the border of the grid in the example below. I have also experinece this in a circle/line plot.

Steps to reproduce

---
title: "Test"
format:
  revealjs:
    code-fold: true
    theme: white
jupyter: python3
---

## Line Chart

```{python}
import altair as alt
import numpy as np
import pandas as pd
x = np.arange(100)
source = pd.DataFrame({
  'x': x,
  'f(x)': np.sin(x / 5)
})

alt.Chart(source).mark_line().encode(
    x='x',
    y='f(x)',
    tooltip=[
        alt.Tooltip("x"),
        alt.Tooltip("f(x)"),
    ]
)
```

## Heatmap

```{python}

# Compute x^2 + y^2 across a 2D grid
x, y = np.meshgrid(range(-5, 5), range(-5, 5))
z = x ** 2 + y ** 2

# Convert this grid to columnar data expected by Altair
source = pd.DataFrame({'x': x.ravel(),
                     'y': y.ravel(),
                     'z': z.ravel()})

alt.Chart(source).mark_rect().encode(
    x='x:O',
    y='y:O',
    color='z:Q',
    tooltip=[
        alt.Tooltip("x"),
        alt.Tooltip("y"),
        alt.Tooltip("z"),
    ]
)
```

Expected behavior

No response

Actual behavior

No response

Your environment

• Mac Ventuar 13.4.1
• Python 3.11.5
• quarto 1.3.450
• altair 5.2.0

Quarto check output

[✓] Checking versions of quarto binary dependencies...
Pandoc version 3.1.1: OK
Dart Sass version 1.55.0: OK
[✓] Checking versions of quarto dependencies......OK
[✓] Checking Quarto installation......OK
Version: 1.3.450
Path: /Applications/quarto/bin

[✓] Checking basic markdown render....OK

[✓] Checking Python 3 installation....OK
Version: 3.11.5 (Conda)
Path: /opt/homebrew/Caskroom/miniconda/base/envs/my-proj/bin/python
Jupyter: 5.5.0
Kernels: python3

(-) Checking Jupyter engine render....0.00s - Debugger warning: It seems that frozen modules are being used, which may
0.00s - make the debugger miss breakpoints. Please pass -Xfrozen_modules=off
0.00s - to python to disable frozen modules.
0.00s - Note: Debugging will proceed. Set PYDEVD_DISABLE_FILE_VALIDATION=1 to disable this validation.
[✓] Checking Jupyter engine render....OK

[✓] Checking R installation...........(None)

  Unable to locate an installed version of R.
  Install R from https://cloud.r-project.org/

[mcanouil]

Could you properly close your code blocks and use extra backticks when include code blocks? (usually four ````).

````qmd
---
title: "Reproducible Quarto Document"
format: html
engine: knitr
---

This is a reproducible Quarto document using `format: html`.
It is written in Markdown and contains embedded R code.
When you run the code, it will produce a plot.

```{r}
plot(cars)
```

![A placeholder image](https://placehold.co/600x400.png)

The end.
````

[timbmg]

@mcanouil, done! Thanks for the tip with the 4 backticks!

[mcanouil]

Another side note, it is good practice and often a requirement in markdown to have empty lines around headings and code blocks.
This reduces a lot the number of parsing errors.

[cscheid]

Unfortunately, this isn't a Quarto bug, and there's nothing we can do here. You can reproduce this issue outside of quarto by creating a standalone vega + revealjs presentation. (It's not a trivial issue to fix either; Vega assumes a 100% zoom in its point location code. I tried fixing it in the past and failed.)

[timbmg]

Thank you @cscheid! Is there already an issue in vega? Sorry I am new to this, don't even really know what to search for.

[cscheid]

There might not be, because I happen to know the Vega devs personally (from past academic life) and I reached out to them out-of-band.

But I would start by creating a simple example using a plain revealjs presentation (no quarto, using the latest revealjs) that embeds a plain vega-lite-using-JS plot still experiences the issue, and then filing a bug with https://github.com/vega/vega.

In other words, I don't think this is an Altair bug, or a Quarto bug. I believe this is a Vega bug that arises out of the way they compute screen offsets.