1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    57
    Vote Rating
    0
    vikramiyer is on a distinguished road

      0  

    Default Sencha Touch Charts View Refresh(Axis)

    Sencha Touch Charts View Refresh(Axis)


    Hi,

    I have a requirement where a chart is refreshed upon picker selection. Every option selected in the picker makes an Ajax call to fetch new contents which then updates the store and the chart refreshes.

    The only thing that doesn't change is the x-axis and the y-axis. As a result the chart either becomes small or goes out of scope since the axis is fixed. The axis is not getting refreshed. How do I refresh my view to modify the axis.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,754
    Vote Rating
    827
    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


    First thing is why not just load the store setting a param to be sent in the request?
    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 User
    Join Date
    May 2012
    Posts
    57
    Vote Rating
    0
    vikramiyer is on a distinguished road

      0  

    Default


    As far as I see its only the y-axis that doesn't update the x-axis reflects as soon as the store has a change . Below is the code

    Code:
    /**
     * @class Namespace.view.Graph
     * @extends Ext.tab.Panel
     * Description
     */
    Ext.define('Namespace.view.Graph', {
        extend: 'Ext.Panel',
        requires: ['Ext.chart.Chart','Ext.chart.series.Line','Ext.chart.axis.Numeric','Ext.chart.axis.Category','Ext.TitleBar','Ext.picker.Picker'],
        xtype: 'graphpanel',
    
    
        config: {
           cls: 'card1',
           layout: 'fit',
           title: 'Graph',
           iconCls: 'time',
         
           items: [
            {
                
                xtype: 'chart',
                store: 'GraphStore',                
                series: [{
                                                       type: 'line',                                                               
                                                    xField: 'name',
                                                    yField: 'data1', 
                                                      labelField: 'data1', 
                                                    style: {                                                
                                                        stroke: Namespace.view.ColorPatterns.getBaseColors(1),
                                                        fillOpacity: 0.6,
                                                        miterLimit: 4,
                                                        lineCap: 'miter',
                                                        lineWidth: 2
                                                    },
                                                    marker: {
                                                            type: 'circle',
                                                            size: 3,
                                                            radius: 3,
                                                            'stroke-width': 3
                                                    }                               
                                            },{
                                                       type: 'line',                                
                                                    xField: 'name',
                                                    yField: 'data2', 
                                                    labelField: 'data2',  
                                                    style: {
                                                        fill: Namespace.view.ColorPatterns.getBaseColors(0),
                                                        stroke: Namespace.view.ColorPatterns.getBaseColors(0),
                                                        fillOpacity: 0.5,
                                                        miterLimit: 3,
                                                        lineCap: 'miter',
                                                        lineWidth: 2
                                                    },
                                                    marker: {
                                                        type: 'circle',
                                                        size: 3,
                                                        radius: 3,
                                                        'stroke-width': 2
                                                    }
                 }],
                 axes: [{
                                                      type: 'numeric',
                                                      position: 'left',
                                                    fields: ['data1','data2'],               
                                                    title: {
                                                        text: 'Hours',
                                                        fontSize: 20
                                                    }
    
    
                                                },{
                                                    type: 'category',
                                                    position: 'bottom',
                                                    fields: ['name'],
                                                    title: {
                                                        text:'Date',
                                                        fontSize: 20
                                                    }
    
    
                }]
            },
            {
                 xtype: 'picker',
                
                 id: 'graphPicker',
                useTitles: true,
                slots: [
                        {
                             name: 'graph',
                             xtype: 'pickerslot',                        
                              title: 'Select Date',
                               store: 'SlotStore'                     
                        }
                 ]
             }]          
        },
        initialize: function() {
            this.callParent(arguments);
        }
    });

  4. #4
    Sencha User
    Join Date
    May 2012
    Posts
    57
    Vote Rating
    0
    vikramiyer is on a distinguished road

      0  

    Default


    Burndown.jpgMitchell do you have any pointers based on the code uploaded? I have attached a screenshot of what's happening.... The first time the axis shows just fine... The next time onwards... The axis is fixed and the values are relative.

  5. #5
    Sencha User
    Join Date
    May 2012
    Posts
    57
    Vote Rating
    0
    vikramiyer is on a distinguished road

      0  

    Default


    Here is another observation... The axis loads properly now when the device is rotated but not when the store is synced. However to rotate the device for the graph to refresh its axis is ugly.

Thread Participants: 1

Tags for this Thread

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