Oracle APEX 19.2にて新たに提供が開始されたファセット検索のページに、チャートを追加する方法をオラクルの開発者のCarsten Czarskiさんがブログで解説しています。自分でも試してみました。以下、その手順です。オリジナルの英語の内容はこちらです。
まず、EMP表のサンプルを用意します。SQLワークショップのユーティリティのサンプル・データセットを開きます。EMP/DEPT のアクションインストールをクリックします。
データセットの言語に英語を選びます。日本語を選ぶこともできます。
次へ進みます。
データセットがロードされます。アプリケーションの作成を実行します。
アプリケーション作成ウィザードが起動します。アプリケーションの名前はDemonstration - EMP / DEPTです。
今回の作業で使用するのはページ名がEmployeesのフォーム付きのファセット検索(emp)のページです。
機能はすべて使用しないため、すべてをチェックをクリックして、チェックをすべて外します。また、言語の選択を日本語に変更します。
以上で、アプリケーションの作成を実行します。
アプリケーションが作成されます。
ページ・デザイナにてファセット検索のページである3 - Employeesを開きます。
レポートEmployeesの詳細の静的IDとしてFC_EMPを設定します。
元の英語の記事に記載されているパイプライン表関数get_faceted_search_dataを作成します。
以下のコードを実行します。
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
* オラクルの公式ブログに記載されているコード。 | |
* Add a Chart to your Faceted Search Page, Carsten Czarski | |
* https://blogs.oracle.com/apex/post/add-a-chart-to-your-faceted-search-page | |
*/ | |
create or replace type t_emp_row as object( | |
ename varchar2(50), | |
job varchar2(50), | |
mgr varchar2(50), | |
hiredate date, | |
sal number, | |
comm number, | |
-- the DEPTNO column is an LOV column. Thus we treat it as VARCHAR2 | |
deptno varchar2(50) ); | |
/ | |
create or replace type t_emp_table as table of t_emp_row | |
/ | |
create or replace function get_faceted_search_data( | |
p_page_id in number, | |
p_region_static_id in varchar2 ) | |
return t_emp_table pipelined | |
is | |
l_region_id number; | |
l_context apex_exec.t_context; | |
type t_col_index is table of pls_integer index by varchar2(255); | |
l_col_index t_col_index; | |
--------------------------------------------------------------------------- | |
procedure get_column_indexes( p_columns wwv_flow_t_varchar2 ) is | |
begin | |
for i in 1 .. p_columns.count loop | |
l_col_index( p_columns( i ) ) := apex_exec.get_column_position( | |
p_context => l_context, | |
p_column_name => p_columns( i ) ); | |
end loop; | |
end get_column_indexes; | |
begin | |
-- 1. get the region ID of the Faceted Search region | |
select region_id | |
into l_region_id | |
from apex_application_page_regions | |
where application_id = v('APP_ID') | |
and page_id = p_page_id | |
and static_id = p_region_static_id; | |
-- 2. Get a cursor (apex_exec.t_context) for the current region data | |
l_context := apex_region.open_query_context( | |
p_page_id => p_page_id, | |
p_region_id => l_region_id ); | |
get_column_indexes( wwv_flow_t_varchar2( 'ENAME', 'JOB', 'MGR', 'HIREDATE', 'SAL', 'COMM', 'DEPTNO' ) ); | |
while apex_exec.next_row( p_context => l_context ) loop | |
pipe row( t_emp_row( | |
apex_exec.get_varchar2( p_context => l_context, p_column_idx => l_col_index( 'ENAME' ) ), | |
apex_exec.get_varchar2( p_context => l_context, p_column_idx => l_col_index( 'JOB' ) ), | |
apex_exec.get_varchar2( p_context => l_context, p_column_idx => l_col_index( 'MGR' ) ), | |
apex_exec.get_date ( p_context => l_context, p_column_idx => l_col_index( 'HIREDATE' ) ), | |
apex_exec.get_number ( p_context => l_context, p_column_idx => l_col_index( 'SAL' ) ), | |
apex_exec.get_number ( p_context => l_context, p_column_idx => l_col_index( 'COMM' ) ), | |
apex_exec.get_varchar2( p_context => l_context, p_column_idx => l_col_index( 'DEPTNO' ) ) ) ); | |
end loop; | |
apex_exec.close( l_context ); | |
return; | |
exception | |
when no_data_needed then | |
apex_exec.close( l_context ); | |
return; | |
when others then | |
apex_exec.close( l_context ); | |
raise; | |
end get_faceted_search_data; | |
/ |
ファセット検索のページにチャート・リージョンを作成します。
識別のタイトルはChart、タイプにチャートを選択します。
デフォルトで作成されたシリーズを選択します。
識別の名前はSalary by Employee、ソースのタイプはSQL問合せとし、SQL問合せとして以下を記述します。先ほど作成したパイプライン表関数get_faceted_search_dataを呼び出し、レポートEmployeesのデータを取り出しています。
select ename, sal from table(get_faceted_search_data(:APP_PAGE_ID, 'FC_EMP'));
列のマッピングのラベルにENAME、値にSALを割り当てます。
ファセットの変更でチャートがリフレッシュされるように、動的アクションを作成します。
ファセット検索のリージョン検索の上でコンテキスト・メニューを表示させ、動的アクションの作成を実行します。
作成された動的アクションの識別の名前はファセット変更、タイミングのイベントはファセット変更[ファセット検索]、選択タイプはリージョン、リージョンは検索を指定します。
TRUEアクションの識別の名前はChartのリフレッシュとします。アクションにリフレッシュを選択し、影響を受ける要素として選択タイプはリージョン、リージョンにChartを指定します。
P3_SEARCH,P3_DEPTNO,P3_MGR,P3_JOB,P3_SAL
参照したCarstenのブログの内容は、このあとレポート・リージョンを非表示にして、ファセットとチャートだけを表示するようにしていますが、その部分は割愛します。
以上で作業は完了です。アプリケーションを実行すると記事の先頭のGIF動画のように動きます。
今回作成したアプリケーションのエクスポートを以下に置きました。
https://github.com/ujnak/apexapps/blob/master/exports/faceted-search-with-chart.zip
Oracle APEXのアプリケーション作成の参考になれば幸いです。
完