1. #1
    Sencha User
    Join Date
    Jan 2012
    Location
    Pune
    Posts
    71
    Answers
    5
    Vote Rating
    0
    kislay.kishore is on a distinguished road

      0  

    Default Unanswered: Issue with chart's lengend toggle function

    Unanswered: Issue with chart's lengend toggle function


    Hi,
    I have a multi line chart, it has alomst 12 lines.
    I am facing a wiered issue while using the toggle function of legends.

    When I want to see only one line I toggle off rest of the lines.
    Now, when a click on one of the legends to show only one line at a time, the nodes shows one data-point above.

    For example, instead of showing 4 at 4, 4 shows up at 4.5 and so on.

    The same issue doesnt appear, if there is a line already rendered with higher data points, lets say 5 or above.

    I am using extjs4.1, build date: 2012-04-20.

    Please let me know if this might be a bug (already reported) and already fixed, in the latest release? Or, any workaround available?

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,912
    Answers
    655
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Are you able to show this in our online examples, or provide a small test case so we can have a closer look? A screen would also be helpful.

    Are you saying the scale is changing as well?

    Scott.

  3. #3
    Sencha User
    Join Date
    Jan 2012
    Location
    Pune
    Posts
    71
    Answers
    5
    Vote Rating
    0
    kislay.kishore is on a distinguished road

      0  

    Default


    Hi Scott,

    Thanks for your response!

    The scale is not changing, only the data points changes. Please see the descrpency in the screenshot attached.

    I tired to replicate this issue by modifying one of the line chart examples as well, and was able to replicate this issue. I am copying pasting the JS code and html code as below:


    PHP Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <
    html>
    <
    head>
        <
    meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <
    title>Line Chart</title>
      <
    link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" />
        <
    link rel="stylesheet" type="text/css" href="../shared/example.css" />
        <
    script type="text/javascript" src="../../ext-all.js"></script>
     
     
    <script type="text/javascript">
    Ext.require(['Ext.data.*']);
    Ext.require('Ext.chart.*');
    Ext.require(['Ext.Window', 'Ext.fx.target.Sprite', 'Ext.layout.container.Fit']);
    Ext.onReady(function () {
    var myStore= Ext.create('Ext.data.JsonStore', {
        fields: [
      {name: 'month', type:'string'},
      {name: 'Q1', type:'int'},
      {name: 'Q2', type:'int' },
      {name: 'Q3', type:'int' },
      {name: 'Q4', type:'int' }
      
      ],
        data : [
      {
       "month": "Jan",
       "Q1":0,
       "Q2":5,
       "Q3":0,
       "Q4":2
      },
      {
       "month": "Feb",
       "Q1":3,
       "Q2":3,
       "Q3":2,
       "Q4":0
       
      },
      {
       "month": "Mar",
       "Q1":0,
       "Q2":0,
       "Q3":3,
       "Q4":2
       
      } ]
     
      });  
    var panelone = Ext.create('Ext.Panel', {
            width: 500,
            height: 400,
            hidden: false,
            // maximizable: true,
            title: 'Report',
            // renderTo: Ext.getBody(),
            renderTo: 'renderGraph0',
      layout: 'fit',
            tbar: [{
                text: 'Reload Data',
                handler: function() {
                    myStore.loadData(myStore);
                }
            }],
            items: {
                xtype: 'chart',
                style: 'background:#fff',
                animate: true,
                store: myStore,
                shadow: true,
                theme: 'Category1',
       //theme: 'Red',
                legend: {
                    position: 'bottom'
                },
            axes: [{
                    type: 'Numeric',
                    minimum: 0,
                    position: 'left',
                    fields: ['Q1','Q2','Q3','Q4'],
                    title: 'Questions',
                    minorTickSteps: 1,
                    grid: {
                        odd: {
                            opacity: 1,
                            fill: '#ddd',
                            stroke: '#bbb',
                            'stroke-width': 0.5
                        }
                    }
                }, {
                    type: 'Category',
                    position: 'bottom',
                    fields: ['month'],
                    title: 'Months'
                }],
            series: [{
                    type: 'line',
                    highlight: {
                        size: 7,
                        radius: 7
                    },
                    axis: 'left',
                    xField: 'month',
                    yField: 'Q1',
                    markerConfig: {
                        type: 'cross',
                        size: 4,
                        radius: 4,
         'fill': '#0000A0',
                        'stroke-width': 0
                    }
                },
        {
                    type: 'line',
                    highlight: {
                        size: 7,
                        radius: 7
                    },
                    axis: 'left',
                   // smooth: true,
                    xField: 'month',
                    yField: 'Q2',
                    markerConfig: {
                        type: 'circle',
                        size: 6,
                        radius: 6,
                        'stroke-width': 0
                    }
                },
       {
                    type: 'line',
                    highlight: {
                        size: 7,
                        radius: 7
                    },
                    axis: 'left',
                 //   smooth: true,
                    xField: 'month',
                    yField: 'Q3',
                    markerConfig: {
                        type: 'circle',
                        size: 6,
                        radius: 6,
                        'stroke-width': 0
                    }
                },
       {
                    type: 'line',
                    highlight: {
                        size: 7,
                        radius: 7
                    },
                    axis: 'left',
                    //smooth: true,
                    xField: 'month',
                    yField: 'Q4',
                    markerConfig: {
                        type: 'circle',
                        size: 6,
                        radius: 6,
                        'stroke-width': 0
                    }
                }
       
       ]
            }
        });

    });
    </script>

    </head>
        <body id="docbody">
         <h1>Line Chart Example</h1>
         <div style="margin: 10px;">
            <p>
             Display 2 sets of random data in a line series. Reload data will randomly generate a new set of data in the store. Click on the legend items to remove them from the chart. <a href="Line.js">View Source</a>
       <div id="renderGraph0" style="margin-bottom:15px"></div>
      </p>
         </div>
        </body>
    </html> 
    Attached Images

  4. #4
    Sencha User
    Join Date
    Jan 2012
    Location
    Pune
    Posts
    71
    Answers
    5
    Vote Rating
    0
    kislay.kishore is on a distinguished road

      0  

    Default


    Can anyone please take a look in this issue?

    Thanks!

  5. #5
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,912
    Answers
    655
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Please upgrade to the latest version. I do not see this behavior in 4.1.1 (Jul '12)

    Toggling Q2 returns it 3 (under red dot)

    Scott.

  6. #6
    Sencha User
    Join Date
    Jan 2012
    Location
    Pune
    Posts
    71
    Answers
    5
    Vote Rating
    0
    kislay.kishore is on a distinguished road

      0  

    Default


    Ok! i will try that...but were u able to reproduce this issue with 4.1.x (lower version)?

  7. #7
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,912
    Answers
    655
    Vote Rating
    443
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    I was able to duplicate using 4.1.0.

    Scott.

  8. #8
    Sencha User
    Join Date
    Jan 2012
    Location
    Pune
    Posts
    71
    Answers
    5
    Vote Rating
    0
    kislay.kishore is on a distinguished road

      0  

    Default


    ok..thanx....i will try with 4.1.1 and let u know.

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