This might be quite a niche question, but I’m trying to make a custom rangeslider for a downsampling library which works with plotly. When updating the data on the main graph, the rangeslider’s overview of the data is also changed, making it ineffective.
I have a base idea (image below) using a second graph under the main graph, which will always hold the full data and have a rectangle drawn over the area shown in the main graph. I can also make that rectangle editable (according to the plotly graphing libraries), however, I have no idea how to make a callback that can listen to changes in the horizontal range covered in that rectangle… Any ideas? If needed I can make a new component in React, but I’m just out of ideas on how to tacke this.
Also, is this line of thought even feasible? is such a rangeslider feasible?
Hi @Isisgv , take a look at this example I created some time ago, it does something similar to what you are trying to do if I understand you correctly.
Hi AIMPED, thank you for looking into my problem! I checked out the piece of code you gave me and it’s at the same stage as my issue: zooming into the main graph updates the rectangle on the other graph, but updating the rectangle (as i noticed it was editable by clicking on it) doesn’t make any changes to the visible range of the main graph. Having something that can offer an overview, and bidirectional intraction between both the main graph and overview is what i want. I haven’t tested it out, but in the last few days I’ve come up with this idea using the box select (Part 3. Interactive Graphing and Crossfiltering | Dash for Python Documentation | Plotlyfig.update_layout(clickmode='select')) on the overview and listening to changes in the range of that box. I’ll keep you updated, but if you have some more ideas, i’d also be glad to test them out.
