ヘッダーをスキップ
Oracle Fusion Middleware Oracle Application Development Framework Webユーザー・インタフェース開発者ガイド
11gリリース1(11.1.1)
B52029-02
  目次
目次
索引
索引

戻る
戻る
 
次へ
次へ
 

23 ADFデータ視覚化コンポーネントの概要

この章では、インタラクティブなADF Facesコンポーネントの表現力が高いセットであるADFデータ視覚化コンポーネントの一般的な特性とフォーカスについて説明します。この部の他の章では、各コンポーネントの作成およびカスタマイズ方法について説明します。

この章に含まれる項は次のとおりです。

23.1 ADFデータ視覚化コンポーネント概要

ADFデータ視覚化コンポーネントには、データの表示および分析を行うための非常にグラフィカルな表形式の機能が用意されています。このコンポーネントでは、次の機能が提供されます。

23.2 ADFデータ視覚化コンポーネントの定義

ADFデータ視覚化コンポーネントには、グラフ、ゲージ、ピボット・テーブル、地理マップ、ガント・チャートおよび階層ビューアがあります。

23.2.1 グラフ

グラフ・コンポーネントには、棒グラフ、円グラフ、折れ線グラフ、散布図、株価チャートなど、50種類以上のグラフを作成する機能が用意されています。このコンポーネントでは、複数軸の複数データ・ポイントを様々な方法で評価できます。たとえば、一群のグラフにより、あるグループからの結果と他のグループからの結果の比較が容易になります。

グラフ・コンポーネントでは次の種類のグラフを作成できます。

  • 面グラフ: データが塗りつぶされた領域で表されるグラフを作成します。面グラフを使用して、過去12か月の売上げなど、ある期間の傾向を示します。面グラフでは、1つの軸上に最低2グループのデータが必要です。軸には、月などの時間の経過を表すラベルが付けられることがよくあります。

  • 棒グラフ: データが一連の縦棒として表されるグラフを作成します。ある期間の傾向の確認や、複数の地域での異なる製品区分の売上げなど、同一時点での項目の比較に使用します。

  • 棒(横)グラフ: Y軸に沿って棒を横向きに表示するグラフを作成します。傾向の表示や値の比較に使用できる向きを持たせるために使用します。

  • バブル・グラフ: データが円形のデータ・マーカー(バブル)の位置とサイズで表されるグラフを作成します。3種類の値の相関関係を示す場合(データ項目が多数で全体の関係を表示する場合は特に)に使用します。たとえば、バブル・グラフを使用して、従業員の給与(X軸)、経験年数(Y軸)と生産性(バブルのサイズ)をプロットします。このようなグラフでは、生産性を給与および経験と比較して調べることができます。

  • 組合せグラフ: 異なる種類のデータ・マーカー(棒、線または面)を使用して異なる種類のデータ項目を表すグラフを作成します。棒と線、棒と面、線と面あるいは3つすべての組合せの比較に使用します。

  • ファンネル・グラフ: プロセスのステップに関連するデータを視覚的に表すグラフを作成します。ステップは、横向きの円柱に対する縦向きのスライスとして表されます。特定のステップ(スライス)の実際の値がそのスライスの割当てに近づいた分、スライスが塗りつぶされます。通常、ファンネル・グラフには、時間などのステージ値に対する実績値と目標値が必要です。たとえば、このコンポーネントを使用して、プロセス(販売ルートなど)がステージ(会計年度の四半期)の目標に達するかどうかを確認します。

  • 折れ線グラフ: データが線、一連のデータ・ポイントまたは線で結ばれたデータ・ポイントとして表されるグラフを作成します。折れ線グラフには、グループ内のメンバーごとに最低2つのポイントを表すデータが必要です。たとえば、月ごとの折れ線グラフには最低2か月必要です。通常、特定の色の線は、アメリカ、ヨーロッパ、アジアなどのデータの各グループに関連付けられています。同一期間の項目の比較に使用します。

  • パレート・グラフ: データが棒と棒の累積割合を示すパーセンテージ線で表されるグラフを作成します。各棒は、交通事故の原因など、異なる不具合の原因を表します。棒は、発生件数の多いものから少ないものの順に並べられます。パレート・グラフは常に二重Yグラフで、1つ目のY軸は棒が表す値に対応し、2つ目のY軸は0%から100%を表し、累積割合の値に対応します。パレート・グラフを使用して、不具合の原因を特定し、比較します。

  • 円グラフ: 1つのグループのデータが円のセクションとして表され、円が切り分けられたパイのように見えるグラフを作成します。各製品ラインからの収益など、全体に対する各部分の関係の表示に使用します。

  • レーダー・グラフ: 円状の折れ線グラフとして表されるグラフを作成します。過去3年間の月ごとの売上げなどの周期的に起こるパターンを表す場合に使用します。

  • 散布図/極グラフ: データが、データ・マーカーの位置によって表されるグラフを作成します。散布図を使用して、上位製品の売上げとコストなど、異なる2種類のデータの相関関係を表す場合に使用します。散布図は、多数の項目間の全体的な関連性を示す場合に特に有用です。

  • 株価チャート: データが株の高値、安値および終値を示すグラフを作成します。各株価マーカーで3つの異なる値を表示します。

