[feature request] Interactivity

[LegNeato]

Unless I missed it, there is no way to create interactive plots for wasm or native.

[38]

No, for this version it doesn't support. There's a planned responsive element support and a model layer for interactive support.
Will work on this 😸

[TatriX]

How can I help with this?
Right now I'm using CanvasBackend and I need to have some interactivity. I tried SVGBackend but it doesn't' work with wasm. I was thinking about implementing custom svg backend for the seed wasm framework, but if you have better ideas please share!

[38]

Hi @TatriX, I am really appreciated if you could help on this. One note I need to add is I have a plan to make some breaking change on the API which makes me considering publishing a 0.3 version.

One thing in the purposed major release might be related to this is I am planning to have most of the backend moved to separate crates (very similar to what serde currently doing).

So this may have some change to the API and the architecture. I personally wish you base on the v0.3 branch, since I believe I am going to publish it maybe in a month or two. See the branch at https://github.com/38/plotters/tree/v0.3-pre

And all the backend code is under https://github.com/plotters-rs

I really appreciate your help. And you are also welcome to work on the master branch (But in this case I might be think how to make it work on the 0.3 branch as well). But it's up to you to base on the master or v0.3-pre.

Thanks again!
Cheers

[TatriX]

Sure! Then I'll start by migrating my project to v0.3 to learn it first.

[TatriX]

So, I've finally looked at the DrawingBackend and plotters-canvas and plotters-svg.

Let's say I want to do a simple thing: show a box with some text when user hovers a cursor on a data point. I can't see how this can be supported with the current API. Do you have any ideas on how it should be approached?

[38]

Yep, this is the case. What I am planning at this point is following.

Plotters doesn't directly response any event, however, Plotters helps to dispatch events. But handling a event should be out of Plotters' scope.

Let's say, if there's an point element in the drawing area, once a click event is acknowledged by whatever UI infrastructure (e.g HTML canvas or GTK, etc), we should expose a function that accepts a event (type, pixel coordinate, etc... e.g. Hover(100,100)), and returns the dispatched event like Hover on a particular element.

It's pretty much like something happens here https://github.com/38/plotters/blob/98c78d84579edade6f55335748141d82d8177745/examples/wasm-demo/www/index.js#L47 (P.S. This is exactly my prototype of interactivity back to the very early days of Plotters)

So I think if you need a bubble tooltip, probably we can use two layers of canvas and one for the actual plot and another for the tool tips and the code might be like.

function onMouseHover(event) {
      var dispatched_event = chart.dispatch_event(event));
      if(dispatched_event != null && dispatched_event.element_type = "point") {
            draw_tooltip(....);
      }
}

And ideally, the interactivity shouldn't be related to the backend - Since it's application's responsibility to decide whatever they need to do, Plotters is only responsible for identify the event and dispatch it.

That's what I mean by saying add a model layer - A data structure that tracking interactive elements has been drawn to the chart. And once a event is feed into Plotters, it query the data structure and figure out which interactive element should response to this.

And we can provide some standard helper javascript, so that people can do zoom, tooltips, etc very easily. I believe this is the second step.

---

This idea is actually in my mind for almost one year, but it still only a rough plan. Please let me know if you feel anything isn't right.

Thanks so much!

[arctic-alpaca]

What is the next step in getting interactivity working and what can be done to help?

[SorokaGF]

Is there any update on the interactivity for plotters? If work has been done can I see what has been done so far and how I can help