plotly.js icon indicating copy to clipboard operation
plotly.js copied to clipboard

Rangeslider does not draw chart when using subplots and scattergl

Open stereokai opened this issue 2 years ago • 8 comments

Please see: http://www.stereokai.com/multi-charts-comparison/#plotly The code can be found here: https://github.com/stereokai/multi-charts-comparison/blob/publish/renderers/Plotly/Plotly.js#L22-77

Problem: Range slider is empty, does not draw any chart when rendering with webgl.

Expectation: Range slider will draw the data of 1 subplot.

What I found out: Range slider will draw all of the subplots if I change their type to scatter instead of scattergl.

PS. This is my first time using plotly.js, and I have to say, the API is great, and despite struggling with the documentation, this implementation took me relatively little time compared to all other charting libraries I tried!

stereokai avatar Jun 15 '22 14:06 stereokai

Thanks @stereokai - somehow I thought we already had an open issue for this but I can't find it (@archmoj am I missing it?) anyway you're right that we never completed rangesliders for scattergl. For your use case you'd also be bothered by #2172 and #2010 - which are pretty old issues so as you can deduce rangeslider improvements have not been a top priority for us recently. PRs encouraged of course :)

alexcjohnson avatar Jun 15 '22 23:06 alexcjohnson

@alexcjohnson I'll try to squeeze in some time for PRs, if you can give me pointers on where to start and what to look for :)

stereokai avatar Jun 16 '22 00:06 stereokai

Excellent :)

Rangesliders live here: https://github.com/plotly/plotly.js/tree/master/src/components/rangeslider

To actually render the data they call out to the cartesian (2D) plotting code basically pretending to be another regular cartesian subplot:

https://github.com/plotly/plotly.js/blob/b2df3710d7877ff5b4f85256015a88c8ea8fbe1d/src/components/rangeslider/draw.js#L500

For this issue, the challenge is that gl2d traces (such as scattergl) use a separate drawing pathway from the SVG - entrypoint here - that needs to be worked into the above flow. (And note that "calcdata", that the SVG plots use as an intermediate representation between the trace and the drawn objects, is not used by our webgl trace types)

Hope that helps! Feel free to ask more questions as you get into it.

alexcjohnson avatar Jun 16 '22 14:06 alexcjohnson

And note that "calcdata", that the SVG plots use as an intermediate representation between the trace and the drawn objects, is not used by our webgl trace types

  1. And does rangePlot() require this calcData to work?
  2. If yes, does it mean it is necessary to construct an object with a matching signature based on the gl2d chart data?
  3. Is rangePlot() the method that is used to render regular scattergl charts?

stereokai avatar Jun 16 '22 14:06 stereokai

rangePlot is a little utility that just strings together a couple of pieces deeper in the SVG drawing path, needed to correctly draw these traces into the rangeslider subplot. I think rather than fitting the gl2d traces into Cartesian.rangePlot, we probably should create a similar routine on the gl2d side - that runs after Cartesian.rangePlot so it can depend on the framework already being present - but just adds the gl2d pieces.

Another thing to note: we support partial bundles, some of which don't include gl2d traces, so we'll want to find this code not via normal require statements but via perhaps Registry.getModule so we can skip this part if that module isn't found.

alexcjohnson avatar Jun 16 '22 14:06 alexcjohnson

I see. If Cartesian.rangePlot is only SVG then how would a prospective gl2d method run after it? Would Cartesian.rangePlot still be part of the process?

stereokai avatar Jun 16 '22 14:06 stereokai

I suspect that Cartesian.rangePlot may still need to be run just to get the framework set up correctly, even if there are no SVG traces to draw. But I'm not 100% sure about that, it may be OK to skip it if you have only gl2d traces.

alexcjohnson avatar Jun 16 '22 18:06 alexcjohnson

Okay. I understand though only theoretically as I haven't looked at the code yet.

Any chance you might have a moment to chime in on the conversation here? (Particularly to my reply to you)

Thanks one more time

stereokai avatar Jun 16 '22 19:06 stereokai