JDeveloperのコンポーネント・ギャラリには使用可能なグラフのカテゴリ、タイプおよび説明が表示され、グラフの設計およびクイック・レイアウトの定義が視覚的にサポートされます。図23-1に、グラフのコンポーネント・ギャラリを示します。

図23-1 グラフのコンポーネント・ギャラリ

グラフのコンポーネント・ギャラリ

すべてのグラフで、Flash、SVGおよびPNGレンダリングがサポートされます。グラフ・コンポーネントでは、ズームとスクロールの使用、時間軸の特定の部分を強調表示する調節可能な時間セレクタ・ウィンドウの使用、データ・ポイントの表示をフィルタして強調およびフェードする線および凡例の使用、動的参照線と領域の使用などの初期表示およびデータの変更に対する相互作用がサポートされます。

図23-2にアプリケーション・ダッシュボードを示します。表示内容は次のとおりです。

  • 棒グラフ。

  • スライスの切離しを使用した円グラフ。

図23-2 棒グラフおよび円グラフが表示されているダッシュボード

棒グラフおよび円グラフが表示されているダッシュボード

図23-3にアプリケーション・ダッシュボードを示します。表示内容は時計回りに左上から次のとおりです。

  • 時間セレクタ・ウィンドウを持つ平滑線グラフ

  • 3D効果とスライスの切離しを使用した円グラフ

  • 3D効果を使用した棒グラフ

図23-3 折れ線グラフ、円グラフおよび棒グラフが表示されているダッシュボード

折れ線グラフ、円グラフおよび棒グラフが表示されているダッシュボード

23.2.2 ゲージ

ゲージ・コンポーネントでは、データのグラフィカル表現をレンダリングします。グラフとは異なり、ゲージでは1つのデータ・ポイントにフォーカスして、そのポイントを最小、最大およびしきい値インジケータと比較して調べ、問題のある領域を特定します。

1つのゲージ・コンポーネントでは、使用されるデータに応じて、1つのゲージまたはゲージ・セットを作成できます。

このコンポーネントでは次の種類のゲージを作成できます。

  • ダイアル・ゲージ: 180度の弧に沿ってメトリック値を示すゲージを作成します。このタイプのゲージには、通常、ゲージがプロットしている値を指す、線または矢印の形のインジケータがあります。

  • ステータス・メーター・ゲージ: 横長の矩形のバーに沿ってタスクの進度または測定値のレベルを示すゲージを作成します。内側の矩形は、外側の矩形に表示された範囲に対する現在の測定値のレベルを示します。

  • ステータス・メーター・ゲージ(垂直): 縦長の矩形のバーに沿ってタスクの進度または測定値のレベルを示すゲージを作成します。

  • LED(電光表示)ゲージ: 重要業績評価指標(KPI)などの測定値をグラフィカルに表すゲージを作成します。LEDゲージには、よい(上矢印)、普通(左または右矢印)、悪い(下矢印)を示す矢印など、数種のグラフィクスが使用できます。

ゲージのしきい値はいくつでも指定できます。ただし、一部のLEDゲージ(矢印または三角形のインジケータを持つもの)では、サポートされるしきい値の数にかぎりがあります。これは、指し示す方向として有効なものの数が限られているためです。矢印または三角形のインジケータの場合、しきい値の最大数は3です。

