1. #1
    Sencha User Radius-Service's Avatar
    Join Date
    Jul 2010
    Location
    Russia, Perm
    Posts
    47
    Vote Rating
    1
    Radius-Service is on a distinguished road

      0  

    Default Answered: Lines with different number of points on the same graph

    Answered: Lines with different number of points on the same graph


    Is it possible to fit on one line graph with a different amount of points?
    Something similar to the following algorithm:
    PHP Code:
    for (0<= c+ +) {
       if (
    i5) {
         
    t_data.push ({
            
    'M't_m,
            
    'N'f1 (t_m),
            
    'P'f2 (t_m)
         });   }
       else { 
        
    t_data.push ({
            
    'M't_m
            
    'N'f1 (t_m),
            
    'P'null
       
    }
       
    t_m + = delta;

    chart1.png

  2. Most definitely:

    Code:
    Ext.create('Ext.chart.Chart', {
        renderTo : document.body,
        width    : 1000,
        height   : 600,
        style    : 'background:#fff',
        animate  : true,
        store    : {
            fields : ['name', 'data1', 'data2', 'data3'],
            data   : [
                {
                    name  : 'One',
                    data1 : 5
                },
                {
                    name  : 'Two',
                    data1 : 15,
                    data2 : 5
                },
                {
                    name  : 'Three',
                    data1 : 10,
                    data2 : 10,
                    data3 : 14
                },
                {
                    name  : 'Four',
                    data2 : 15,
                    data3 : 0
                }
            ]
        },
        shadow   : true,
        theme    : 'Category1',
        legend   : {
            position : 'right'
        },
        axes     : [
            {
                type           : 'Numeric',
                minimum        : 0,
                position       : 'left',
                fields         : ['data1', 'data2', 'data3'],
                title          : 'Number of Hits',
                minorTickSteps : 1,
                grid           : {
                    odd : {
                        opacity        : 1,
                        fill           : '#ddd',
                        stroke         : '#bbb',
                        'stroke-width' : 0.5
                    }
                }
            },
            {
                type     : 'Category',
                position : 'bottom',
                fields   : ['name'],
                title    : 'Month of the Year'
            }
        ],
        series   : [
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data1',
                markerConfig : {
                    type           : 'cross',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            },
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data2',
                markerConfig : {
                    type           : 'circle',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            },
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data3',
                markerConfig : {
                    type           : 'circle',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            }
        ]
    });

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,647
    Vote Rating
    899
    Answers
    3575
    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


    Most definitely:

    Code:
    Ext.create('Ext.chart.Chart', {
        renderTo : document.body,
        width    : 1000,
        height   : 600,
        style    : 'background:#fff',
        animate  : true,
        store    : {
            fields : ['name', 'data1', 'data2', 'data3'],
            data   : [
                {
                    name  : 'One',
                    data1 : 5
                },
                {
                    name  : 'Two',
                    data1 : 15,
                    data2 : 5
                },
                {
                    name  : 'Three',
                    data1 : 10,
                    data2 : 10,
                    data3 : 14
                },
                {
                    name  : 'Four',
                    data2 : 15,
                    data3 : 0
                }
            ]
        },
        shadow   : true,
        theme    : 'Category1',
        legend   : {
            position : 'right'
        },
        axes     : [
            {
                type           : 'Numeric',
                minimum        : 0,
                position       : 'left',
                fields         : ['data1', 'data2', 'data3'],
                title          : 'Number of Hits',
                minorTickSteps : 1,
                grid           : {
                    odd : {
                        opacity        : 1,
                        fill           : '#ddd',
                        stroke         : '#bbb',
                        'stroke-width' : 0.5
                    }
                }
            },
            {
                type     : 'Category',
                position : 'bottom',
                fields   : ['name'],
                title    : 'Month of the Year'
            }
        ],
        series   : [
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data1',
                markerConfig : {
                    type           : 'cross',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            },
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data2',
                markerConfig : {
                    type           : 'circle',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            },
            {
                type         : 'line',
                highlight    : {
                    size   : 7,
                    radius : 7
                },
                axis         : 'left',
                smooth       : true,
                xField       : 'name',
                yField       : 'data3',
                markerConfig : {
                    type           : 'circle',
                    size           : 4,
                    radius         : 4,
                    'stroke-width' : 0
                }
            }
        ]
    });
    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.

  4. #3
    Sencha User Radius-Service's Avatar
    Join Date
    Jul 2010
    Location
    Russia, Perm
    Posts
    47
    Vote Rating
    1
    Radius-Service is on a distinguished road

      0  

    Default


    Thank you! I did everything the same. But found the differences. I used the "type":
    PHP Code:
            Ext.define('vReportsProductsSN.tab_5.chart.model', {
                
    extend'Ext.data.Model',
                
    fields: [
                    {
    name'M',        type'float',    useNulltrue},
                    {
    name'N',        type'float',    useNulltrue},
                    {
    name'P',        type'float',    useNulltrue},
                    {
    name'K',        type'float',    useNulltrue}
                ]
            }); 
    see Fig.
    If not to use it, then everything works.
    PHP Code:
     {name'K'
    chart2.png

Thread Participants: 1

Tags for this Thread