第5部：グラフの追加

Oracle JDeveloperのIDEを操作して、グラフ・データのビュー・オブジェクトを作成し、関係を設定するビュー・リンクを定義して、ページにグラフ・コ ンポーネントを追加します。

ビュー・オブジェクトの作成：Create View Objectウィザードを使用して、グラフ・データのビュー・オブジェクトを作成します。

アプリケーション・モジュールへのビュー・オブジェクトの追加：Create View Linkウィザードを使用して、関係を設定するビュー・リンクを定義し、アプリケーション・モジュールにビュー・オブジェクトを追加します。

ページへのグラフの追加：Data Controlsパネルを使用して、 ADF Advanced Graphコンポーネントをページに追加します。

 

ビュー・オブジェクトの作成

tell me more iconビュー・オブジェク トの作成

グラフのデータを提供するには、SQL問合せによって移入される新しいビュー・オブジェクトを最初に作成します。 この場合、問合せは特定の製品に関する各倉庫の在庫量を返します。

[ 詳細はこちら]
  1. アプリケーション・ナビゲータで「 Model 」プロジェクトを選択 し、Create View Objectウィザードを起動します（「 File」→「 New」→「 Business Tier」→「 ADF Business Components」→「 View Object」）。
  2. ビュー・オブジェクトの名前として WarehouseStockLevelsViewと入力します。
  3. 「 Read-only access through SQL query 」 を選択して、「 Next 」をクリックします。
  4. ステップ2のSQL Statementで、特定の倉庫ID（倉庫ID、倉庫名、製品ID、在庫量）を前提として、これらの列を返すSQL文を入力します。例を以下に示しま す。 
                                 
SELECT
                              
    

Warehouses.Warehouse_id,
                              
    

Warehouses.Warehouse_Name,
                              
    

 WarehouseStockLevels.Product_Id,
                              
    

 WarehouseStockLevels.Quantity_On_Hand
                              
    

 FROM
                              
    

 WAREHOUSES Warehouses,
                              
    

 Warehouse_Stock_Levels WarehouseStockLevels
                              
    

 WHERE
                              
    

 Warehouses.warehouse_id = WarehouseStockLevels.warehouse_id
  5. ステップ6のAttribute Settingsになるまで、デフォルトを受け入れて「 Next 」 をクリックします。
  6. WarehouseID属性に「 Key attribute 」オプションを選択し、ページのグラフ・バインディング用にあとでこれを使用するようにします。 「 Finish 」をクリックします。

    tell me more iconIDE内

    ウィザードの完了時に、アプリケーション・ナビゲータは次のように表示されます。 [ 詳細はこちら]

 

アプリケーション・モジュールへのビュー・オブジェクトの追加

tell me more iconアプリケーション・ モジュールへのビュー・オブジェクトの追加

