1. #1
    Sencha User
    Join Date
    Mar 2012
    Posts
    2
    Vote Rating
    0
    mycracks is on a distinguished road

      0  

    Default Unanswered: Chart not displayed if X and Y axes are Numeric

    Unanswered: Chart not displayed if X and Y axes are Numeric


    Hello everybody,
    in my company we use ExtJS 4.0.7 (at the moment my boss doesn't want to upgrade to 4.1).
    I have a problem with a line chart configured with both X and Y axes set to 'Numeric' and not displaying anything.
    I'm sure that the data gets loaded from the server, because I've done a console.log of the store and I can see that they are there.
    If I set the X axis to 'Category' I can see all the data, but I haven't got the same controls over the display as I get with 'Numeric' type, resulting in a mess of displayed labels.
    My question is: how could I get the chart to work with both the axes set to 'Numeric'?
    Thank you for your support.

    Here is the code I use for the chart:
    Code:
    Ext.define('Project.view.stats.LineChart' ,{
        extend: 'Ext.chart.Chart',
        alias : 'widget.mylinechart',
        height: 220,
        width: 450,
        animate: true,
        insetPadding: 20,
    
        initComponent : function() {
            this.store = Ext.create('Project.store.Chartdatas');
    
            this.axes = [
                {
                    type: 'Numeric',
                    decimals: 0,
                    minimum: 0,
                    fields: ['timestamp'],
                    position: 'bottom',
                    grid: true,
                    title: "Date",
                    label: {
                        renderer: function(value) {
                            var date = new Date(value * 1000);
                            var label = Ext.Date.format(date, "j M") + "\n" +
                                        Ext.Date.format(date, "H:i");
                            return label;
                        }
                    }
                },
                {
                    type: 'Numeric',
                    decimals: 0,
                    minimum: 0,
                    maximum: 10,
                    fields: ['value'],
                    position: 'left',
                    grid: true,
                    title: "Value"
                }
            ];
    
            this.series = [
                {
                  type: 'line',
                  xField: 'timestamp',
                  yField: 'value'
                }
            ];
    
            this.callParent();
        }
    });
    This is my model:
    Code:
    Ext.define('Project.model.Chartdata', {
        extend : 'Ext.data.Model',
        fields : [
            {
                name : 'timestamp',
                type : 'int'
            },
            {
                name : 'value',
                type : 'double'
            }
        ],
        proxy : Ext.create('Project.proxy.DefaultProxy', {
            api : {
                read : '/get_chart_data'
            }
        })
    });
    And this is my Store:
    Code:
    Ext.define('Project.store.Chartdatas', {
        extend: 'Ext.data.Store',
        model: 'Project.model.Chartdata'
    });
    Everything is then inserted into a panel, which loads the store and displays the chart.

  2. #2
    Sencha User
    Join Date
    Mar 2012
    Posts
    2
    Vote Rating
    0
    mycracks is on a distinguished road

      0  

    Default Test yourself

    Test yourself


    You can get a feel for exactly what is my problem by copying and pasting this code (which reproduces my problem) here: http://try.sencha.com/extjs/4.0.7/do....1/viewer.html
    Code:
    /*global Ext:false */
    Ext.onReady(function () {
        var store = Ext.create('Ext.data.JsonStore', {
            fields: ['xValue', 'yValue'],
            data: [
              {'xValue': 10,  'yValue': 2},
              {'xValue': 15,  'yValue': 7}, 
              {'xValue': 18,  'yValue': 22}, 
              {'xValue': 23,  'yValue': 4}, 
              {'xValue': 25,  'yValue': 13},
              {'xValue': 32,  'yValue': 0},
              {'xValue': 40,  'yValue': 1}
            ]
        });
    
        Ext.create('Ext.chart.Chart', {
            renderTo: Ext.getBody(),
            width: 500,
            height: 300,
            store: store,
            axes: [{
                type: 'Numeric',
                position: 'left',
                fields: ['yValue'],
                title: 'Y Axis',
                grid: true,
                minimum: 0,
                adjustMinimumByMajorUnit: 0
            }, {
                type: 'Numeric',
                position: 'bottom',
                fields: ['xValue'],
                title: 'X Axis',
                grid: true,
                label: {
                    rotate: {
                        degrees: 315
                    }
                }
            }],
            series: [{
                type: 'line',
                highlight: false,
                axis: 'left',
                xField: 'xValue',
                yField: 'yValue'
            }]
        });
    });
    and you'll notice that when you set X axis to 'Category' everything works, but when you set it back to 'Numeric' you will not see anything.

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