Brush does not work well on histograms

[Nayananga]

Wave SDK Version, OS

0.21.1, macOS 12.5

(e.g. 4.2.0, Windows)

Actual behavior

(A clear and concise description of what happened.) Zoom does not work well on charts,

https://user-images.githubusercontent.com/25351304/183960901-0ef3d330-86d1-43e9-bf95-02253245455d.mov

Expected behavior

(A clear and concise description of what you expected to happen.) Zoom should work well on charts

Steps To Reproduce

minimal working code

from h2o_wave import main, data, ui, site

page = site['/demo']

page.add('example', ui.form_card(
    box='1 1 4 4', items=[
        ui.visualization(
            plot=ui.plot(
                [
                    ui.mark(
                        type="interval",
                        x1="=x_min",
                        x2="=x_max",
                        x_scale="time",
                        x_title="x_label",
                        y_min=0,
                        y="=y",
                        y_title="y_label",
                        fill_color='#2C2C2C',
                        stroke_color='#5E5E5E',
                        label_overlap="hide",
                    )
                ]
            ),
            data=data(
                fields=["x_min", "x_max", "y"],
                pack=True,
                rows=[["2022/07/13 15:44", "2022/07/15 09:36", 0], ["2022/07/15 09:36", "2022/07/18 04:48", 0],
                      ["2022/07/18 04:48", "2022/07/21 00:00", 0], ["2022/07/21 00:00", "2022/07/23 19:12", 0],
                      ["2022/07/23 19:12", "2022/07/26 14:24", 0], ["2022/07/26 14:24", "2022/07/29 09:36", 0],
                      ["2022/07/29 09:36", "2022/08/01 04:48", 0], ["2022/08/01 04:48", "2022/08/04 00:00", 0],
                      ["2022/08/04 00:00", "2022/08/06 19:12", 0], ["2022/08/06 19:12", "2022/08/09 14:24", 0],
                      ["2022/08/09 14:24", "2022/08/10 15:44", 219]],
            ),
            interactions=["brush"],
        ),
    ]
))

page.save()

[mturoci]

Related to #1474

[manolis1217]

Hi, I would like to deal with this bug, so could you help me start with this bug?? In the future I am planning to deal with more bugs as I want to improve my coding skills @mturoci

[mturoci]

Hi @manolis1217! It would be better if you could do some initial investigations first. Once done and you still have questions, feel free to drop them here.

[manolis1217]

Hi @mturocci, after trying to catch up to the work that has been done in my free time, I faced some difficulties. I traced back form the code the ui and types libraries to get a better understanding of the objects in use as well as the defined methods. However, I couldn't trace back the interaction argument to understand the way it works. Could you pinpoint me where to look for it so I can grasp the idea better and help in the process. Any help will be appreciated! Thanks in advance!

PS: Everything I did was in my free time, so I didn't have the chance to spend too much time or energy (not available) on it

[mturoci]

I couldn't trace back the interaction argument to understand the way it works

interactions arg on python side is just a string array that turns on interactions specified here. The corresponding docs - pro tip: translate the page into English via right-click => translate to english unless you speak Chinese :)

[manolis1217]

Thank you for the quick response, I go through it as soon as possible :)

[manolis1217]

Hey @mturoci, thank you once again for the links you provided! I went through the code, tried some things on my own and concluded that this bug occurs when ui.mark(type='interval',...) and with type = 'points or 'line' the "brush" interaction seems to work fine, which makes me think that maybe there is something weird between the interaction of "brush" and type = 'interval'. So, is there any way to change something in the code and test the results of my changes locally? And if the results are satisfactory to push the code on git? Thanks in advance!

[mturoci]

is there any way to change something in the code and test the results of my changes locally?

Definitely! See https://wave.h2o.ai/docs/contributing/#development-setup.

[marek-mihok]

It is a bug on the g2 lib side. I tried the example provided on the latest g2 plot version (v5) and the brush is working only when autoFit is disabled. Since we need autoFit, we should wait for the fix.

v4 - https://codesandbox.io/s/charming-taussig-h9hg2f?file=/index.ts v5 - https://codesandbox.io/s/dry-worker-tmyzk4?from-embed=&file=/index.ts

Tracked in https://github.com/antvis/G2/issues/5664.