13 Replies Latest reply on Feb 27, 2009 11:45 AM by ShawnDL

    Graph suggestions wanted

    vikceo Level 1
      I have some data which is say quantity for 7 days. this quantity value on 1st day is 1541 and 2nd day say 1543 , 3rd day say 1541 and so for 7 days just varies by 1 or 2 units.

      I created a line graph to depict. But as the quantity varies to a small value every day so the graph does not look interesting at all. It looks like a straight line (at least to human eyes). So, any suggestions to draw a graph which looks interesting showing this small variation a bit prominent.

      Just to add further i choose this line series graph coz i had three such quantities. Say product A quantity, product B quantiy and product C quantity. Product A quantiy starts at 1541 and varies +/- 1 to 2 every day and similarly product B's start at 645, product C's start at 115 with same degree of variation.

      In all graph looks just 3 straight lines.. how to make a bit interesting grpah with such type of data?
        • 1. Re: Graph suggestions wanted
          IanCWatkins
          Best bet is to let your Y-axis autoscale to allow the data to be more pronouced. I assume your current graph shows a y-axis from 0 to YourMaxValue ?

          If so, change the properties for your verticalAxis to include the property:

          baseAtZero="false"

          That should make it more interesting for you.

          Cheers

          Ian
          • 2. Re: Graph suggestions wanted
            vikceo Level 1

            so here is the code.. i could not find a place to add ur suggested parameter...


            <mx:LineChart id="HeadCountChart1Week" height="100%" width="100%"
            paddingLeft="5" paddingRight="5"
            showDataTips="true" >


            <mx:horizontalAxis>
            <mx:CategoryAxis categoryField="date"/>
            </mx:horizontalAxis>
            <mx:series>
            <mx:LineSeries yField="IND" form="curve" displayName="IND"/>
            <mx:LineSeries yField="OTHER" form="curve" displayName="OTHER" />
            </mx:series>
            </mx:LineChart>

            <mx:Legend dataProvider="{Quantity1Week}"/>
            • 3. Re: Graph suggestions wanted
              IanCWatkins Level 1
              Hi Vikceo,

              Try the following:

              <mx:LineChart id="HeadCountChart1Week" height="100%" width="100%" paddingLeft="5" paddingRight="5" showDataTips="true" >

              <mx:verticalAxis>
              <mx:LinearAxis baseAtZero="false" />
              </mx:verticalAxis>

              <mx:horizontalAxis>
              <mx:CategoryAxis categoryField="date"/>
              </mx:horizontalAxis>

              <mx:series>
              <mx:LineSeries yField="IND" form="curve" displayName="IND"/>
              <mx:LineSeries yField="OTHER" form="curve" displayName="OTHER" />
              </mx:series>
              </mx:LineChart>

              <mx:Legend dataProvider="{Quantity1Week}"/>

              The three lines added should do the trick.

              Cheers

              Ian


              • 4. Re: Graph suggestions wanted
                vikceo Level 1
                Thanks this works... so the real problem now is:

                say i have a radio group showing two radio buttons IND and OTHER.
                By default it is at IND.

                I just want to show one of the two lineSeries based on the radio selected.

                I tried setting .visible property of lineSeries to false or true accordingly. It works and show/hide the desired line series.

                But the problem is the graph range does not change on changing radio. Any idea how to adjust the vertical axis as well?
                • 5. Re: Graph suggestions wanted
                  IanCWatkins Level 1
                  Glad I could help.

                  Your next problem is that setting visible=false only makes it invisible. It is still there, on the parent graph,and it's dimensions are still being used to calculate the graph axis.

                  When the user deselects that line series, it is better to actually remove the lineseries. And of course, when they click the button again, to add the line series back again.

                  Cheers

                  Ian

                  • 6. Re: Graph suggestions wanted
                    vikceo Level 1
                    yes agreed.. but how to add or remove line series at run time? i know the place to write code but what code should be written?
                    • 7. Re: Graph suggestions wanted
                      IanCWatkins Level 1
                      Ahh, right. If you are going to toggle lineseries on and off, quickest way is to set the dataprovider for that line series to null.

                      I haven't seen your dataprovider, so I'm using my own. I hope this gives you some ideas. Paste into new project to see it working:

                      -------------------------

                      <?xml version="1.0" encoding="utf-8"?>
                      <mx:Application xmlns:mx=" http://www.adobe.com/2006/mxml" layout="absolute">

                      <mx:ArrayCollection id="series1">
                      <mx:Object>1525</mx:Object>
                      <mx:Object>1521</mx:Object>
                      <mx:Object>1522</mx:Object>
                      <mx:Object>1523</mx:Object>
                      <mx:Object>1521</mx:Object>
                      <mx:Object>1528</mx:Object>
                      </mx:ArrayCollection>

                      <mx:ArrayCollection id="series2">
                      <mx:Object>1522</mx:Object>
                      <mx:Object>1523</mx:Object>
                      <mx:Object>1522</mx:Object>
                      <mx:Object>1523</mx:Object>
                      <mx:Object>1522</mx:Object>
                      <mx:Object>1523</mx:Object>
                      </mx:ArrayCollection>

                      <mx:Button x="10" y="10" label="Remove Series 1" click="s1.dataProvider = null"/>
                      <mx:Button x="10" y="40" label="Add Series 1" width="121" click="s1.dataProvider = series1" />

                      <mx:LineChart x="154" y="10" id="linechart1" width="679" height="460">
                      <mx:verticalAxis>
                      <mx:LinearAxis baseAtZero="false" />
                      </mx:verticalAxis>

                      <mx:series>
                      <mx:LineSeries id="s1" displayName="Series 1" yField="" dataProvider="{series1}" />
                      <mx:LineSeries id="s2" displayName="Series 2" yField="" dataProvider="{series2}" />
                      </mx:series>
                      </mx:LineChart>
                      </mx:Application>
                      • 8. Re: Graph suggestions wanted
                        vikceo Level 1
                        you did not saw dataProvider because I am dynamically setting this property once i get the response from my httpservice.

                        Now the problem in your suggested approach is I have a single dataProvider for the entire chart. my xml is generated in the format:

                        <stat>
                        <date>...</date>
                        <IND>1500</IND>
                        <OTHER>2300</OTHER>
                        </stat>

                        and this repeats say 7 times once per date.
                        • 9. Re: Graph suggestions wanted
                          IanCWatkins Level 1
                          Understood.

                          But basically you are adding data to the graph, one series at a time even if you apply a dataProvider to the chart rather than individual series.

                          Therefore, you can remove that series from the graph whenever you like by setting all the data to that series to null.

                          And add it back again, either by adding all the values for that series back again, or applying all the data back again.

                          Without seeing the full code, it is really difficult to help.


                          • 10. Re: Graph suggestions wanted
                            vikceo Level 1
                            Thanks a lot IanCWatkins... so your last reply cleared everything.. i just applied dataprovider property to independent series like u suggested and it worked.
                            • 11. Re: Graph suggestions wanted
                              vikceo Level 1
                              So, now the next issue I see is it does everything as desired but i dont want to see the fractions on y axis. I just want to see whole numbers.. How to achieve that?
                              • 12. Re: Graph suggestions wanted
                                IanCWatkins Level 1
                                Change your vertical (y) axis as follows:

                                <mx:verticalAxis>
                                <mx:LinearAxis baseAtZero="false" interval="1" />
                                </mx:verticalAxis>

                                the interval=1, forces the Y-axis to stick to whole numbers. If you change interval=0.5, it'll give intervals on 0.5, and so on.

                                Cheers

                                Ian
                                • 13. Re: Graph suggestions wanted
                                  ShawnDL
                                  Hi,
                                  If you set the provider to null, I've found that line still shows up in the chart's legend (if you have a legend turned on). How would you suggest working around that? Manually creating a legend? Programatically deleting the line series? Unfortunately, I don't know how to do either of those.
                                  -Shawn