Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Sencha Premium Member
    Join Date
    May 2010
    Posts
    9
    Vote Rating
    1
    udesh is on a distinguished road

      0  

    Default Touch Chart 2 Freeze the App

    Touch Chart 2 Freeze the App


    Hi,

    I am playing around with Charts in Touch 2 in Android phones and observe that occasionally chart interactions make the application to freeze and the browser to crash after 30-60 seconds being non-responsive. I am trying the app in Android 4.0.4 in Samsung S3. However when I run it in desktop Chrome I did not observe this issue.

    The interactions I have tried are Pie chart rotations, enable/disable series by clicking on legends in Pie/Bar charts, etc.

    Until this bug is fixed, I don't mind even disabling those interactions. How do I disable them?

    Thanks in advance.
    - Eranga

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,616
    Vote Rating
    818
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The separate Touch Charts release is not being developed on. The charts are now within Sencha Touch 2.1+
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha Premium Member
    Join Date
    May 2010
    Posts
    9
    Vote Rating
    1
    udesh is on a distinguished road

      0  

    Default


    What I'm using is ST 2.1 GPL. The Charts used is non-other-than what's bundled with 2.1.

    I could easily recreate the issue with below 2 Chart panels in an ST barebone app with a tabpanel.

    Code:
    Ext.define('test.app.view.ChartTest1', {
        extend: 'Ext.Panel',
        
        xtype: 'charttest1',
        
        requires: [
            'Ext.chart.PolarChart',
            'Ext.chart.series.Pie',
            'Ext.chart.interactions.Rotate'
        ],
        
        config: {
            title: 'Pie Test',
            iconCls: 'star',
            layout: 'fit',
            padding: 0,
            scrollable: false,
            items: [
                {
                    xtype: 'polar',
                    background: 'white',
                    animate: true,
                    interactions: ['rotate'],
                    colors: ["#94ae0a", "#a61120"],
                    
                    store: {
                        fields: ['name', 'stats'],
                        data: [
                            {'name': 'Cat 1', 'stats': 95},
                            {'name': 'Cat 2', 'stats': 5}
                        ]
                    },
                    
                    //set legend configuration
                    legend: {
                        position: 'bottom'
                    },
                    
                    series: [{
                        type: 'pie',
                        labelField: 'name',
                        xField: 'stats',
                        donut: 30
                    }]
                }
            ]
        }
    });
    Code:
    Ext.define('test.app.view.ChartTest2', {
        extend: 'Ext.Panel',
        
        xtype: 'charttest2',
        
        requires: [
           'Ext.chart.CartesianChart',
           'Ext.chart.axis.Category',
           'Ext.chart.axis.Numeric',
           'Ext.chart.series.Bar',
           'Ext.form.FieldSet',
           'Ext.form.Text'
        ],
        
        config: {
            title: 'Bar Test',
            iconCls: 'star',
            layout: 'fit',
            padding: 0,
            scrollable: false,
            items: [
                {
                    xtype: 'chart',
                    background: 'white',
                    colors: ["#94ae0a", "#a61120"],
                    store: {
                        fields: ['name', 'c1', 'c2'],
                        data: [
                            {"name": "Cat 1", "c1": 80, "c2": 20},
                            {"name": "Cat 2", "c1": 88, "c2": 12},
                            {"name": "Cat 3", "c1": 90, "c2": 10}
                        ]
                    },
                
                    //set legend configuration
                    legend: {
                        position: 'bottom'
                    },
                
                    //define the x and y-axis configuration.
                    axes: [
                        {
                            type: 'category',
                            position: 'bottom',
                            title: 'Categories',
                            fields: 'name'
                        },
                        {
                            type: 'numeric',
                            position: 'left',
                            grid: true,
                            minimum: 0,
                            title: '%'
                        }
                    ],
                
                    //define the actual bar series.
                    series: [
                        {
                            type: 'bar',
                            xField: 'name',
                            yField: ['c1', 'c2'],
                            axis: 'bottom',
                            highlight: true,
                            showInLegend: true,
                            style: {
                                stroke: 'rgb(40,40,40)',
                                maxBarWidth: 30
                            },
                            // Cycles the red, green, and blue fill mode over the 2008, 2009,.., 2011, 2012 items
                            // subStyle parameters also override style parameters
                            subStyle: {
                                fill: ["#94ae0a", "#a61120"]
                            }
                        }
                    ]
                }
            ]
        }
    });
    The issue is very unpredictable. By continuously doing some chart interactions (like pie chart rotate, enable/disable series, etc), I could re-create the issue in all the times. Sometimes the issue come in few seconds the app start, whereas the other times it takes 40-60 seconds to occur.

    In the Android Debugger, I could notice below debug lines when I tap on the chart or canvas, after the application freezes.

    01-28 23:10:32.147: V/webview(13529): NO_FAST_DRAW = false
    01-28 23:10:32.447: V/webview(13529): singleCursorHandlerTouchEvent -getEditableSupport FASLE
    01-28 23:10:33.328: V/webview(13529): NO_FAST_DRAW = false
    01-28 23:10:33.698: V/webview(13529): singleCursorHandlerTouchEvent -getEditableSupport FASLE
    01-28 23:10:34.179: V/webview(13529): NO_FAST_DRAW = false
    01-28 23:10:34.489: V/webview(13529): singleCursorHandlerTouchEvent -getEditableSupport FASLE
    I tried to find some pattern in the debug output just before the error occurs and noticed that at all the cases below log output was made within 1-2 seconds before the freeze happens.

    [paint] Animation detected. Converting the HTML5 canvas buffer to a SkPicture.
    ...
    GC_FOR_ALLOC freed 227K, 15% free 14372K/16803K, paused 24ms
    Note: numbers vary

    If it'll help I can send the full debug output. Any ideas?

    - Eranga

  4. #4
    Sencha Premium Member
    Join Date
    May 2010
    Posts
    9
    Vote Rating
    1
    udesh is on a distinguished road

      0  

    Default


    Hi,

    I wonder if it's only me experiencing this issue?

    I tested the same App in some other phones. The issue is not coming in all the phones/webkit browsers.

    Also, I found when enable/disable chart parts/series dynamically, sometimes Pie chart draw gets crooked.

    Still ST 2.1 charts rock! Just need to iron out these small issues.

    - Eranga

Thread Participants: 1

Tags for this Thread