plotly.js
plotly.js copied to clipboard
Rangeslider does not draw chart when using subplots and scattergl
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!
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 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 :)
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.
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
- And does
rangePlot()
require this calcData to work? - If yes, does it mean it is necessary to construct an object with a matching signature based on the gl2d chart data?
- Is
rangePlot()
the method that is used to render regular scattergl charts?
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.
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?
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.
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