ビュー・リンクは、各ビュー・オブジェクトの属性を組み合わせて、2つのビュー・オブジェクトを相互に接続します。 グラフのデータを提供する WarehouseStockLevelsビュー・オブジェクトとOrder Items表のデータを提供する OrderItemsビュー・オブジェクトのビュー・リンクを 作成します。 ビュー・リンクの目的は、Order Items表で選択された製品に基づいて、グラフ・データを自動的に変更することです。 [ 詳細はこちら]

  1. アプリケーション・ナビゲータで「 oracle.fod.model 」 ノードを選択し、Create View Linkウィザードを起動します（「 File」→「 New」→「 Business Tier」→「 ADF Business Components」→「 View Link」）。
  2. ビュー・リンクの名前として OrderItems_WarehouseStockLevels_ViewLinkと 入力します。 「 Next 」をクリックします。
  3. ステップ2で、 Select Source Attribute ペ インの「 OrderItemsView 」を開いて、「 ProductId 」を選択します。 Select Destination Attribute ペインで、「 WarehouseStockLevelsView 」 を開いて、「 ProductId 」を選択します。
  4. 「 Add 」をクリックして、2つの属性間のリンクを定義します。
  5. 「 Next 」をクリックし、デフォルトを受け入れて ウィザードを移動します。 「 Finish 」をクリックします。
  6. アプリケーション・ナビゲータで「 FodModule 」を右クリッ クし、「 Open FodModule 」を選択して、概要エディタの Application Module定義を開きます。

    tell me more iconアプリケーション・ モジュールへのビュー・リンクの追加

    ビュー・リンクをページで使用可能にするには、アプリケーション・モジュールに追加する必要があります。 概要エディタのData Modelページでアプリケーション・モジュールを編集できます。 [ 詳細はこちら]

  7. 「 Data Model 」タブを選択します。
  8. Available View Objectsペインで「 OrderItemsView 」を開き、「 WarehouseStockLevelsView via OrderItems_WarehouseStockLevels_ViewLink 」を選択します。 Data Modelペインで「 OrdersView1 」 を開き、「 OrderItemsView2 via OrderItemsOrdersFkLink1 」 を選択します。
  9. 「 」 Add instanceをクリックし、 ビュー・リンクを通じてビュー・オブジェクトを追加します。

    tell me more iconIDE内

    WarehouseStockLevelsビュー・オブジェクトがビュー・リン クを通じてアプリケーション・モジュール・データ・モデルに追加されると、概要エディタのData Modelパネルで次の階層を確認できます。 [ 詳細はこちら]

 

ページへのグラフの追加

tell me more iconページへのグラフの 追加

グラフは、Oracle JDeveloperで使用できるデータ可視化コンポーネントの1つです。 グラフ以外のデータ可視化コンポーネントには、ゲージ、ガント・チャート、地理マップ、ピボット・テーブルがあります。 [ 詳細はこちら]

  1. エディタ・ウィンドウで、「 browseOrders.jspx 」 タブをクリックして、ページを前面に表示します。
  2. Data Controlsパネルで、「 OrdersView1 」 →「 OrderItemsView2 」ノードを開きます。 「 WarehouseStockLevelsView1 」ノードを選択し、ページの OrderItemsディテール表の下にドロップします。
  3. Createコンテキスト・メニューから「 Graphs 」 「 Advanced Graph 」 を選択します。
  4. Create Graph Bindingダイアログで、「 Include Child Accessors 」の選択を解除して、「 Yes 」をク リックして確定します。
  5. Data Pointsで、 Typed Attributesオプションが選択されていることを確認します。 このボタンの下の「 」 Addをクリックします。
  6. Numeric Valueが Usageド ロップダウン・リストで選択されていることを確認します。 Data Attributeド ロップダウンから「 QuantityOnHand 」を選択します。 Labelフィールドに Quantityと入力します。
  7. Group Byセクションの「 」 Addをクリックします。
  8. Group Attributeドロップダウン・リストから「 WarehouseId 」を選択します。 Group Label Attributeドロップダウンから「 WarehouseName 」 を選択します。 「 OK 」をクリックします。

    tell me more iconグラフのタグとスタ イル

    参照ページの最下部で、挿入された Advanced Graphコンポーネント は、最初は次のように表示されます。 [ 詳細はこちら]

  9. Structureウィンドウで、「 af:table 」コンポーネ ントを選択します。 プロパティ・インスペクタで、 Idプロパティに orderItemsTableと 入力します。
  10. Structureウィンドウで、「 dvt:graph 」コンポー ネントを選択します。 プロパティ・インスペクタのBehaviorページで、 PartialTriggersプ ロパティに orderItemsTable（表のID）を入力します。 AppearanceページのStyleセクションで、 stylePathドロップダウン・リ ストから「 Comet 」を選択します。
  11. 「 save」 Save allを クリックして作業内容を保存します。
  12. タスク・フロー・ダイアグラムで「 browseOrders 」ペー ジ・アイコンを右クリックし、「 Run 」を選択します。

    tell me more iconIDE内

    参照ページで、変更された Advanced Graphコンポーネントは次のよ うに表示されます。 [ 詳細はこちら]

 

cue cards icon次 のステップ

 

Copyright © 1997, 2008, Oracle. All rights reserved.