Oracle Application Expressの機能の最大活用-インタ …...Oracle Application Express 4.0...

Copyright(c) 2011, Oracle. All rights reserved.

Oracle Application Express 4.0 を

使用した、グラフ、ガント・チャート、

マップの構築

Copyright(c) 2011, Oracle. All rights reserved. 2 / 48 -


Oracle Application Express 4.0を使用した、グラフ、ガント・

チャート、マップの構築

目的

このチュートリアルでは、Oracle Application Express 4.0 でグラフ、ガント・チャート、マップを構築する

方法を説明します。

所要時間：約 60分

概要

Oracle Application Express 4.0にはAnyChart 5.1の統合が含まれているため、パフォーマンスが向上

し、レンダリング時間および更新時間が短縮されます。マップとガント・チャートのサポートに加え、このリ

リースには、スクロール機能のサポート、インタラクティブ・ラベル、凡例マーカー、複数データ・マーカー、

コンテンツ・メニューのローカリゼーションが含まれています。

前提条件

このチュートリアルを始める前に次のことを確認してください。

Oracle Database 11g がインストールされていること

Oracle Application Express Release 4.0 がインストールされていること

apexcharts.zipファイルがダウンロードされ、作業ディレクトリに解凍されていること

このチュートリアルを実行するための作業領域とユーザーが作成されていること

簡単なグラフ構築アプリケーションの作成

簡単なグラフを作成するには、以下の手順を実行します。

1 . ブラウザに以下の URLを入力し、Oracle Application Express にログインします。

http://<ホスト名>:8080/apex

2 . Oracle Application Express にログインするには、次の詳細情報を入力して、「ログイン」をクリックします。

ワークスペース： <作業領域名>

http://st-curriculum.oracle.com/obe/db/apex/r40/apexcharts/files/apexcharts.zip


ユーザー名： <ユーザー名>

パスワード： <パスワード>

3 . Oracle Application Expressのホーム・ページで、アプリケーション・ビルダータブの横にある下矢印をクリック

し、「アプリケーション」→「データベース・アプリケーション」を選択します。

4 . 「作成 >」をクリックします。

http://apex.oracle.com/pls/apex/f?p=4000:1500:3932724506486863::NO:RIR:P1500_SHOW:DATABASE


5 . 「データベース」を選択し、「次へ >」をクリックします。

6 . 「最初から」を選択し、「次へ >」をクリックします。

7 . 名前に Charting Application と入力し、「次へ >」をクリックします。


8 . ページ・タイプの選択として空白ページが選択されていることを確認し、ページ名にHomeと入力し、「ページの

追加」をクリックします。

9 . ページ・タイプとして「チャート」を選択し、以下内容を指定し、「ページの追加」をクリックします。

フィールド値

Subordinate to

Page Home (1)

Page Name Sales Report

Chart Type 3D Bar Chart

Chart Title Sales Report

X Axis Title Sales

Y Axis Title Day

問合せ：

select null link,

to_char(o.order_timestamp, 'DY') label,

sum (decode(p.category,'Accessories',oi.quantity * oi.unit_price))

"Accessories",

sum (decode(p.category,'Mens',oi.quantity *

oi.unit_price,0)) "Mens",

sum (decode(p.category,'Womens',oi.quantity *

oi.unit_price,0)) "Womens"

from demo_product_info p, demo_order_items oi, demo_orders o

where oi.product_id = p.product_id

and o.order_id = oi.order_id

and (oi.quantity * oi.unit_price) <> 1999

group by to_char(o.order_timestamp, 'DY'),

to_char(o.order_timestamp, 'D')

order by to_char(o.order_timestamp, 'D')


10 . 「次へ >」をクリックします。

11 . デフォルト値のまま「次へ >」をクリックします。



13 . リストからアプリケーションの日付書式を選択し、「次へ >」をクリックします。


14 . テーマ１が選択されていることを確認し、「次へ >」をクリックします。


15 . 「作成」をクリックし、アプリケーションを作成します。


16 . 「アプリケーションの実行」をクリックします。

17 . ユーザー名とパスワードを入力し、「ログイン」をクリックします。


18 . ホーム・ページが表示されます。「Sales Report」リンクをクリックします。

19 . 初期レポートが表示され、曜日別の売上げ値を確認できます。続いて、次のトピックではグラフを改善しま

す。

開発者ツールバーの「ページの編集 2」リンクをクリックします。


グラフの改善

作成したグラフにいくつかの変更を加えます。以下の手順を実行します。

