1

Adobe Flex 折れ線グラフ内に、水平方向に DateTime 軸、垂直方向に線形軸を持つグラフがあります。デカルト データ キャンバスを背景要素として使用し、ほとんどが四角形の背景グラフィックのカスタム セットを描画したいと考えています。複数のデータ ポイントがある場合、グラフはグラフ全体の幅に広がるはずなので、グラフィックは完璧に機能します。

ただし、データ ポイントが 1 つしかない場合は、四角形を描画できないようです。長方形をグラフの幅全体に広げたいので、軸から x 座標を取得できると考えていましたが、これは機能しません。

var canvasWidth:Number = chtCanvas.width;
var canvasHeight:Number = chtCanvas.height; 
var minPt:Array;
var maxPt:Array;
var minPtDate:Date;
var maxPtDate:Date;
var minPtComplete:Point;
var maxPtComplete:Point;

// This works fine when there is more than 1 data point
minPt = chtCanvas.localToData(new Point(0, 0));
maxPt = chtCanvas.localToData(new Point(canvasWidth,canvasHeight));

//This does return a date object, but wont draw below 
minPtDate = axisDate.minimum;
maxPtDate = axisDate.maximum;

//This returns NaN for the x
minPtComplete = chtCanvas.dataToLocal(minPtDate, axisSalary.minimum);
maxPtComplete = chtCanvas.dataToLocal(maxPtDate, axisSalary.maximum);

// Also tried this.  Also returns NaN for the x value
//minPtComplete = chtCanvas.dataToLocal(axisDate.minimum, axisSalary.minumum);
//maxPtComplete = chtCanvas.dataToLocal(axisDate.maximum, axisSalary.maximum);

私の実際の描画方法は次のとおりです。

// Tried this, works with points >2, does not draw with single data point
chtCanvas.drawRect(minPt[0], detail[i].MaxValue, maxPt[0], detail[i].MinValue);

//tried this, no effect with single point
//chtCanvas.drawRect(minPtDate, detail[i].MaxValue, maxPtDate, detail[i].MinValue);

// Tried this, no effect with single point
//chtCanvas.drawRect(minPtDate, minPt[1], maxPtDate, detail[i].MinValue);

// Tried this also
//chtCanvas.drawRect(minPtComplete.x, detail[i].MaxValue, maxPtComplete.x, detail[i].MinValue);

この例では、detail は給与値の配列コレクションであり、Im は配列内のデータ値を使用して長方形の垂直方向の境界を決定します。

グラフの幅全体に四角形を描画する必要があります (データ ポイントが 1 つしかない場合でも)。ありがとう

4

1 に答える 1

1

助けてくれたHeikkiに感謝します。次のコードは、軸の値を使用してデカルトデータキャンバスに描画するために機能します。

chtCanvas.drawRect(axisDate.minimum as Date, axisSalary.maximum, axisDate.maximum as Date, axisSalary.minimum);

値を日付としてキャストすると、非常に役立ちました。上記で使用した残りのコードは不要です。

注意すべき点の1つは、DateFormatterを使用してデータから日付値をフォーマットしていたことです。私が考慮しなかったのは、DateTimeAxisを使用すると、Flexが軸に表示する追加の日付を自動的に追加するということでした。私の場合、カスタム解析関数を使用してMYポイントを作成していましたが、Flexが作成し、解析関数に渡したポイントを考慮していませんでした（したがって、それらは正しく解析されませんでした）。これを修正すると、複数のデータポイントの場合に値が正しくレイアウトされました。単一のデータポイントでまだ少し問題があり、チャートを完全に埋めていませんが、現在は描画中です。

更新：生命の兆候はありますが、dataUnitsとlabelUnitsの組み合わせによっては、最小値と最大値がチャートの幅全体を描画していない場合があります。

更新＃2：解決済みわかりました。軸はデカルトデータキャンバスの最小値/最大値として機能しますが、覚えておくべき重要なことがあります。Adobe Flex ASDocチュートリアルにあったようなカスタムのDateTimeAxis解析関数を使用する場合、単一のポイント（およびおそらく複数のポイントでも、違いを視覚的に確認できませんでした）の場合：

private function axisDateParseFunction(item:String):Date
{   
     var inputDate:String = item;
     inputDate = fmtDate.format(inputDate);

     var newDate:Date = new Date();
     if(inputDate)
     {
        var a:Array = inputDate.split('/');
        newDate.fullYear = a[2];
        newDate.month = a[0] - 1;
        newDate.date = a[1];
        newDate.hours = 0;
        newDate.hoursUTC = 0;
        newDate.minutes = 0;
        newDate.minutesUTC = 0;
        newDate.seconds = 0;
        newDate.secondsUTC = 0;
        newDate.milliseconds = 0;
        newDate.millisecondsUTC = 0;

     }
     return newDate;

}

上記のようにUTC値を設定することも忘れないでください。DateTimeAxisは日付と時刻を使用するため、新しいDateオブジェクトを作成すると、それらの時刻値もローカルシステム時刻に設定されます。これらの値もゼロに設定することを忘れないでください。そうしないと、軸ラベルと正確に一致しないポイントが取得されます。

于 2011-01-10T17:09:33.370 に答える