3 Replies Latest reply on Aug 18, 2011 12:06 AM by aditya206

    LineChart: How to have fixed interval on X-axis

    aditya206

      Hi All,

      I am flex newbie. I am trying to figureout how to have fixed interval (say 7) of X-axis in a LineChart. I have tried AxisRenderer, CategoryAxis and DateAxis to no avail. Can you refer to an example or a snippet which would help to resolve this problem.I have pasted my code here below. Thanks in advance.

       

      <mx:LineChart

       

      id="DOLoginGraph" dataProvider="{doLoginGraphData}" paddingTop="10" width="100%" height="100%"

      showDataTips="

      true" backgroundElements="{gridLinesDOL}" >

       

      <!-- vertical Value axis -->

       

      <mx:verticalAxis>

       

      <mx:LinearAxis baseAtZero="true" maximum="40" interval="10" />

       

      </mx:verticalAxis>

       

      <!-- Horizontal Date axis -->

       

      <mx:horizontalAxis>

       

      <mx:CategoryAxis id="horiDateAxis" categoryField="date" />

       

      </mx:horizontalAxis>

       

      <mx:horizontalAxisRenderers>

       

      <mx:AxisRenderer placement="bottom" axis="{horiDateAxis}"/>

       

      </mx:horizontalAxisRenderers>

       

      <!-- Series -->

       

      <mx:series>

       

      <mx:LineSeries yField="value"  showDataEffect="{chartEffect}" form="curve" displayName="Open" >

       

      <mx:lineStroke>

       

      <mx:SolidColorStroke color="#32cd32" weight="2" alpha=".8"/>

       

      </mx:lineStroke>

       

      </mx:LineSeries>

       

      </mx:series>

       

      </mx:LineChart>

        • 1. Re: LineChart: How to have fixed interval on X-axis
          Karl_Sigiscar_1971 Level 3

          LinearAxis:

           

              //----------------------------------
              //  interval
              //----------------------------------

           

              /**
               *  @private
               */
              private var _userInterval:Number;

           

              [Inspectable(category="General")]

           

              /**
               *  Specifies the numeric difference between label values along the axis.
               *  Flex calculates the interval if this property
               *  is set to <code>NaN</code>. 
               *  The default value is <code>NaN</code>.
               * 
               *  @langversion 3.0
               *  @playerversion Flash 9
               *  @playerversion AIR 1.1
               *  @productversion Flex 3
               */
              public function get interval():Number
              {
                  return computedInterval;
              }
             
              /**
               *  @private
               */
              public function set interval(value:Number):void
              {
                  if (value <= 0)
                      value = NaN;
                     
                  _userInterval = value;

           

                  computedInterval = value;
                  invalidateCache();

           

                  dispatchEvent(new Event("axisChange"));
              }

          • 2. Re: LineChart: How to have fixed interval on X-axis
            aditya206 Level 1

            Hi Karl,

                     Thank you so much for the help. I am using CategoryAxis with date as X-axis input values. Does this code still stands valid with my requirement?

             

                 <mx:horizontalAxis>

                      <mx:CategoryAxis id="horiDateAxis" categoryField="date" />

                 </mx:horizontalAxis>

                 <mx:horizontalAxisRenderers>

                      <mx:AxisRenderer placement="bottom" axis=""/>

                 </mx:horizontalAxisRenderers>

             

             

            Thanks in advance again.

            Aditya206

            • 3. Re: LineChart: How to have fixed interval on X-axis
              aditya206 Level 1

              Hi,

                   I tried the above example with numerical values on X-axis and seems to work fine, but my requirement has Date on this axis. when I am using the interval attribute on this LinearAxis tag, it seems  vary with the input chart data. How can I have a fixed number of intervals independent of input chart data?

               

              Thanks in advance.

               

              Aditya206