1 . 「リージョン」→「ボディ(3)」を展開し、「Sales Report」リージョンを右クリックして、「チャートの編集」を選択しま

す。


2 . 以下の変更を加え、「表示設定」サブタブをクリックします。

フィールド値

Top Margin 10

Bottom Margin 10


3 . 以下の変更を加え、「軸の設定」サブタブをクリックします。

フィールド値

Animation Side From Bottom Center

Include on Chart Group By series

Values Rotation 45

4 . X軸のタイトルを Categoryに変更し、「凡例設定」サブタブをクリックします。


5 . 凡例の表示に「右」を選択し、凡例タイトルに Categoryを入力して、「変更の適用」をクリックします。

6 . 「実行」をクリックします。


7 . グラフが大幅に変更されたことに注目してください。

改善前は曜日でグループ分けされ、カテゴリ毎の売上が表示されていましたが、各カテゴリが曜日でグループ

分けされたので、

カテゴリ別に各曜日の売上が分かるようになりました。また、売上の数値が 45度回転していることも確認して

ください。


8 . 図に多くの値がある場合は、スクロールバー機能を有効化できます。開発者ツールバーの「ページの編集

2」リンクをクリックします。


9 . 「Sales Report」リージョンを右クリックし、「チャートの編集」を選択します。


10 . 「表示設定」サブタブを選択します。

11 . スクロールバーを表示に「X軸」を選択し、「変更の適用」をクリックします。


12 . 再度ページを実行します。「ページ 2の実行」アイコンをクリックします。

13 . X軸上にスクロールバーがあることを確認します。スクロールバーを下に動かします。


14 . 下方向へスクロールするとグラフが動くことを確認します。続いて次のトピックでは、リソース・ガント・チャート

を作成できるようにリソース・データを追加します。開発者ツールバーにある「ホーム」リンクを選択します。


リソース情報の追加

リソース・ガント・チャートを作成するためには、関連するリソース情報をロードする必要があります。以

下の手順を実行します。

1 . SQLワークショップの横にある下矢印をクリックし、ユーティリティの下の「データ・ワークショップ」を選択しま

す。


2 . データ・ロードの下の「スプレッドシート・データ」を選択します。

3 . ロード元の下の「ファイルをアップロード(カンマ区切りまたはタブ区切り)」を選択し、「次へ >」をクリックしま

す。


4 . 「参照...」をクリックします。

5 . このチュートリアルで使用するファイルの置かれたディレクトリから「gantt_info.txt」ファイルを選択し、「開く」

をクリックします。「1行目のデータに列名が含まれる」のチェック・ボックスが選択されていることを確認し、

「次へ >」をクリックします。

http://st-curriculum.oracle.com/obe/db/apex/r40/apexcharts/files/gantt_info.txt


6 . 表名に GANTT_INFO と入力し、「次へ >」をクリックします。

7 . 主キーの移入元として「既存の列を使用」、主キーの移入として「生成しない」を選択し、「データのロード」をク

リックします。


8 . GANTT_INFO 表が作成され、データが正しくロードされました。次のトピックでは、このデータを基にしてリ

ソース・ガント・チャートを作成します。「アプリケーション・ビルダー」タブをクリックします。

リソース・ガント・チャートの作成

次に、ロードしたデータを基にしてリソース・ガント・チャートを作成します。以下の手順を実行します。

1 . 「Charting Application」を選択します。


2 . 次に、リソース・ガント・チャートのための新規ページを作成します。「ページの作成 >」をクリックします。

3 . 「チャート」を選択し、「次へ >」をクリックします。


4 . 「Flashチャート」を選択して、「次へ >」をクリックします。


5 . 「ガント」を選択し、「次へ >」をクリックします。

6 . 「リソース・ガント」を選択し、「次へ >」をクリックします。

7 . ページ名とリージョン名の両方にProgress of Tasks Assigned to Employeesと入力し、「次へ >」をクリックしま

す。



9 . チャート・タイトルに Progress of Tasks Assigned to Employees と入力し、バックグラウンド・タイプとして「ソリッ

ド・カラー」を選択します。

次に、バックグラウンド・カラー1の色をカラー・パレットから選択します（または、スクリーンショットで指定され

た色の#99CCFFを使用します）。

カラー・スキームに「Look 1」を選択し、「次へ >」をクリックします。

10 . 以下の SQLを入力して、「次へ >」をクリックします。

select null link,

emp_id,

(select ename from emp where empno = a.emp_id) name,

parent_id parent_id,

START_DATE,

END_DATE

from gantt_info a


11 . 「終了」をクリックし、ページを作成します。

12 . 「ページの実行」をクリックします。


13 . リソース・ガント・チャートが表示されます。各従業員が特定のタスクに取り組む日程を確認できます。

次の項では、地図グラフを作成できるように地図データをロードします。

人口データのロード

地図を作成する前に、データベースに人口データをロードする必要があります。以下の手順を実行しま

す。

1 . SQLワークショップの横にある下矢印をクリックし、ユーティリティの下の「データ・ワークショップ」を選

択します。


2 . データ・ロードの下の「スプレッドシート・データ」を選択します。

3 . ロード元の下の「ファイルをアップロード(カンマ区切りまたはタブ区切り)」を選択し、「次へ >」をクリック

します。

4 . 「参照...」をクリックします。


5 . ファイル・ディレクトリで「population_info.txt」ファイルを選択し、「開く」をクリックします。「次へ >」を

クリックします。

6 . 表名に POPULATION_INFO と入力し、「次へ >」をクリックします。

http://st-curriculum.oracle.com/obe/db/apex/r40/apexcharts/files/population_info.txt


7 . 主キーの移入元として「既存の列を使用」、主キーの移入に「生成しない」を選択し、「データのロード」

を

クリックします。

8 . POPULATION_INFO 表が作成され、データが正しくロードされたことを確認します。

「アプリケーション・ビルダー」タブをクリックします。


地図グラフの作成

これで、以下の手順を実行して、地図グラフを作成できます。

1 . 「Charting Application」を選択します。

2 . 「作成 >」をクリックします。尚、既存のページでも地図グラフ・リージョンを作成できます。


3 . 「マップ」を選択し、「次へ >」をクリックします。


4 . アメリカ合衆国が選択されていることを確認し、「次へ >」をクリックします。

5 . 「Country Maps」を展開し、「States」を選択します。

6 . ページ名とリージョン名の両方に US State Populations と入力し、「次へ >」をクリックします。


7 . 「次へ >」をクリックします。

8 . マップ・タイトルに US State Populations と入力し、「次へ >」をクリックします。

9 . 以下の SQLを入力して、「次へ >」をクリックします。

select null link,

STATE_NAME label,

POPULATION value

from POPULATION_INFO


10 . 「終了」をクリックします。

11 . 「ページの実行」をクリックします。


12 . グラフが表示されます。州の 1つにカーソルを合わせ、州の人口を表示します。

13 . 「+」アイコンをクリックし、地図を拡大します。


14 . 地図が拡大されると、地図上に人口値が表示されることを確認します。また、表示設定を変更することで、地

図の見た目を変更できます。

開発者ツールバーの「ページの編集 4」リンクを選択します。


15 . 「US State Populations」リージョンを右クリックし、「チャートの編集」を選択します。


16 . 「表示設定」サブタブをクリックします。

17 . グリッドの表示に「線なし」、地図投影法に「エケルト第 3図法」を選択し、「変更の適用」をクリックします。


18 . 「ページの実行 4」アイコンをクリックします。

19 . 地図に緯線が表示されていない点など、投影図がわずかに異なっている事を確認します。


まとめ

このチュートリアルで学習した内容は、次のとおりです。

簡単なグラフの作成と変更

リソース・ガント・チャートの作成

マップの作成


日本オラクル株式会社

〒107-0061 東京都港区北青山2-5-8 オラクル青山センター

Copyright © 2010 Oracle Corporation Japan. All Rights Reserved.

無断転載を禁ず

このドキュメントは単に情報として提供され、内容は予告なしに変更される場合があります。このドキュメントに誤

りが無いことの保証や、商品性又は特定目的への適合性の黙示的な保証や条件を含め明示的又は黙示的な保証や条件

は一切無いものとします。日本オラクル株式会社は、このドキュメントについていかなる責任も負いません。また、

このドキュメントによって直接又は間接にいかなる契約上の義務も負うものではありません。このドキュメントを形

式、手段（電子的又は機械的）、目的に関係なく、日本オラクル株式会社の書面による事前の承諾なく、複製又は転載

することはできません。

Oracleと Javaは、Oracle Corporation 及びその子会社、関連会社の米国及びその他の国における登録商標です。文

中の社名、商品名等は各社の商標または登録商標である場合があります。

Date post:	24-Jun-2020
Category:	Documents
Upload:	others
View:	5 times
Download:	0 times

Oracle Application Expressの機能の最大活用-インタ …...Oracle Application Express 4.0...

Documents