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

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar