Success! Looks like we've fixed this one. According to our records the fix was applied for a bug in our system in a recent build.
  1. #1
    Ext GWT Premium Member
    Join Date
    Oct 2011
    Posts
    99
    Vote Rating
    0
    LEWJO10@ca.com is on a distinguished road

      0  

    Default (GXT 3.0.0 GA) IE Long Running Script Charting Issue

    (GXT 3.0.0 GA) IE Long Running Script Charting Issue


    Version of Ext GWT
    This problem occurs in the recently released GA version of Ext GWT 3.0.0.

    Browser versions
    Firefox 7
    Internet Explorer 8

    Operating System
    Windows 7 64 bit

    Hardware
    Dell Precision M4500
    8 CPUs – Intel Core i7
    8 GB Memory

    Virtual Machine
    No

    Description
    We have a requirement to show up to 200 intervals (days) of data across a TimeAxis in the bottom position in a chart that has a BarSeries is used in column mode (setColumn(true)) and stacked mode (setStacked(true)) in conjunction with a LineSeries.

    This chart is intended to replace an existing Adobe Flex chart currently in use.

    A GXT 3.0.0 chart like this does not seem to have performance issues when using Firefox, but it does have performance issues when using Internet Explorer as the long running script dialogue pops up.

    Please note that this entire posting refers to the performance of the chart
    when deployed to Tomcat (web mode), and not running under Eclipse (dev mode).

    Steps to Reproduce
    The attached file (ColumnChartIEPerformanceIssue.txt) can be used to demonstrate the problem.

    The chart first comes up showing a range of time from July 1, 2012 through January 16, 2013, which is 200 days.

    In Firefox 7, this chart renders in less than four seconds.

    However, in Internet Explorer 8, this same chart takes thirteen seconds and the long running script dialogue pops up (see attached screen shot ColumnChartIEPerformanceIssue.png). It looks like VML is taking three times longer than Sprite.

    You can use the Start Date and End Date controls below the chart to observe how the chart performs for different ranges (intervals) of time.

    Please let me know if I am doing anything wrong in the code in the attached file or if there is a work around.

    Thanks,
    John L
    Attached Images
    Attached Files

  2. #2
    Sencha - GXT Dev Team BrendanC's Avatar
    Join Date
    Aug 2010
    Posts
    534
    Vote Rating
    3
    BrendanC is on a distinguished road

      0  

    Default


    Hey John,

    If I use time.setLabelStepRatio(10); the long script warning goes away. This is because text sprites are by far the most expensive to draw and the default behavior is to draw a text sprite for all 200 intervals (necessary to determine size) and then hide sprites that overlap. Using label step ratio is useful for such large axes as it preempts the overlap check. Though I also noticed a bug in this use case. I will let you when it has been fixed.

    Also the way you are handling the store could be more efficient. When you setup the store you could populate for the points between min and max date:
    Code:
    final ListStore<ItemsPurchased> listStore = new ListStore<ItemsPurchased>(DATA_ACCESS.dateKey());       
    Date dateWork = new Date(minDate.getTime());
            Date dateWorkEnd = new Date(maxDate.getTime() + 86400000);
            while (dateWork.getTime() < dateWorkEnd.getTime()) {
                listStore.add(new ItemsPurchased(new Date(dateWork.getTime()), Math.floor(Math.max(Math.random() * 30, 1)),
                        Math.floor(Math.max(Math.random() * 30, 1)), Math.floor(Math.max(Math.random() * 30, 1)),
                        Math.floor(Math.max(Math.random() * 30, 1)), Math.floor(Math.max(Math.random() * 30, 1))));
                dateWork = new Date(dateWork.getTime() + 86400000);
            }
    And then you can use time axis to filter store for the specified dates:

    Code:
    final TextButton getDataButton = new TextButton("Get Data");        
    getDataButton.setLayoutData(new MarginData(0, 0, 0, 10));
            getDataButton.addSelectHandler(new SelectHandler()
            {
                @Override
                public void onSelect(SelectEvent event)
                {
                    if (startDateField.isValid() && endDateField.isValid())
                    {
                        time.setStartDate(startDate);
                        time.setEndDate(endDate);
                        chart.redrawChartForced();
                    }
                }
            });
    Hope that helps.

  3. #3
    Ext GWT Premium Member
    Join Date
    Oct 2011
    Posts
    99
    Vote Rating
    0
    LEWJO10@ca.com is on a distinguished road

      0  

    Default


    Brendan,

    Thank you for the info and guidance on this.

    As I now understand it, the default behavior is to draw a text sprite for all 200 intervals (necessary to determine size) and then hide sprites that overlap.

    This sequence can lead to irregular spacing of the labels along the horizontal axis when LabelStepRatio is set to certain values greater than one but still small enough to cause the labels to overlap. The irregular spacing does not look very good (see attached IrregularSpacing.png).

    That is why I set LabelStepRatio to 1 (as well as the equivalent function in the old Flex charts).

    Using higher values (such as 10) for LabelStepRatio avoids the problem as the labels while likely / hopefully not overlap.

    So, I did some experiments in Excel and came up with a formula that will yield a value to use for the LabelStepRatio for a given number of intervals that guarantees no more than 20 labels and no fewer than 15 labels along the horizontal axis for a typical browser window width.

    By restricting the number of labels to be between 15 and 20, the probably of label overlap is minimized and therefore irregular spacing of the labels along the horizontal axis.

    If the user resizes the browser window to be more narrow in width, then label overlap will still occur along with the unsightly irregular spacing of the labels along the horizontal axis.

    But, given the constraints of what we have to work with, this formula winds up being the best option I can think of. I plan to make it a static method in a utility class for the charts to use in our app.

    Is there a better way to approach this? Our charts allow the user to vary the number intervals and resize the chart by resizing the browser window.

    Also, given your reply, is there no way to further improve the performance for IE VML? Setting LabelStepRatio to 1 for 200 intervals is not a problem for Firefox Sprite.

    Finally, when will we switch to Sprite for IE? Will it be IE 10? Is it possible to use Sprite for IE 9?

    Thanks,
    John L
    Attached Images

  4. #4
    Sencha - GXT Dev Team BrendanC's Avatar
    Join Date
    Aug 2010
    Posts
    534
    Vote Rating
    3
    BrendanC is on a distinguished road

      0  

    Default


    Hey John,
    There have been major improvements to the axis/text sprite performance in the recent 3.0.1 release. Let me know if that resolves this issue for you. Also label step ratio has been changed to always display the first and last data points on the axis.
    As for your IE question, yes sprites work with IE9 and IE10. It should be comparable to Firefox as both 9 and 10 support the SVG engine.

  5. #5
    Ext GWT Premium Member
    Join Date
    Oct 2011
    Posts
    99
    Vote Rating
    0
    LEWJO10@ca.com is on a distinguished road

      0  

    Default


    Brendan,

    Yes, the new GXT 3.0.1 release resolves the problem for me. This can be closed. Thanks!

    John L

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi