Mashup Builder > スタイルテーマ > ウィジェットへの状態フォーマットの適用 > 例: グラフへの状態フォーマットの適用
例: グラフへの状態フォーマットの適用
概要
折れ線グラフウィジェット、棒グラフウィジェット、ウォーターフォール図ウィジェットなどの Mashup Builder の複数のチャートに状態のフォーマットを適用できます。デフォルトでは、NumberOfSeries プロパティが「自動」に設定されている場合、状態のフォーマットはチャートのすべてのデータ系列に適用されます。チャートのデータ系列ごとに異なる状態のフォーマットの規則を定義するには、ウィジェットの NumberOfSeries プロパティを特定の数値に設定してから、ウィジェットの SeriesStyleN プロパティを使用して各系列の状態のフォーマットの規則を設定します。
折れ線グラフ
折れ線グラフウィジェットに状態定義を適用できます。以下の例では、特定の数値のデータポイントを目立たせるために状態フォーマットを使用しています。以下の図は、状態フォーマットが適用される前のランタイムでのグラフを示しています。
このグラフには、バインドされたインフォテーブルのすべてのデータが表示されています。各列が別個の系列として表示されています。PTC Convergence Theme のデフォルト値を使用して各系列に色が適用されています。この例では、特定のデータ系列のデータパターンを目立たせるためにグラフを修正します。
必要に応じて、状態フォーマットを適用する前にグラフを調整します。この例では、ビジュアリゼーションの一部として追加のデータ系列は必要はありません。
表示されるデータ系列の数を制限するため、NumberOfSeries プロパティを 1 に設定します。DataField1 プロパティが追加されます。
DataField1 プロパティで、グラフに表示するデータを含むインフォテーブル列を選択します。
コンテキストをわかりやすくするため、Label プロパティを更新してグラフのヘッダーを修正します。その結果、凡例領域は不要になりました。HideLegends プロパティを有効にすることで、これを非表示にできます。以下の図は、変更が適用されたランタイムでのグラフを示しています。
グラフを調整した後、Composer でスタイル定義を作成するか既存のスタイル定義を選択できます。下の図は、以下のように定義されている状態を含む状態定義を示しています。
< 12 - 12 より小さい値は赤色のスタイルで表示されます。
< 20 - 20 より小さい値は黄色のスタイルで表示されます。
デフォルト - その他の 20 以上の値は緑色のスタイルで表示されます。
スタイル定義エンティティを作成した後、グラフに表示されている系列の SeriesStyleN プロパティの横にある「状態のフォーマット」ボタンをクリックします。
* 
NumberOfSeries プロパティが Auto に設定されている場合、状態定義はすべてのデータ系列に適用されます。
1. Mashup Builder で、キャンバス上のグラフを選択します。
2. 「プロパティ」パネルで、SeriesStyle プロパティの横にある「状態のフォーマット」をクリックして、状態フォーマットのダイアログボックスを開きます。
3. 「状態ベースのスタイル定義」を選択してから、状態定義エンティティを選択します。
バインドされているインフォテーブルから、状態条件を評価するときに使用するデータが含まれている依存フィールドを選択することもできます。
4. 「完了」をクリックしてダイアログボックスを閉じ、マッシュアップを表示します。
ランタイムで、グラフデータが表示され、各ポイントは状態定義エンティティ内で定義されている状態に従って色分けされます。以下の図は、状態フォーマットが適用された折れ線グラフを示しています。
データポイントの色を目立たせるために線やその他のグラフ要素をカスタマイズできます。接続線に灰色を使用することで、データポイントをよりはっきりと目立たせることができます。
棒グラフ
以下の図は、縦棒グラフとして設定されている棒グラフを示しています。線グラフと同様に、状態フォーマットがウィジェットに適用されています。定義されている状態は以下のとおりです。
1200 より大きい数値は赤色の縦棒で表示されます。
その他の値は灰色で表示されます。
ランタイムで、値が定義されている縦棒がデータ系列内の値に従ってスタイル設定されます。状態フォーマットはすべての縦棒のデフォルトのスタイルテーマカラーをオーバーライドすることに注意してください。
これは役に立ちましたか?