1 Reply Latest reply on Nov 12, 2009 3:31 PM by ice1000

    When to Render Legend in Chart?

    ice1000 Level 1

      My Flex chart has code that creates a legend from each data series. Currently, I have the drawLegend function execute when a button is clicked.


      I am trying to get the legend to draw automatically but I am having trouble determining when to call the drawLegend function. Users click on an 'Update' button which retrieves data. I want the legend to get created after this, without the users having to click on another button.


      I have put my drawLegend function in several places (ResultHandler, afterEffectEnd(for chart animation, etc.) and nothing works.


      Sometime after the series has been added to the chart and after the series animation ends, the legend can be added.

      How can I trap this point in time and call my function?


      Any ideas?


      Below is the code I used to create the legend. Note that even though the code processes each series, I noticed that the Fill color is null if it is called too early.


      private function drawLegend(event:Event):void {

      // Use a counter for the series.
      var z:int = 0;

      var numRows:int;
      if (chart.series.length % rowSize == 0) {
      // The number of series is exactly divisible by the rowSize.                   
      = Math.floor(chart.series.length / rowSize);                           
      } else {
      // One extra row is needed if there is a remainder.
      = Math.floor(chart.series.length / rowSize) + 1;

      for (var j:int = 0; j < numRows; j++) {
      var gr:GridRow = new GridRow();

      for (var k:int = 0; k < rowSize; k++) {
      // As long as the series counter is less than the number of series...

      //skip columnset group
      if (chart.series[z] is LineSeries || chart.series[z] is ColumnSeries){
      if (z < chart.series.length) {
      var gi:GridItem = new GridItem();

      var li:LegendItem = new LegendItem();

      // Apply the current series' displayName to the LegendItem's label.
      .label = chart.series[z].displayName;

      // Get the current series' fill.
      var sc:SolidColor = new SolidColor();
      .color = chart.series[z].items[0].fill.color;

      // Apply the current series' fill to the corresponding LegendItem.
      .setStyle("fill", sc.color);//was just sc

      // Apply other styles to make the LegendItems look uniform.
      .setStyle("textIndent", 5);
      .setStyle("labelPlacement", "left");
      .setStyle("fontSize", 9);

      .setStyle("backgroundAlpha", "1");
      .setStyle("backgroundColor", sc.color);
      //gi.width = 80;

      // Add the LegendItem to the GridItem.
      // Increment any time a LegendItem is added.