1

Flex チャートの DataTips は、文書化が不十分で、ほとんど理解されていない機能です。

次の 3 つの部分があります。

  • DataTip、デフォルトではテキストが入ったボックス
  • DataTipTarget、デフォルトではシリーズのポイント上のブルズアイ円
  • Callout、dataTipTarget から DataTip ボックスまでの行

これら 3 つの要素はどのように作成/描画され、どのようにカスタマイズできますか?


DataTipTargets と Callout 行のレンダリングを適切にカスタマイズする方法についての私の回答も参照してください。

4

1 に答える 1

4

クラスのdataTipRendererスタイルがデフォルトで.ChartBaseDataTip

DataTipであるIDataRendererため、レンダラーとして機能できます。ただし、メソッドDataTip.updateDisplayList(w,h)はデータ ポイントに円を描画しません。内部に HTML 対応のテキストを含む四角形を描画します。

では、とらえどころのないブルズアイを描くのは何でしょうか?


今、私はいくつかの掘り下げ、いくつかの非常に深い掘り下げを行い、答えを見つけました. 他の人のためにここにそれらを文書化します。

私の SDK のバージョンは4.1.0です。

ホバー時に円のデータ ポイントをレンダリングするコード (デフォルト) は、私たちが考えていたようなレンダラーではありませんが、実際にはmx.charts.chartClasses.ChartBaseクラス内の関数です (3873 行目)。

/**
 *  Defines the locations of DataTip objects on the chart.
 *  This method ensures that DataTip objects do not overlap each other
 *  (if multiple DataTip objects are visible) or overlap their target data items.
 *  
 *  @langversion 3.0
 *  @playerversion Flash 9
 *  @playerversion AIR 1.1
 *  @productversion Flex 3
 */
protected function positionDataTips():void

positionAllDataTips()同じクラスに同様の機能があります。

には単純なブール スタイルがありChartBaseshowDataTipTargetsfalse に設定すると、ホバリング時に線上の円の描画が無効になります。

datatip ターゲットは のpositionDataTips()関数内でレンダリングされますChartBase(4204 行目から)。

showDataTipTargetsそれがこれに関連していることがわかったら、別の質問に答えることができました。そこでは、カスタマイズ方法の詳細な説明を見つけることができますDataTipTarget

ブール値のChartBaseプロパティ はshowDataTips、datatip BOXES のみのレンダリングを切り替えます。それらは style を使用してレンダリングされdataTipRenderer、 datatip ボックスのテキストは property を使用して作成されますdataTipFunction


要約すると、グラフの DataTips は次のように理解できます。

  • ChartBase.getStyle("showDataTipTargets"):Booleanポイントにカーソルを合わせるとレンダリングされるデフォルトの円の可視性を切り替えます。
    • DataTip ターゲットのレンダリングを実際に変更するには、ChartBase.positionDataTips()関数での描画方法をオーバーライド/変更する必要があります
  • DataTip ボックスは個別に処理されます
    • ChartBase.showDataTips:Booleanチャート全体の DataTips と DataTipTargets の表示を切り替えます
    • ChartBase.getStyle("dataTipRenderer"):ClassDataTip ボックスのグラフィカル レンダリングのみを処理します。
    • dataTipRenderer、 によって返された文字列を使用しChartBase.dataTipFunction:Functionてデータを表示します。
    • 従うべき規則は次のとおりです。
      • カスタムdataTipRendererは、DataTip のグラフィックス/描画を処理する必要があります
      • カスタムdataTipFunctionは、特定のポイントのデータのテキストの書式設定を処理する必要があります
  • DataTipTarget から DataTip ボックスに描画されるオプションの線である吹き出し線は、設定によって有効化およびカスタマイズできますChartBase.getStyle(“dataTipCalloutStroke”):IStroke
于 2012-02-14T13:26:09.303 に答える