5.20201.680
wijmo.angular.chart Class WjFlexChart Wijmo API クラス

WjFlexChart クラス

FlexChart コントロール用のAngularJSディレクティブ。

wj-flex-chart ディレクティブは、AngularJSアプリケーションにチャートを追加する場合に使用します。 ディレクティブ名とパラメーター名の書式は、キャメルケースではなくダッシュで結んだ小文字にする必要があります。 次に例を示します。

<p>FlexChart コントロール</p>
<wj-flex-chart
  style="height:300px"
  items-source="data"
  binding-x="country">
  <wj-flex-chart-axis
    wj-property="axisY"
    major-unit="5000">
  </wj-flex-chart-axis>
  <wj-flex-chart-series
    binding="sales"
    name="Sales">
  </wj-flex-chart-series>
  <wj-flex-chart-series
    binding="expenses"
    name="Expenses">
  </wj-flex-chart-series>
  <wj-flex-chart-series
    binding="downloads"
    name="Downloads"
    chart-type="LineSymbols">
  </wj-flex-chart-series>
</wj-flex-chart>

次の例では、 FlexChart コントロールを作成し、コントローラーによって公開された'data'配列にコントロールをバインドします。 チャートには3つの系列オブジェクトがあり、各系列がソース配列に含まれるオブジェクトの1つのプロパティに対応します。 この例の最後の系列では、'chart-type'属性を使用して、 他の系列オブジェクトで使用されているデフォルトのチャートタイプをオーバーライドしています。

Example

wj-flex-chartディレクティブは以下の属性をサポートしています。

binding
@ チャートのYの値を含むプロパティの名前。 これは系列レベルでオーバーライドできます。
binding-x
@ チャートのXの値を含むプロパティの名前。 これは系列レベルでオーバーライドできます。
chart-type
@ T系列オブジェクトのレンダリングに使用するデフォルトのチャートタイプ。 これは系列レベルでオーバーライドできます。 ChartType を参照してください。
control
= このディレクティブによって作成された FlexChart コントロールへの参照。
footer
@ チャートのフッタに表示するテキスト(プレーンテキスト)。
footer-style
= チャートのフッタに適用するスタイル。
header
@ チャートのヘッダに表示するテキスト(プレーンテキスト)。
header-style
= チャートのヘッダに適用するスタイル。
initialized
& このイベントは、バインディングによるコントロールの初期化が完了した後に発生します。
is-initialized
= バインディングがコントロールを属性値で初期化し終えたかどうかを示す値。
interpolate-nulls
@ データにnull値が存在するときにギャップを補間するか、そのままにするかを示す値。
item-formatter
= データポイントの外観をカスタマイズするフォーマッター関数。
items-source
= チャートの作成に使用されるデータを含む配列または ICollectionView オブジェクト。
legend-toggle
@ 凡例項目をクリックしたときに系列の表示/非表示を切り替えるかどうかを示す値。
options
= 特定のチャートタイプにのみ適用するチャートオプション。詳細については、FlexChartoptions を参照してください。
palette
= 各系列の表示に使用されるデフォルト色を含む配列。
plot-margin
= コントロールの端からプロット領域の端までの間隔のピクセル数、またはCSSスタイルのマージン。
rotated
@ X軸が縦、Y軸が横になるように軸を入れ替えるかどうかを示す値。
selection
= 選択されている系列オブジェクト。
selection-mode
@ ユーザーが系列をクリックしたときに何が選択されるかを示す SelectionMode 値。
stacking
@ 系列オブジェクトを積み重ねるか個別にプロットするか、積み重ねる場合はどのように積み重ねるかを示すStacking 値。
symbol-size
@ Scatter、LineSymbols、およびSplineSymbolsチャートでデータポイントのレンダリングに使用されるシンボルのサイズ(ピクセル単位)。 これは系列レベルでオーバーライドできます。
tooltip-content
@ ChartTooltip に表示する内容。
got-focus
& FlexChart.gotFocus イベントハンドラ。
lost-focus
& FlexChart.lostFocus イベントハンドラ。
rendering
& FlexChart.rendering イベントハンドラ。
rendered
& FlexChart.rendered イベントハンドラ。
series-visibility-changed
& FlexChart.seriesVisibilityChanged イベントハンドラ。
selection-changed
& FlexChart.selectionChanged イベントハンドラ。

wj-flex-chartディレクティブには、子ディレクティブとして wijmo.angular.chart.WjFlexChartAxiswijmo.angular.chart.WjFlexChartSerieswijmo.angular.chart.WjFlexChartLegend および wijmo.angular.chart.WjFlexChartDataLabel を含めることができます。

階層

  • WjFlexChartCore
    • WjFlexChart