0

データ ポイントを LineSeries の新しい位置にドラッグする必要があります。ユーザーがマウス ポインターを使用してデータ ポイントをドラッグするときに、動的に実行する必要があります。

次のようなオプションを試しました: 以下に示すように、flex の LineChart コントロールで dragMoveEnabled="true" dragEnabled="true" dropEnabled="true" 。

<mx:LineChart id="linechart1" selectionMode="multiple" showAllDataTips="true" showDataTipTargets="true" dragMoveEnabled="true" dragEnabled="true" dropEnabled="true">

しかし、うまくいきません。

誰でもこれを達成する方法を教えてもらえますか?

ありがとうございました...

4

1 に答える 1

1

この問題を解決する標準の Flex API はないと思います。データ ポイントとのユーザー インタラクションを制御することにより、別の方法でそれを行うことができます。

これが私の解決策と実際の例です。

ユーザーは任意のデータ ポイントを取得して上下にドラッグできます。新しい位置は、任意のシリーズの localToDate メソッドを使用してマウス座標を変換することで計算できます。

重要な点は、チャートの位置とプロットの実際の開始点との間の距離を考慮することです。この目的のために、定数 CHART_GUTTERTOP を使用します。

コード：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
           xmlns:s="library://ns.adobe.com/flex/spark" 
           xmlns:mx="library://ns.adobe.com/flex/mx" 
           minWidth="955" minHeight="600">
<fx:Script>
    <![CDATA[
        import mx.charts.events.ChartItemEvent;
        import mx.charts.series.items.LineSeriesItem;
        import mx.collections.ArrayCollection;

        [Bindable]public var expenses:ArrayCollection = new ArrayCollection([
            {Month:"Jan", Profit:2000, Expenses:1500, Amount:450},
            {Month:"Feb", Profit:1000, Expenses:200, Amount:600},
            {Month:"Mar", Profit:2200, Expenses:800, Amount:300},
            {Month:"Apr", Profit:1800, Expenses:400, Amount:400}
        ]);

        private var currentId:int = -1;
        private var currentYField:String;
        private const CHART_GUTTERTOP:int = 20;

        protected function myChart_itemMouseDownHandler(event:ChartItemEvent):void
        {
            if (event.hitData != null)
            {
                var chartItem:LineSeriesItem = event.hitData.chartItem as LineSeriesItem;
                currentId = chartItem.index;
                currentYField = (chartItem.element as LineSeries).yField;
            }
        }

        protected function myChart_itemMouseUpHandler(event:ChartItemEvent):void
        {
            if (currentId != -1)
            {
                var p:Point = new Point(myChart.mouseX, myChart.mouseY  - CHART_GUTTERTOP);
                var d:Array = series1.localToData(p);

                expenses.getItemAt(currentId)[currentYField] = d[1];
                myChart.dataProvider = expenses;
                currentId = -1;
            }
        }
    ]]>
</fx:Script>

<s:Panel x="20" y="20">
    <s:VGroup>
        <mx:LineChart 
            id="myChart" 
            gutterTop="{CHART_GUTTERTOP}"
            dataProvider="{expenses}" 
            showDataTips="true"
            itemMouseDown="myChart_itemMouseDownHandler(event)" 
            itemMouseUp="myChart_itemMouseUpHandler(event)">

            <mx:horizontalAxis>
                <mx:CategoryAxis 
                    dataProvider="{expenses}" 
                    categoryField="Month"/>
            </mx:horizontalAxis>

            <mx:series>
                <mx:LineSeries id="series1" 
                    yField="Profit" 
                    displayName="Profit"/>
                <mx:LineSeries 
                    yField="Expenses" 
                    displayName="Expenses"/>
            </mx:series>
        </mx:LineChart>

        <mx:Legend dataProvider="{myChart}"/>
    </s:VGroup>
</s:Panel>
</s:Application>
于 2013-04-12T22:12:32.047 に答える