0

横軸にLineChartaを使用して作業していますが、各カテゴリに非常にカスタム形式の表示が必要です。CategoryAxisLabelオブジェクトのテキストフィールドのカスタムフォーマットしか許可されていないため、使用CategoryAxis.LabelFunctionは私の目的には十分強力ではありません。特にこのプロジェクトでは、各カテゴリを2つの異なる複数行ラベルのグリッドまたはHGroupにする必要があります。左のラベルは左揃え、右のラベルは右揃えにする必要があります。

extends Groupとのカスタムクラスを作成してみましたimplements IDataRenderer。ただし、public function set data(value:Object)で定義されてIDataRendererいる、は常にオブジェクトとしての値で呼び出されているように見えAxisLabelます。オブジェクトはオブジェクトを渡さず、文字列(AxisLabel.text)のみを渡します。


ハックの代替手段として、LabelFunctionを使用してエンコードされた文字列を渡そうとしましたが、それでも問題が発生します。どういうわけか、このコードは、CategoryAxisに何も表示されません。

public class HeatmapAxisLabelRenderer 
extends HGroup
implements IDataRenderer
{
public function HeatmapAxisLabelRenderer()
{
    super();

    this.includeInLayout = true;
    this.visible = true;

    this.width = 100;
    this.height = 40;
//      this.percentWidth = 100;
//      this.percentHeight = 100;
}


// Internal variable for the property value.
private var _data:Object;

// Make the data property bindable.
[Bindable("dataChange")]

// Define the getter method.
public function get data():Object {
    return _data;
}

// Define the setter method, and dispatch an event when the property
// changes to support data binding.
public function set data(value:Object):void {
    _data = value;

    if (value is AxisLabel && AxisLabel(value).text!=null) {
        var parts:Array = AxisLabel(value).text.split("|~|");
        if (parts.length != 2) return;

        var name:Label = new Label();
        name.text = parts[0];
        name.setStyle("textAlign","left");
        name.width = 100;

        var limit:Label = new Label();
        limit.text = parts[1];
        limit.setStyle("textAlign","right");
        limit.width = 100;

        this.addElement(name);
        this.addElement(limit);

        dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
    } else {
        trace("renderer bad value");
    }
}
4

1 に答える 1

1

Group問題はとの間の奇妙な相互作用であるように思われAxisRenderer、レンダラー(an HGroup)が明示的な幅/高さの値(コンストラクターで設定)を持っているという事実:

カスタムレンダラーでを設定した後data、AxisRenderer`はカスタムレンダラーにそのサイズを無効にするように指示します。

そうしている間、それは明示的な幅/高さを持っているので、Group正しく何もしないことを決定します。

これを機能させるためにいくつかの変更を加えました。

  • コンストラクターで幅のみを設定します
  • 子ラベルに幅を設定しないでください(これを使用して再生する可能性があります)
  • ラベルオブジェクトをメンバー変数にし、子の作成で1回だけ作成します(データのセッターは頻繁に呼び出される可能性があります)

コード:

package
{
    import mx.charts.AxisLabel;
    import mx.core.IDataRenderer;
    import mx.events.FlexEvent;

    import spark.components.HGroup;
    import spark.components.Label;

    public class HeatmapAxisLabelRenderer extends HGroup implements IDataRenderer
    {
        public function HeatmapAxisLabelRenderer()
        {
            super();
            this.width=100;
        }

        private var _data:Object;

        [Bindable("dataChange")]
        public function get data():Object {
                return _data;
        }

        private var nameLabel:Label;
        private var limit:Label;

        override protected function createChildren():void
        {
            super.createChildren();
            if (!nameLabel)
            {
                nameLabel=new Label();
                nameLabel.setStyle("textAlign","left");
                limit = new Label();
                limit.setStyle("textAlign", "right");
                addElement(nameLabel);
                addElement(limit);
            }
        }

        public function set data(value:Object):void
        {
            if (_data === value)
                return;

            _data = value;
            if (value is AxisLabel && AxisLabel(value).text!=null)
            {
                var parts:Array = AxisLabel(value).text.split("|~|");
                if (parts.length == 2)
                {
                    nameLabel.text = parts[0];
                    limit.text = parts[1];
                }
            }
            else
            {
                trace("renderer bad value");
            }
            dispatchEvent(new FlexEvent(FlexEvent.DATA_CHANGE));
        }
    }
}
于 2012-05-30T00:41:33.347 に答える