JDeveloperのコンポーネント・ギャラリには使用可能なゲージのカテゴリ、タイプおよび説明が表示され、ゲージの設計およびクイック・レイアウトの定義が視覚的にサポートされます。図23-4に、ゲージのコンポーネント・ギャラリを示します。

図23-4 ゲージのコンポーネント・ギャラリ

ゲージのコンポーネント・ギャラリ

すべてのゲージ・コンポーネントでFlash、SVGおよびPNGレンダリングを使用できます。

図23-5に、倉庫の在庫レベルを表示する、しきい値付きダイアル・ゲージのセットを示します。

図23-5 しきい値付きダイアル・ゲージ・セット

しきい値付きダイアル・ゲージ・セット

図23-6に、しきい値付きステータス・メーター・ゲージのセットを示します。

図23-6 しきい値付きステータス・メーター・ゲージ・セット

しきい値付きステータス・メーター・ゲージ・セット

23.2.3 ピボット・テーブル

ピボット・テーブルでは、行または列での複数層のデータ・ラベルをサポートするグリッドを作成します。行セットなどの適切なデータ・コントロールにバインドされている場合、このコンポーネントでは、グリッド・データの小計と合計を生成するオプションも用意されています。

ピボット・テーブルでは、あるエッジ(行または列)から別のエッジにデータ・ラベルを切り替え、データの表示を変えることができます。たとえば、ピボット・テーブルで行に地域内の製品を、列に年を初めは表示しているとします。地域を列に切り替えると、列で地域内に年が表示され、表のデータ・セルには地域内の製品の合計が年ごとに表示されます。

ピボット・テーブルでは、横方向と縦方向のスクロール、ヘッダーとセルの書式設定およびドラッグ・アンド・ドロップ・ピボットがサポートされています。ピボット・テーブルでは、実行時の行の昇順および降順のグループ・ソートもサポートされます。図23-7に、ピボット・テーブルを示します。

図23-7 ピボット・テーブル

ピボット・テーブル

23.2.4 地理マップ

地理マップでは、ADFフレームワークにOracle Spatialの機能が提供されます。このコンポーネントでは、ビジネス・データをマップ上に表し、1つのマップ上に複数層の情報を重ね合せることができます。このコンポーネントでは、色テーマ、グラフ・テーマ(棒または円グラフ)および点テーマの同時表示がサポートされます。各タイプのテーマはいくつでも作成でき、マップ・ツールバーを使用して、実行時にテーマを選択できます。

地理マップの例として、各州での製品の人気を色の濃さで示す色テーマ、倉庫の在庫レベルを示す円グラフ・テーマおよび各倉庫の正確な位置を示す点テーマを使用した、アメリカの基準となるマップを考えてみます。アメリカのマップに3つテーマをすべて重ねると、特定の場所で製品の人気を維持するのに十分な在庫があるかどうかを容易に評価できます。図23-8に、色テーマ、円グラフ・テーマおよび点テーマを使用した地理マップを示します。

図23-8 色テーマ、円グラフ・テーマおよび点テーマを使用した地理マップ

製品の地理マップ

23.2.5 ガント・チャート

ガント・チャートは(横軸を時間とする)横棒グラフの一種で、リソースまたはタスクが、開始と終了が明確なタイム・フレームに示され、プロジェクトの計画や進捗管理に使用されます。

ガント・チャートは、2つのADFのツリー表とスプリッタの組合せで構成されます。左側の表にはタスクまたはリソースのリストが含まれ、右側の表は1つの列で構成され、特定期間の進捗がグラフ表示されます。

3種類のガント・コンポーネントがあります。

  • プロジェクト・ガント: タスクを縦に示し、横向きの予定表に各タスクの期間を棒で示すガント・チャートを作成します。

  • リソース使用率ガント: リソースが割当てを上回っているか下回っているかをグラフィカルに示すガント・チャートを作成します。リソースを縦に示し、横方向の時間軸にその割当てとキャパシティ(オプション)を示します。

  • スケジュール・ガント: リソース管理を示し、手動のスケジュール表をベースにしたガント・チャートを作成します。リソースを縦方向に、対応するアクティビティを横方向の時間軸に表示します。

図23-9 に、スタッフ・リソースとスケジュールを表示したプロジェクト・ガントを示します。

