incubator-flex-dev mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From "Toni Vega (JIRA)" <j...@apache.org>
Subject [jira] [Created] (FLEX-33161) Y axis Scaling problem for chart with two Y axis
Date Tue, 07 Aug 2012 13:57:08 GMT
Toni Vega created FLEX-33161:
--------------------------------

             Summary: Y axis Scaling problem for chart with two Y axis
                 Key: FLEX-33161
                 URL: https://issues.apache.org/jira/browse/FLEX-33161
             Project: Apache Flex
          Issue Type: Bug
          Components: Charts:Multiple Axes
    Affects Versions: Adobe Flex SDK 3.5 (Release), Adobe Flex SDK 3.6 (Release), Adobe Flex
SDK 4.6 (Release)
            Reporter: Toni Vega


Y axis Scaling problem for chart with two Y axis 

Hello, 
We are trying to create a line chart having two vertical scale .We are creating the line series,
the Vertical axis and the vertical axis renderer at runtime. The chart has two series with
each scale representing the data for one series. The scale on the left hand side represents
the data for series1 and the right hand side scale represents the data for second series2.

The problem occurs when the series1 has very small data (e.g. 10, 15, and 20) and the series2
has very large data (e.g. 10000, 15000, and 20000). Then both the scale shows the same values
(i.e. of the series 2 

We have also noted that this problem doesn't occur if the series1 has very large data and
series2 has data in smaller units. 
Below is the code that we have used 

[as] 

lnrAxisKpi1 = new LinearAxis(); 
lnrAxisKpi1.title = KPI1Name; 
axisRend = new AxisRenderer(); 
axisRend.axis =lnrAxisKpi1; 
axisRend.placement = "left"; 
axisRend.titleRenderer = new ClassFactory(customChartTitleRenderer); 
lnrAxisKpi1.labelFunction=defineVerticalLabel; 
series = new LineSeries(); 
series.yField = strmList[1].SITE; 
series.displayName = strmList[1].SITENAME +"- "+ KPI1Name 
series.id = strmList[1].SITE_ID; 
series.verticalAxis = lnrAxisKpi1; 





lnrAxis = new LinearAxis(); 
lnrAxis.title = KPI2Name; 
axisRend1 = new AxisRenderer(); 
axisRend1.axis = lnrAxis; 
axisRend1.placement = "right"; 
axisRend1.titleRenderer = new ClassFactor(customChartTitleRenderer); 
axisRend.setStyle("verticalAxisTitleAlignment","vertical"); 
lnrAxis.labelFunction=defineVerticalLabel; 
lineChartRoot.verticalAxisRenderers.push(axisRend1); 


series = new LineSeries(); 
series.yField = strmList[i].SITE+"1"; 
series.displayName = strmList[i].SITENAME +"- "+ KPI2Name; 
series.id = strmList[i].SITE_ID;series.verticalAxis = lnrAxis; 

[/as] 

we have also tried an example we have created a line chart with two vertical axis renderer
at runtime. 
the code is as follows 

case 1 
[as] 

<?xml version="1.0" encoding="utf-8"?> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"> 
 <mx:Script><![CDATA[ 
import mx.events.IndexChangedEvent; 
import mx.formatters.DateFormatter; 
import mx.controls.Alert; 
import mx.graphics.SolidColor; 
import mx.charts.events.ChartItemEvent; 
import mx.collections.ArrayCollection; 
import mx.charts.HitData; 
import mx.charts.events.ChartItemEvent; 
import mx.charts.series.items.LineSeriesItem; 
import mx.charts.ChartItem; 
import mx.styles.StyleManager; 
import mx.utils.ArrayUtil; 
import mx.charts.AxisRenderer; 
import mx.charts.LineChart; 
import mx.charts.series.LineSeries; 

       
private var lnrAxis:LinearAxis; 
private var axisRend:AxisRenderer; 
[Bindable] 
public var DECKER:ArrayCollection = new ArrayCollection([ 
{date:"22-Aug-05", close:15700.59,open:15}, 
{date:"23-Aug-05", close:16000.3,open:05}, 
{date:"24-Aug-05", close:15000.71,open:20}, 
{date:"25-Aug-05", close:15600.88,open:13}, 
     ]); 

private function createChartSeries():void 
{ 
var Linesrs:Array = new Array(); 
var series1:LineSeries=new LineSeries(); 
var series2:LineSeries=new LineSeries(); 

series1.displayName = "close"; 
series1.yField="close"; 
series2.displayName = "open"; 
series2.yField="open"; 
           
myChart.verticalAxisRenderers = []; 
   
lnrAxisKpi1.title = "left"; 
axisRend = new AxisRenderer(); 
axisRend.axis = lnrAxisKpi1; 
axisRend.placement = "left"; 
axisRend.axis = lnrAxisKpi1; 
series1.verticalAxis = lnrAxisKpi1; 
           
           
           
lnrAxis = new LinearAxis(); 
axisRend = new AxisRenderer(); 
axisRend.axis = lnrAxis; 
lnrAxis.title="righr"; 
series2.verticalAxis = lnrAxis; 
axisRend.placement = "right"; 
axisRend.setStyle("verticalAxisTitleAlignment","vertical"); 
myChart.verticalAxisRenderers.push(axisRend); 

Linesrs.push( series1 ); 
Linesrs.push( series2 ); 


myChart.series = Linesrs; 
myChart.dataProvider=DECKER; 
} 




]]></mx:Script> 
 <mx:Panel title="Column Chart With Multiple Axes" > 
   <mx:LineChart id="myChart" showDataTips="true"> 
       <mx:horizontalAxis> 
           <mx:CategoryAxis id="h1" categoryField="date"/> 
        </mx:horizontalAxis> 
<mx:verticalAxis> 
<mx:LinearAxis id="lnrAxisKpi1" /> 
</mx:verticalAxis> 

         
      </mx:LineChart> 
       <mx:Button label="2 Series" click="createChartSeries()"/> 
      <mx:Legend dataProvider="{myChart}"/> 
    </mx:Panel> 
 </mx:Application> 



[/as] 

case 2: 

when we change the axis 

series1.displayName = "open" 
series1.yField="open"; 
series2.displayName = "close"; 
series2.yField="close"; 

i.e. when the first series has higher values (i.e. at left hand side) and second series with
lower values (i.e. at right) the resulting scaling is proper ; 
but when you interchange the series i.e. series with lower values at left and higher at right
the vertical axis show the same values on both the side s which are incorrect . Please let
us know if there is something wrong in the code that we are using or if its a bug in the flex
sdk. 
Also it would be helpful if you could point us to any solutions if available 


please find the attach document for more details and screenshots . 

--
This message is automatically generated by JIRA.
If you think it was sent incorrectly, please contact your JIRA administrators: https://issues.apache.org/jira/secure/ContactAdministrators!default.jspa
For more information on JIRA, see: http://www.atlassian.com/software/jira

        

Mime
View raw message