3 Replies Latest reply on Sep 16, 2009 2:45 PM by Cr99

    chart label length clipping problem

    Cr99 Level 1

      I have a generic chart rendering app.  It works fine for most charts, but I am getting some really wierd results when I use a logAxis.  It is clipping the chart on the right side.  Does anyone know how to fix this problem?





      <mx:Panel xmlns:mx="http://www.adobe.com/2006/mxml" styleName="panelfilled" roundedBottomCorners="true" horizontalAlign="center"

      paddingLeft="10" paddingRight="20" paddingBottom="10" paddingTop="35" resizeEffect="Resize" id="chartPanel">



      [Event(name="chartDrawn", type="flash.events.Event")]




      .panelfilled  {

                  border-style: solid;

                  border-thickness: 0;

                  border-skin: ClassReference("border.SimpleGradientBorder");

                  fill-colors: #FFFFFF, #FFFFFF;

                  corner-radius: 20;




      public function makeLogChart(genericChart:CartesianChart,
                  genericLegend:Legend, chart:ChartObject):void {
                  var axisList:ArrayCollection = chart.getAxisList();
                  var renderers:ArrayCollection = new ArrayCollection();
                  var seriesArray:ArrayCollection = new ArrayCollection();
                              var xAxis:AxisObject = axisList.getItemAt(0) as AxisObject;
                  var ar:AxisRenderer = new AxisRenderer();
                              var hAxis:DateTimeAxis = new DateTimeAxis();
      hAxis.labelUnits = xAxis.getAxisUnits().toLowerCase();
      hAxis.labelFunction = fullTimeLabelFunction;
              // more formating of the horizontal axis
          ar.axis = hAxis;
          ar.setStyle("canDropLabels", "true");
          genericChart.horizontalAxisRenderers = [ar];
          genericChart.horizontalAxis = hAxis;
          for (var i:int=1; i<axisList.length; i++) {
          var axis:AxisObject = axisList.getItemAt(i) as AxisObject;
      // Define vertical axis
              var vAxis:LogAxis = new LogAxis();
              vAxis.baseAtZero = false;
                  vAxis.title = axis.title;
          // formatting for charts for different axes
      if (axis.min != axis.max) {
              vAxis.minimum = axis.min;
              vAxis.maximum = axis.max;
      // more formatting of the axis
              var axr:AxisRenderer = new AxisRenderer();
          axr.axis = vAxis;
          // flip left axis
          if (axis.getLocation() == "left") {
          axr.setStyle("verticalAxisTitleAlignment", "vertical");
          axr.setStyle("canDropLabels", "true");
          axr.setStyle("tickPlacement", "none");
          var colRatio:Number = 1.0/axis.getSeriesList().length;
              for (var j:int=0; j<axis.getSeriesList().length; j++) {
              var ser:SeriesObject = axis.getSeriesList().getItemAt(j) as SeriesObject;
              var col:uint = new uint(new Number(ser.getColor()));
              var stroke:Stroke = new Stroke();
              if (axis.getSeriesList().length == 1) axr.setStyle("color", col);
              stroke.color = col;
             var lineSeries:LineSeries = new LineSeries();
              lineSeries.setStyle("showDataEffect", rearrangeData);        
      BindingUtils.bindProperty(lineSeries, "dataProvider", ser, "pointList");
      stroke.weight = 3;
      lineSeries.verticalAxis = vAxis;
      lineSeries.horizontalAxis = hAxis;
              lineSeries.displayName = ser.name;
              lineSeries.setStyle("lineStroke", stroke);
          genericChart.series = seriesArray.toArray().reverse();
          genericChart.verticalAxisRenderers = renderers.toArray();
                  genericChart.percentHeight = 100;
         genericLegend.dataProvider = genericChart;
      genericLegend.direction = "horizontal";
         chartPanel.horizontalScrollPolicy = "off";
        • 1. Re: chart label length clipping problem
          babo_ya Level 3

          I think it is because of the vertical axis label.


          what about adding a custom vertical axis label function?


          You are doing it for the horizontal axis as below.. do the same thing and make sure the length doesn't go pass like... 5 or 6 charaters.

          hAxis.labelFunction = fullTimeLabelFunction;


          hope this helps,



          • 2. Re: chart label length clipping problem

                 I'm wondering what the AxisObject class  in your code is. Is it a custom class coz I couldnt find it anywhere in Flex API.

            • 3. Re: chart label length clipping problem
              Cr99 Level 1

              Yes, it's a custom object.  It has a Java counterpart as well.  Here is the shell of the object (with accessor methods ommitted):


              package factory.data {


              import mx.collections.ArrayCollection;




                  public class AxisObject {


              public var title:String;

              public var ID:String;

              public var min:Number=0;

              public var max:Number=0;

              public var autoScale:Boolean;

              public var location:String;

              public var seriesList:ArrayCollection;

              public var axisType:String = "Numeric";

              public var axisUnits:String="Day";

              public var categoryType:String="N";