何时在Flex中渲染Legend

时间:2022-11-23 05:26:13

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.

我的Flex图表具有从每个数据系列创建图例的代码。目前,我在点击按钮时执行drawLegend功能。

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.

我试图让图例自动绘制,但我无法确定何时调用drawLegend函数。用户单击“更新”按钮以检索数据。我希望在此之后创建图例,而无需用户点击其他按钮。

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

我把drawLegend函数放在几个地方(ResultHandler,afterEffectEnd(用于图表动画等),没有任何作用。

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.

下面是我用来创建图例的代码。请注意,即使代码处理每个系列,我注意到如果过早调用Fill颜色为null。

private function drawLegend(event:Event):void {
clearLegend();

// 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.            
    numRows = Math.floor(chart.series.length / rowSize);                
} else {
    // One extra row is needed if there is a remainder.
    numRows = Math.floor(chart.series.length / rowSize) + 1;
}

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

    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();
                gr.addChild(gi);

                var li:LegendItem = new LegendItem();

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

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

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

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

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

                    // Add the LegendItem to the GridItem.
                    gi.addChild(li);
                }
            }
        // Increment any time a LegendItem is added.
        z++;
    }
}                                       

}

1 个解决方案

#1


0  

Well, I couldn't quite figure out what event to trap so I used the following in the chart's parent container:

好吧,我无法弄清楚要捕获的事件,所以我在图表的父容器中使用了以下内容:

chart.addEventListener(ChartItemEvent.ITEM_ROLL_OVER,drawLegend);

Seems to work ok.

似乎工作正常。

#1


0  

Well, I couldn't quite figure out what event to trap so I used the following in the chart's parent container:

好吧,我无法弄清楚要捕获的事件,所以我在图表的父容器中使用了以下内容:

chart.addEventListener(ChartItemEvent.ITEM_ROLL_OVER,drawLegend);

Seems to work ok.

似乎工作正常。