Issue with SeriesSelectionHandler on Charts on Scrolling down the browser

Hi Everyone !

First of all I use GXT Charts 3.0.1, I noticed a bug with selectionHandler on series in all web browsers.

I designed a page with some charts that I can select series. And sometimes, i have to scroll the page to see them all.
Infortunately, when the scrollbar of the browser is not at the top, the seriesSelection doesn't point very well ont the barSeries and the selection is weird.

What exactly is the bug? Can you provide a simple example, implementing EntryPoint that demonstrates the issue?

Fortunatly for this issue, our chart examples resize, and do not properly confine how large they can get - you can resize the chart in these examples to be too big to fit in the page, but the highlighting, selecting, and tooltips all work correctly as far as I can see. These are all using 3.0.1, as the title indicates.

Finally, a part of EntryPoint class looks like this (I only make 2 changes, those in bold font):

Code:

/**
* Create a remote service proxy to talk to the server-side Greeting service.
*/
private final GreetingServiceAsync greetingService = GWT.create(GreetingService.class);
/**
* This is the entry point method.
*/
public void onModuleLoad() {
final Button sendButton = new Button("Send");
final TextBox nameField = new TextBox();
nameField.setText("GWT User");
final Label errorLabel = new Label();
final BarExample diagramme = new BarExample();
// We can add style names to widgets
sendButton.addStyleName("sendButton");
// Add the nameField and sendButton to the RootPanel
// Use RootPanel.get() to get the entire body element
RootPanel.get("nameFieldContainer").add(nameField);
// RootPanel.get("sendButtonContainer").add(sendButton);
RootPanel.get("sendButtonContainer").add(diagramme);
RootPanel.get("errorLabelContainer").add(errorLabel);
// Focus the cursor on the name field when the app loads
nameField.setFocus(true);
nameField.selectAll();
...

At the execution, we can see that if we resize the web browser page as far as a scroll bar could appear, and when we scroll down, the selectionHandler of BarSeries doesn't fit.

Unfortunately, your example doesn't run as-is. You are using an HTML page with various elements specifically set up to receive their widgets, so without that html page, I can't even run the app. Those IDs are "nameFieldContainer", "sendButtonContainer", and "errorLabelContainer".

If I just make three divs, each with those IDs, in that order, and shrink the window small enough to require scrollbars, I am able to reproduce the issue. I've filed it, and have a temporary workaround that should let your use case continue to function until we have a complete solution.

Subclass the Chart when you create it, and override the getEventXY method to look like this:

The getBodyScrollLeft/Top methods are not present in the current version. These are generally not needed - most GXT applications are designed to be full-screen, using the Viewport class and other layouts, so that the app sizes itself to fit the browser, and multiple nested scrollbars are never required. I've tested this workaround in FF17, Chrome 23, and IE8.

We'll update this thread when a fix is available. Thanks for your report.

Hi Colin,
if your Series has a ToolTip, the workaround you stated above corrects the issue when/if tooltip is shown. That's fine.
But unfortunately the spot the tooltip is shown at is wrong, if your app has been scrolled. Reason is that there is no call to getEventXY(Event e), but chart.getAbsoluteLeft() / -Top().

Those methods are defined in UIObject (the superclass of Widget) - anything that treats the chart as a UIObject will be surprised when they do not behave as expected. I don't think we can reasonably override that and change the returned value to something other than the absolute positioning that is expected.

Do you have a test case that can demonstrate the issue you are describing?