bqplot interactions broken

[swelborn]

Panzoom does not appear to work, maybe things aren't being passed down properly. #470 also indicates something is up..

@solara.component
def Page(x=x0, ymax=5):
    y = x**exponent.value
    color = "red"
    display_legend = True
    label = "bqplot graph"

    solara.SliderFloat(value=exponent, min=0.1, max=3, label="Exponent")
    solara.Checkbox(value=log_scale, label="Log scale")

    x_scale = bqplot.LinearScale()
    if log_scale.value:
        y_scale = bqplot.LogScale(min=0.1, max=ymax)
    else:
        y_scale = bqplot.LinearScale(min=0, max=ymax)

    panzoom = PanZoom(scales={"x": [x_scale], "y": [y_scale]})

    lines = bqplot.Lines(
        x=x,
        y=y,
        scales={"x": x_scale, "y": y_scale},
        stroke_width=3,
        colors=[color],
        display_legend=display_legend,
        labels=[label],
    )
    x_axis = bqplot.Axis(scale=x_scale)
    y_axis = bqplot.Axis(scale=y_scale, orientation="vertical")
    bqplot.Figure(
        axes=[x_axis, y_axis],
        marks=[lines],
        scale_x=x_scale,
        scale_y=y_scale,
        layout={"min_width": "800px"},
        interaction=panzoom,
    )

[maartenbreddels]

Hi,

the code that should work, is:

import solara
from reacton import bqplot
import numpy as np


x0 = np.linspace(0, 2, 100)

exponent = solara.reactive(1.0)
log_scale = solara.reactive(False)

@solara.component
def Page(x=x0, ymax=5):
    y = x**exponent.value
    color = "red"
    display_legend = True
    label = "bqplot graph"

    solara.SliderFloat(value=exponent, min=0.1, max=3, label="Exponent")
    solara.Checkbox(value=log_scale, label="Log scale")

    x_scale = bqplot.LinearScale().shared()
    if log_scale.value:
        y_scale = bqplot.LogScale(min=0.1, max=ymax).shared()
    else:
        y_scale = bqplot.LinearScale(min=0, max=ymax).shared()

    panzoom = bqplot.PanZoom(scales={"x": [x_scale], "y": [y_scale]})

    lines = bqplot.Lines(
        x=x,
        y=y,
        scales={"x": x_scale, "y": y_scale},
        stroke_width=3,
        colors=[color],
        display_legend=display_legend,
        labels=[label],
    )
    x_axis = bqplot.Axis(scale=x_scale)
    y_axis = bqplot.Axis(scale=y_scale, orientation="vertical")
    bqplot.Figure(
        axes=[x_axis, y_axis],
        marks=[lines],
        scale_x=x_scale,
        scale_y=y_scale,
        layout={"min_width": "800px"},
        interaction=panzoom,
    )

The idea is that an element that gets passed down to multiple parent normally produces separate widgets. Bqplot actually needs the share the widget, for this purpose we introduced in reacton shared elements (they result in a single widget being shared).

Although this feature is not advertised/documented, this has always been tested in https://github.com/widgetti/reacton/blob/d214dfa95cea4d2d9541b6f2cc32f1f5f9696be5/reacton/core_test.py#L794

For unclear reasons, it passes in the test, while failing in solara. I've spend quite some time to understand this, but currently don't have the time to solve this.
The error is:

RuntimeError: Element not reconsolidated: {bqplot.scales.LinearScale(allow_padding = False), bqplot.scales.LinearScale(allow_padding = False)}

This is actually only a sanity test, and by commenting out the line that generates the error I can get this to work, however I feel uncomfortable doing that without understanding what does on.
If you have time to try to fix this great, but it's a complex issue!

Regards,

Maarten

[swelborn]

Thanks for looking into it @maartenbreddels.

I don't have time to look into it at the moment either. if you know of someone who might understand it better, may be good to tag them here.

[maartenbreddels]

I've added an issue at Reacton at widgetti/reacton#31 so it is less likely to be snowed under. Let me close this issue, since that is the fundamental issue.