図23-9 プロジェクト・ガント

スタッフ割当てのプロジェクト・ガント

23.2.6 階層ビューア

階層ビューアは、階層データが図中のリンクされたノードのセットとして表示されるコンポーネントです。ノードおよびリンクは、データの要素および関係に対応します。このコンポーネントでは、パンおよびズーム操作、ノードの展開および縮小、そしてノード内での簡単なADF Facesコンポーネントのレンダリングがサポートされています。階層ビューアの一般的な用途は、図23-10に示すような組織図を表示することです。

図23-10 階層ビューアによる組織図

階層ビューアによる組織図

JDeveloperのコンポーネント・ギャラリには使用可能な階層ビューアのタイプおよび説明が表示され、コンポーネントの設計およびクイック・レイアウトの定義が視覚的にサポートされます。図23-11に、階層ビューアのコンポーネント・ギャラリを示します。

図23-11 階層ビューアのコンポーネント・ギャラリ

階層ビューアのコンポーネント・ギャラリ

23.3 ADFデータ視覚化コンポーネントへのデータの指定

すべてのデータ視覚化コンポーネントは、ADFデータ・コントロールの行セット・データ・コレクションにバインドできます。これらのコンポーネントのデータ・コントロールへのデータ・バインディングの詳細と例は、『Oracle Fusion Middleware Oracle Application Development Framework Fusion開発者ガイド』のデータバインドされたADFデータ視覚化コンポーネントの作成に関する項を参照してください。

グラフとゲージにはtabularDataメソッドがあり、マネージドBeanに格納されたメソッドからCSV(カンマ区切りの値)データを提供できます。

ガント・チャート・コンポーネントでは基本的なツリー・データ・コントロールの使用がサポートされ、タスクとリソースだけでなく、サブタスクとサブリソースにもデータを提供できます。

23.4 Flashイメージ用カスタム・フォントのダウンロード

グラフおよびゲージ・コンポーネントでは、Flashイメージ・タイプを使用してテキストの回転、忠実度の高い表示およびフォントの埋込みを行えます。Flashエンジンは、チャートのXML定義を使用したグラフまたはゲージの表示に使用される、コンパイル済のActionScriptコードを含む事前作成のShockwave Flash(SWF)ファイルです。Flashエンジンはダウンロードして、クライアント・ブラウザに組み込まれているFlash Playerで実行時にインスタンス化します。

埋込みフォントは、表示および印刷に使用されます。クライアントにインストールされず、編集できません。メモリー内でFlash Playerによって使用され、プレーヤの終了時に消去されます。埋込みフォントでは、フォントSWFファイルをダウンロードするためにサーバーとの間のラウンドトリップが必要になりますが、すべてのクライアントで同じ外観が得られ、テキストの回転がサポートされ、ゆがみまたはアンチエイリアス処理が最小限になります。

Oracleには、必要に応じてFlashイメージ内で使用するためにAlbany WTフォントが用意されています。このフォントには太字やイタリックなどプレーンテキスト以外のバリエーションはありません。Albany WTフォントは、デバイス・フォントを使用したFlashではサポートできない特定のアニメーションをサポートするために使用されます。ただし、これはアプリケーションでそのかわりに使用する独自の埋込みフォントが指定および提供されない場合です。

特定のフォントと各SWFファイルは、Flashエンジンに渡される埋込みフォントとしてアプリケーションに追加できます。リストに指定されたフォントがグラフまたはゲージの定義内のテキストまたはラベルで必要になるときまでに、エンジンによってそのフォントが遅延ロードされます。例23-1では、太字とイタリックを組み合せたGeorgiaフォントを定義します。

例23-1 SWFファイル

package
{
  import.flash.display.Sprite;
  import.flash.text.Font;
public class fGeorgiaBoldItalic extends Srite
        (
  [Embed (source="c:\\WINDOWS\\Fonts\\GEORGIABI.TTF",
    fontName="Georgia Bold Italic",
    fontWeight="Bold",
    fontStyle="Italic".
    mimType="application/x-font-truetype")]
  private statis car font1:Class;
  public function fGeorgiaBoldItalic() {
    Font registerFont(font1);
}
  }
}

グラフおよびゲージのフォント属性は次のように設定できます。