Within an application featuring a dynamic assortment of plots rendered and scaled within a fixed div
, I am grappling with the final scenario whereby, in a layout of plots spanning multiple columns and rows, the message should be contained within the grouping object instead of spilling outside.
My endeavors to implement hover messages over ggplots
have led me through various questions and iterations:
1. Achieving hover functionality over a single plot without exceeding the screen boundaries - see Question 1.
2. Extending hover capabilities to encompass multiple plots - refer to Question 2.
3. Implementing corrections to prevent message overflow beyond the desired area. Despite making progress with the code shared in comments and edits, there are still some issues: "The message almost always ends up vertically centered above the top row plot". Hence, further adjustments are required.
Instead of reacting only when the message would overlap the entire multi-panel structure, the current correction triggers when it overlaps the bottom of any single plot.
The corrective action often relocates the message to coordinates in the top row of plots rather than staying within the relevant row we are hovering over.
The JavaScript version (which isn't functioning as intended) currently resembles:
<!-- Embedded JavaScript code here -->
While this approach avoids the need for predetermined sizes, it falls short of meeting my specific requirements, as evidenced by the accompanying images below:
https://i.sstatic.net/2VF5H.png
https://i.sstatic.net/p5ZAU.png
https://i.sstatic.net/t5Ai4.png
Prior versions managed to adjust the plots but failed to verify if the message could fit after being positioned between the anchor point and the edge of the multiplot container (FP1PlotMultiplot
)
<!-- Additional code snippet showcasing previous implementation -->
I have created a comprehensive test app demonstrating the "almost working" version which showcases the enhancements made thus far in attempting to rectify the issue.
<!-- Test app script showing latest improvements -->