Charts コントロールを使用する方法

多くの場合、視覚的に情報を表示する必要があります。グラフは情報を表示するための最適な形式の 1 つです。
グリッドアイテムに対応する数値情報を、円またはタイムライン (Date 項目属性がある場合) のグラフとして表示できます:

2 つの例を示します: 円グラフとタイムライングラフです。

例

例 1

このコントロールを使用して、構造化データタイプまたは項目属性から情報を取得できます。ここでは、情報ソースとして項目属性を使用します。
次の Work With パターンを適用した Transaction オブジェクト (「Work With パターンの適用」を参照) をこの例に使用します:

Country
{
     CountryId            Id
     CountryName          Name
     CountryPopulation    Numeric(9.0)
}

Work With の List ノードで以下のプロパティを設定します:

次に、このコントロールを機能させるためにプロパティを設定します。上の画像のプロパティを参照してください:

プロパティ	説明
Control Type	Charts。グリッドをグラフとして表示します。
Title	デバイスに表示されるグラフの名前です。
Type	表示するグラフのタイプ (Pie または Timeline) です。この例では Pie を使用します。
Show in Percentage	値を実数またはパーセンテージで表示する場合にこのプロパティを設定します。
Value Attribute	グラフに使用する項目属性です。この例では、CountryPopulation の値を使用します。
Category Attribute	チャートの各スライスへの参照を示すために使用する項目属性です。
Comments Attribute	選択した部分の情報の右側に表示される項目属性です。

注:

[ Value Attribute ] プロパティを設定しない場合、コントロールは Value Attribute として、既定で最初の数値タイプの項目属性を適用します。この例では、設定しないと Value Attribute は Country ID になってしまうため、このプロパティを設定する必要があります。
次の画像のように Value Attribute がグリッド上に配置されていることを確認してください。

以上です。
WorkWithDevicesCountry は、円グラフに南アメリカ大陸の人口が国別にパーセンテージで表示されます。スライドをタップすると、次に示すように、Category Attribute の値が表示されます:

例 2

項目属性から情報を取得するタイムライングラフの使用例について説明します。
この例では、次の Transaction オブジェクトを使用します。

Expenses
{
      ExpensesId*          Id
      ExpensesDate         Date
      ExpensesCar          Numeric(8.0)
      ExpensesHome         Numeric(8.0)
      ExpensesFood         Numeric(8.0)
}

Work With の List ノードで以下のプロパティを設定します:

Time Attribute	このプロパティはタイムライングラフでのみ使用できます。空白にすると、GeneXus は "Time Attribute" として、最初の Date ドメインの項目属性を設定します。
Series Attribute Collection	このプロパティを設定しない場合、既定の動作は例 1 と同様に、リストの最初の数値タイプの項目属性を使用します。この例では、住宅費、食費、自動車経費を追跡して表示するので、これら 3 つの項目属性をこのプロパティに入力します。そのためには、項目属性と同じ名前をコンマで区切って入力します。
Series Label Collection	このプロパティを空白にした場合、ラベルは項目属性の名前で表示されます。この例では、 [ Serial Attribute Collection ] プロパティに入力した項目属性と同じ順序でこれらのラベルを記述する必要があります (ラベルおよび項目属性は位置によって関連付けられている)。

注: 上の図に示すように、Time Aattribute と Series Attribute Collection として設定した項目属性がグリッド上になければなりません。

これで完了です。このグラフは、異なるカテゴリで分類された経費の変化を表示します。

動画

Container of sections in the Detail screen of the Work With