Thank you for reporting this bug. We will make it our priority to review this report.
  1. #1
    Ext JS Premium Member
    Join Date
    Nov 2009
    Location
    St Louis,MO
    Posts
    267
    Vote Rating
    18
    James Goddard will become famous soon enough James Goddard will become famous soon enough

      0  

    Default [CLOSED EXTJSIV-146] Several issues with numeric axis

    [CLOSED EXTJSIV-146] Several issues with numeric axis


    Using the following code:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html>
    	<head>
    		<title id="page-title">Test Page</title>
    			
    		<link rel="stylesheet" type="text/css" href="js/extjs/resources/css/ext-all.css" />
    		
    		<script type="text/javascript" src="js/extjs/ext-core-debug.js"></script> 
    		<script type="text/javascript" src="js/extjs/ext-all-debug.js"></script> 
    
    		<script type="text/javascript">
             Ext.onReady(function () {
                Ext.regModel('Plot', {
                   fields: [
                      {name: 'x',  type: 'date'},
                      {name: 'y',  type: 'float'} 
                   ]
                });
    
                var store = new Ext.data.Store({
                   model: 'Plot',
                   data : [
                      { x: 1, y: 9.13, z: 3.18 },
                      { x: 2, y: 7.15, z: 4.18 },
                      { x: 3, y: 9.13, z: 3.18 },
                      { x: 4, y: 1.2, z: 1.2 },
                      { x: 5, y: 1.2, z: 1.2 }
                   ]
                });
       
                 var win = Ext.create('Ext.Window', {
                     width: 800,
                     height: 600,
                     hidden: false,
                     maximizable: true,
                     title: 'Line Chart',
                     renderTo: Ext.getBody(),
                     layout: 'fit',
                     items: {
                         xtype: 'chart',
                         store: store,
                         axes: [{
                             type: 'Numeric',
                             position: 'left',
                             fields: [ 'y', 'z' ]
                         }],
                         series: [{
                             type: 'line',
                             axis: 'left',
                             xField: 'x',
                             yField: 'y'
                         }, {
                             type: 'line',
                             axis: 'left',
                             xField: 'x',
                             yField: 'z'
                         }]
                     }
                 });
             });
    		</script>
    	</head>
    	<body>
    		<div id="grid-example"></div> 
    	</body>
    </html>
    1. The difference between the first marker (1) and the second (1.8) is .8, and between the second (1.8) and third (2.6) is .8. However the difference between the third (2.6) and the fourth (3.400000000000004) is .800000000000004.
    2. The first and third y data points are outside of the chart.
    3. If you add the following to the axis config
      Code:
      majorUnit: 2,
      minorUnit: 1,
      You will see that both minorUnit and majorUnit seem to have no effect on the numbers displayed.
    4. If you add the following to the axis config
      Code:
      adjustMaximumByMajorUnit: true,
      adjustMinimumByMajorUnit: true,
      You will see that while the top and bottom numbers displayed on the axis are changed, all of the plot points are now wrong. For example the first point is plotted at ~7.6 and ~2.65, instead of 9.13 and 3.18.
    5. Adding snapToUnits seems to have no effect. In fact when searching the code snapToUnits, majorUnit and minorUnit all appear to be unused.

  2. #2
    Sencha User
    Join Date
    Nov 2010
    Posts
    168
    Vote Rating
    0
    philogb is on a distinguished road

      0  

    Default


    Hi,

    Thank you very much for the report. I just tested the code in Chrome and IE and it seems to be working well, here are the screenshots for these: http://imgur.com/a/DPJJz . Do you still see the problem? Which browser / OS are you using?

    Thanks

  3. #3
    Ext JS Premium Member
    Join Date
    Nov 2009
    Location
    St Louis,MO
    Posts
    267
    Vote Rating
    18
    James Goddard will become famous soon enough James Goddard will become famous soon enough

      0  

    Default


    Items 1 and 2 were fixed in PR4. 3, 4, and 5 still occur in Chrome/FF/IE on Windows.

    On numbers 3 and 5 they just have no effect on the chart at all.

    On number 4 look at the data point markers and where they line up on the axis. The adjust properties change the min and max on the axis but the data plot doesn't change so it no longer matches up with the axis.

  4. #4
    Ext JS Premium Member
    Join Date
    Nov 2009
    Location
    St Louis,MO
    Posts
    267
    Vote Rating
    18
    James Goddard will become famous soon enough James Goddard will become famous soon enough

      0  

    Default


    Correction. Item 1 was not fixed. It renders properly with the data above but if you change the data to:

    Code:
    [
     { x: 1, y: 5.5, z: 5.5 },
     { x: 2, y: 5.5, z: 2.75 },
     { x: 3, y: 0, z: 0 }
    ]
    It again renders incorrectly. See attachment.

    example1.png

  5. #5
    Sencha User
    Join Date
    Nov 2010
    Posts
    168
    Vote Rating
    0
    philogb is on a distinguished road

      0  

    Default


    Hi,

    Thanks for providing the attachment. This is a problem with floating point arithmetic in JavaScript. This can be solved by adding a label renderer function for the Numeric axis, for example:

    HTML Code:
                axes: [{
                    type: 'Numeric',
                    /* some other options */
    		label: {
                            /* round to one decimal */
    			renderer: function(v) {
    				return Math.round(v * 10) / 10;	
    			}	
    		}
                }, 
                /* other axis configuration here... */
                ]
    Also, we added a small change to the API to handle the other parameters. Those parameters weren't used and they were there from an old chart api, we added `minimum`, `maximum` and `majorTickSteps` the latter being the number of "ticks" between the minimum value and maximum value for the numeric axis. I think this should solve the problem.

    Thanks and I hope this helps,

  6. #6
    Ext JS Premium Member
    Join Date
    Nov 2009
    Location
    St Louis,MO
    Posts
    267
    Vote Rating
    18
    James Goddard will become famous soon enough James Goddard will become famous soon enough

      0  

    Default


    Thanks for the updates.

    Just to clarify, you've closed this but you didn't mention the issues with the adjustMaximumByMajorUnit and adjustMaximumByMinorUnit changing the scale of the axis but not changing the scale of the data. Was that fixed as well?

  7. #7
    Sencha User
    Join Date
    Mar 2011
    Posts
    4
    Vote Rating
    0
    bbraun is on a distinguished road

      0  

    Default


    I think the majorTickSteps approach has an important imitation. It requires that the axis end evenly on a major division. I find it is frequently useful to scale a chart so the axis ends between major divisions. For example, range of 0-35 with labels at 0,10,20. I'd prefer to specify the major grid interval, and have it be completely separate from the axis minimum & maximum.

Similar Threads

  1. Replies: 5
    Last Post: 16 Nov 2011, 8:11 AM
  2. [FIXED-EXTJSIV-219] Chart Y-Axis label issues
    By margozzi in forum Ext:Bugs
    Replies: 5
    Last Post: 25 Mar 2011, 3:09 PM
  3. Replies: 1
    Last Post: 25 Mar 2011, 8:36 AM
  4. [OPEN-EXTJSIV-205] Numeric axis issues
    By vdan in forum Ext:Bugs
    Replies: 1
    Last Post: 20 Mar 2011, 11:21 PM
  5. Setting the Line Chart Numeric Axis Range
    By GoneIn20Seconds in forum Ext 3.x: Help & Discussion
    Replies: 4
    Last Post: 2 Apr 2010, 8:13 AM

Thread Participants: 2

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