Oracle® Application Expressアプリケーション・ビルダー・ユーザーズ・ガイド リリース4.2 for Oracle Database 12c B71338-03 |
|
前 |
次 |
アプリケーション・ビルダーには、FlashチャートおよびHTML5チャートを生成するための組込みウィザードが用意されています。また、SVGおよびHTMLチャートの編集もサポートされています。Oracle Application Expressは、この4つのグラフィカル・チャートのみサポートします。
内容は次のとおりです。
アプリケーション・ビルダーでチャートを定義するには、ウィザードを使用します。ほとんどのチャート・ウィザードでは、チャート・タイプを選択し、次の構文を使用してSQL問合せを指定します。
SELECT link, label, value FROM ...
説明:
link
はURLです。
label
は、バーに表示されるテキストです。
value
は、バー・サイズを定義する数値列です。
次に例を示します。
SELECT null
, last_name, salary
FROM employees
WHERE DEPARTMENT_ID = :P101_DEPARTMENT_ID
ダイアル・チャートを作成するには、ダイアル・チャート・タイプを選択し、次の構文を使用してSQL問合せを指定します。
SELECT value , maximum_value [ ,low_value [ ,high_value] ] FROM ...
説明:
value
は、ダイアルの開始位置です。
maximum_value
は、ダイアルでの推定最高位置です。
low_value
およびhigh_value
は、履歴上の最低値および最高値です。
次に例を示します。
SELECT dbms_random.value(500, 1200), 1300, dbms_random.value(100, 200) FROM DUAL
列チャートおよび行チャートには、1つのSQL問合せで複数シリーズを定義できます。これらのチャート・タイプのシリーズ名は、問合せ内の関連する列別名から導出されます。複数シリーズのチャートを定義するには、次の構文を使用します。
SELECT link, label, series_1_value [, series_2_value [, ...]] FROM ...
レンジ・チャートは、各バーに2つの値が必要です。レンジ・チャートを作成するには、チャートを作成し、次の構文を使用してSQL問合せを提供します。
SELECT link, label, low_value, high_value FROM ...
散布チャートは、各ポイントにx値およびy値が必要です。レンジ・チャートを作成するには、チャートを作成し、次の構文を使用してSQL問合せを提供します。
SELECT link, label, x_value, y_value FROM ...
ローソク足チャートには、各ローソク足に始値、安値、高値および終値が必要です。ローソク足チャートを作成するには、チャートを作成し、次の構文を使用してSQL問合せを指定します。
SELECT link, label, open, low, high, close FROM ...
プロジェクト・ガント・チャートでは、各タスクのタスク名、タスクID、親タスクID、実際の開始日と終了日、および進捗の値が必要になります。計画開始日と計画終了日の2つの値も必要に応じて使用できます。プロジェクト・ガント・チャートを作成するには、Flashチャートを作成し、次の構文を使用してSQL問合せを指定します。
SELECT link, task_name, task_id, parent_task_id, actual_start_date, actual_end_date, progress FROM ...
リソース・ガント・チャートでは、各タスクのリソースID、リソース名、親リソースID、および実際の開始日と終了日の値が必要になります。リソース・ガント・チャートを作成するには、Flashチャートを作成し、次の構文を使用してSQL問合せを指定します。
SELECT link, resource_id, resource_name, resource_parent_id, actual_start_date, actual_end_date FROM ...
Oracle Application ExpressのHTML5チャートのサポートは、AnyChart HTML5 Chart Componentをベースにしています。
内容は次のとおりです。
Oracle Application ExpressのHTML5チャートのサポートは、AnyChart HTML5 Chart Componentをベースにしています。AnyChartはフレキシブルなFlashおよびJavaScript (HTML5)ベースのソリューションで、開発者は動きがありコンパクトでインタラクティブなチャートを作成できます。HTML5チャートはJavaScriptチャート・エンジンを使用し、SVG形式のチャートをレンダリングします。Flashは最新のモバイル・デバイスのほとんどでレンダリングできませんが、現在は新しいHTML5チャート作成ソリューションを利用して、チャートをモバイル・アプリケーションに組み込むことができます。HTML5チャートは、次のモバイル・プラットフォームの一般的なブラウザと互換性があります。
Android: バージョン3.1、3.2、4.0、4.0.3および4.1
iOs (iPhone、iPad、iPod Touch): Safari 3.2以上が必要
詳細は、次を参照してください。
既存ページにHTMLチャートを追加するには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
「ページ定義」で、新しいリージョンを作成します。
ツリー・ビュー: 「ページ・レンダリング」で、「リージョン」を右クリックし、「作成」を選択します。
コンポーネント・ビュー: 「リージョン」で、「作成」アイコンをクリックします。
「チャート」を選択して、「次へ」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「HTML5チャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。チャート・タイプによっては、1つまたは2つ選択するように求められる場合があります。
「次へ」をクリックします。
「表示属性」で、次のステップを実行します。
次の項目を指定します。
タイトル
リージョン・テンプレート
親リージョン
表示ポイント
順序
詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「次へ」をクリックします。
「チャート属性」で、適切な属性を指定し、「次へ」をクリックします。
特定の属性の詳細を表示するには、アイテム・ラベルをクリックします。
「ソース」で、次のステップを実行します。
問合せは次のいずれかの方法で指定します。
表示されているフィールドにSQL問合せを入力します。「チャートのSQL問合せの作成について」を参照してください。
「問合せの作成」ボタンをクリックします。ビルド・チャート問合せウィザードが表示されたら、画面に表示されるステップに従います。
関連するチャート属性を指定します。詳細を表示するには、アイテム・ラベルをクリックします。
「条件付き表示」で、次のステップを実行します。
条件タイプ: このコンポーネントがレンダリングされるために満たす必要があるリストから、条件タイプを選択します。「条件付きのレンダリングおよびプロセスの理解」を参照してください。
認可スキーム: オプションで認可スキームを選択します。このコンポーネントをレンダリングまたは処理するためには、この認可スキームがTRUEと評価される必要があります。詳細は、「認可を介したセキュリティの提供」を参照してください。
「リージョンの作成」をクリックします。
新しいページでHTML5チャートを作成するには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーションを選択します。
「ページの作成」をクリックします。
「チャート」を選択して、「次へ」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「HTML5チャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。チャート・タイプによっては、1つまたは2つ選択するように求められる場合があります。
「次へ」をクリックします。
「ページおよびリージョン属性」で、次のステップを実行します。
次の項目を指定します。
ページ番号
ページ名
リージョン・テンプレート
リージョン名
ブレッドクラム
詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「次へ」をクリックします。
「タブ・オプション」で、タブを含めるかどうかを指定し、「次へ」をクリックします。
「チャート属性」で、適切な属性を指定し、「次へ」をクリックします。
属性の詳細を表示するには、アイテム・ラベルをクリックしてください。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「問合せ」で、次のステップを実行します。
問合せは次のいずれかの方法で指定します。
表示されているフィールドにSQL問合せを入力します。「チャートのSQL問合せの作成について」を参照してください。
「問合せの作成」ボタンをクリックします。ビルド・チャート問合せウィザードが表示されたら、画面に表示されるステップに従います。
関連するチャート属性を指定します。詳細を表示するには、アイテム・ラベルをクリックします。
「次へ」をクリックします。
「作成」をクリックします。
HTML5チャートの作成後は、「チャート属性」ページでチャート属性を編集することによって、そのレンダリングをFlashに切り替えることができます。
HTML5チャートをFlashチャートに切り替えるには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「Flashチャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。3Dチャート・タイプはFlashチャートでのみサポートされているため、3Dオプションを使用するにはチャート・タイプを変更する必要がある場合があります。
属性の詳細を表示するには、アイテム・ラベルをクリックしてください。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「変更の適用」をクリックします。
Oracle Application ExpressのFlashチャートのサポートは、AnyChart Flash Chart Componentをベースにしています。
内容は次のとおりです。
Oracle Application ExpressのFlashチャートのサポートは、AnyChart Flash Chart Componentをベースにしています。AnyChartはフレキシブルなFlashおよびJavaScriptベースのソリューションで、開発者は動きがありコンパクトでインタラクティブなチャートを作成できます。Flashチャートはブラウザでレンダリングされ、使用するにはFlash Player 9以上が必要です。AnyChart 6.0では、FlashチャートはFLASH_PREFERREDレンダリング・タイプを使用してレンダリングされます。チャートを表示するデバイスでFlash Playerを使用できない場合(iPhoneで表示されるページなど)、AnyChartは自動的にHTML5チャート・エンジンに切り替え、SVGベースのチャートを表示します。
既存ページにFlashチャートを追加するには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
「ページ定義」で、新しいリージョンを作成します。
ツリー・ビュー: 「ページ・レンダリング」で、「リージョン」を右クリックし、「作成」を選択します。
コンポーネント・ビュー: 「リージョン」で、「作成」アイコンをクリックします。
「チャート」を選択して、「次へ」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「Flashチャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。チャート・タイプによっては、1つまたは2つ選択するように求められる場合があります。
「次へ」をクリックします。
「表示属性」で、次のステップを実行します。
次の項目を指定します。
タイトル
リージョン・テンプレート
親リージョン
表示ポイント
順序
詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「次へ」をクリックします。
「チャート属性」で、適切な属性を選択し、「次へ」をクリックします。
特定の属性の詳細を表示するには、アイテム・ラベルをクリックします。
「ソース」で、次のステップを実行します。
問合せは次のいずれかの方法で指定します。
表示されているフィールドにSQL問合せを入力します。「チャートのSQL問合せの作成について」を参照してください。
「問合せの作成」ボタンをクリックします。ビルド・チャート問合せウィザードが表示されたら、画面に表示されるステップに従います。
関連するチャート属性を指定します。詳細を表示するには、アイテム・ラベルをクリックします。
「次へ」をクリックします。
「条件付き表示」で、次のステップを実行します。
条件タイプ: このコンポーネントがレンダリングされるために満たす必要があるリストから、条件タイプを選択します。「条件付きのレンダリングおよびプロセスの理解」を参照してください。
認可スキーム: オプションで認可スキームを選択します。このコンポーネントをレンダリングまたは処理するためには、この認可スキームがTRUEと評価される必要があります。詳細は、「認可を介したセキュリティの提供」を参照してください。
「リージョンの作成」をクリックします。
新しいページでFlashチャートを作成するには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーションを選択します。
「ページの作成」をクリックします。
「チャート」を選択して、「次へ」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「Flashチャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。チャート・タイプによっては、1つまたは2つ選択するように求められる場合があります。
「次へ」をクリックします。
「ページおよびリージョン属性」で、次のステップを実行します。
次の項目を指定します。
ページ番号
ページ名
リージョン・テンプレート
リージョン名
ブレッドクラム
詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「次へ」をクリックします。
タブを含めるかどうかを指定して、「次へ」をクリックします。
「チャート属性」で、適切な属性を選択し、「次へ」をクリックします。
詳細を表示するには、アイテム・ラベルをクリックします。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「問合せ」で、次のステップを実行します。
問合せは次のいずれかの方法で指定します。
表示されているフィールドにSQL問合せを入力します。「チャートのSQL問合せの作成について」を参照してください。
「問合せの作成」ボタンをクリックします。ビルド・チャート問合せウィザードが表示されたら、画面に表示されるステップに従います。
残りの属性を指定します。詳細を表示するには、アイテム・ラベルをクリックします。
「次へ」をクリックします。
「作成」をクリックします。
アプリケーション内のすべてのFlashチャートをFlash 6にアップグレードするには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーション・ビルダーのホームページが表示されます。
アプリケーションを選択します。
アプリケーションのホームページが表示されます。
「ユーティリティ」をクリックし、「アプリケーションのアップグレード」をクリックします。
「アプリケーション・サマリーのアップグレード」レポートが表示されます。
「FlashチャートのFlashチャート5へのアップグレード」で、候補オブジェクトの数をクリックします。
アップグレードするオブジェクトを選択し、「アップグレード」をクリックします。
アプリケーション内のすべてのFlashチャートをHTML5にアップグレードするには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーション・ビルダーのホームページが表示されます。
アプリケーションを選択します。
アプリケーションのホームページが表示されます。
「ユーティリティ」をクリックし、「アプリケーションのアップグレード」をクリックします。
「アプリケーション・サマリーのアップグレード」レポートが表示されます。
「FlashチャートのFlashチャート5へのアップグレード」で、候補オブジェクトの数をクリックします。
アップグレードするオブジェクトを選択し、「アップグレード」をクリックします。
1つのFlash 3チャートをFlash 6にアップグレードするには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「タスク」リストで、「Flash 6チャートへのアップグレード」をクリックします。
「アップグレード」をクリックします。
1つのFlash 3チャートをHTML5にアップグレードするには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「タスク」リストで、「HTML5チャートへのアップグレード」をクリックします。
「アップグレード」をクリックします。
Flashチャートの作成後は、「チャート属性」ページでチャート属性を編集することによって、そのレンダリングをHTML5に切り替えることができます。
FlashチャートをHTML5チャートに切り替えるには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」をクリックします。
「チャート・タイプ」で、次のステップを実行します。
チャートのレンダリング: 「HTML5チャート」を選択します。
チャート・タイプ: チャート・タイプを指定します。3Dチャート・タイプはFlashチャートでのみサポートされているため、2Dオプションを使用するにはチャート・タイプを変更する必要がある場合があります。
属性の詳細を表示するには、アイテム・ラベルをクリックしてください。ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「変更の適用」をクリックします。
以前のリリースのOracle Application Expressでは、SVGチャートの作成がサポートされていました。既存のSVGチャートは引き続きサポートされていますが、Oracle Application Expressでは新しいSVGチャートの作成はサポートされなくなりました。
内容は次のとおりです。
この項では、SVGチャートをHTML5にアップグレードする際に適用される制限と、アップグレードの手順について説明します。
内容は次のとおりです。
単一または複数のSVGチャートを自動的にHTML5にアップグレードできます。
SVGチャートをアップグレードできますが、次の制限事項があります。
軸の書式文字列で定義された数値書式のみが移行されます。日付書式および時間書式は無視されます。
次の項目を含む数値書式の要素が移行されます。
0,9,D,G,, (comma),. (period),$,C,L,FM
HTML5チャートの各シリーズのラベルは、各シリーズの列の別名から導出されます。これは各シリーズのラベルが「シリーズ名」属性から導出されるSVGチャートによって異なります。
SVGチャートでは、最初のシリーズのラベルがX軸に使用されます。HTML5チャートでは、最初のシリーズでデータのラベルが発生していなくても、すべてのデータが表示されるように拡張されています。
SVGチャートをHTML5にアップグレードするには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「タスク」リストで、「新しいHTML5チャートへのアップグレード」をクリックします。
「アップグレード」をクリックします。
すべてのSVGチャートをHTML5チャートにアップグレードするには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーション・ビルダーのホームページが表示されます。
アプリケーションを選択します。
アプリケーションのホームページが表示されます。
「ユーティリティ」をクリックし、「アプリケーションのアップグレード」をクリックします。
「アプリケーション・サマリーのアップグレード」レポートが表示されます。
「SVGチャートのHTML5チャートへのアップグレード」で、候補オブジェクトの数をクリックします。
アップグレードするオブジェクトを選択し、「アップグレード」をクリックします。
SVGチャートを作成すると、そのチャートは、現行のテーマに関連付けられたカスケード・スタイルシート(CSS)のクラスに基づいてOracle Application Expressによってレンダリングされます。別のCSSを参照するか、または属性の編集ページのCSSセクションで個々のクラスを上書きして、チャートの外観を変更できます。
次に、サンプル・アプリケーションのダイアル・チャートのCSSクラスの例を示します。この例には、使用可能なすべてのCSSクラスが示されています。クラス名は太字で表示されています。
text{font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;fill:#000000;} tspan{font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;fill:#000000;} text.title{font-weight:bold;font-size:14;fill:#000000;} text.moredatafound{font-size:12;} rect.legend{fill:#EEEEEE;stroke:#000000;stroke-width:1;} text.legend{font-size:10;} #background{fill:#FFFFFF;stroke:none;} rect.chartholderbackground{fill:#ffffff;stroke:#000000;stroke-width:1;} #timestamp{text-anchor:start;font-size:9;} text.tic{stroke:none;fill:#000000;font-size:12} line.tic{stroke:#000000;stroke-width:1px;fill:none;} #dial{stroke:#336699;stroke-width:2px;fill:#336699;fill-opacity:.5;} #dial.alert{fill:#FF0000;fill-opacity:.5;} #dialbackground{stroke:#000000;stroke-width:none;fill:none;filter:url(#MyFilter);} #dialcenter{stroke:none;fill:#111111;filter:url(#MyFilter);} #dialbackground-border{stroke:#DDDDDD;stroke-width:2px;fill:none;filter:url (#MyFilter);}#low{stroke-width:3;stroke:#336699;} #high{stroke-width:3;stroke:#FF0000;} #XAxisTitle{letter-spacing:2;kerning:auto;font-size:14;fill:#000000;text-anchor:middle;} #YAxisTitle{letter-spacing:2;kerning:auto;font-size:14;fill:#000000;text-anchor:middle;writing-mode:tb;} .XAxisValue{font-size:8;fill:#000000;} .YAxisValue{font-size:8;fill:#000000;text-anchor:end;} .nodatafound{stroke:#000000;stroke-width:1;font-size:12;} .AxisLine{stroke:#000000;stroke-width:2;fill:#FFFFFF;} .GridLine{stroke:#000000;stroke-width:0.3;stroke-dasharray:2,4;fill:none;} g.dataholder rect{stroke:#000000;stroke-width:0.5;} .legenditem rect{stroke:#000000;stroke-width:0.5;}
表10-4に、サポートされているすべてのCSSクラスを示します。一部のクラスは、特定のチャート・タイプにのみ適用されます。
表 10-4 使用可能なSVGチャートCSSクラス
クラス | 説明 |
---|---|
|
チャートに表示されるテキストの外観を定義します。 |
|
チャートに表示されるテキストの外観を定義します。 |
|
デフォルトのチャート・テキストを上書きします。このクラスは、タイトル・テキストに使用します。 |
|
より多くのデータが検出されたテキストの外観を定義します。 |
|
チャート凡例を保持する矩形ボックスを作成します。 凡例の枠線を削除するには、 rect.legend{fill:#CCCC99;stroke:none;} |
|
チャート凡例に表示されるテキストを定義します。 |
|
SVGプラグイン用のバックグラウンド全体を作成します。 枠線なしの単色の立体バックグラウンドを作成するには、 #background{fill:#FFFFFF;stroke:#FFFFFF;stroke-width:2;} |
|
円グラフおよびダイアル・チャートには適用されません。チャート・データを保持する矩形のバックグラウンドを作成します。 バックグラウンドに何も表示しない場合は、 rect.chartholderbackground(display:none;) |
|
「非同期更新」チャート属性が「はい」に設定されている場合にのみ適用されます。更新タイムスタンプ・テストの外観を制御します。 タイムスタンプの表示を無効にするには、「カスタムCSS、インライン」属性で "#timestamp{display:none;}" 関連項目: 「非同期更新の有効化」 |
|
ダイアル・チャート専用。ダイアル・チャートの数値を定義します。 |
|
ダイアル・チャート専用。ダイアル・チャートの数値の直下に表示される目盛り線を定義します。 |
|
ダイアル・チャート専用。ダイアル・チャートに表示される値を定義します。 |
|
ダイアル・チャート専用。別の表示画面を使用してダイアル・チャートにレンダリングされる値(アラート値)を定義します。 |
|
ダイアル・チャート専用。ダイアル・チャートのバックグラウンドを作成します。 |
|
ダイアル・チャート専用。ダイアル・チャートにダイアルの中心を作成します。 |
|
ダイアル・チャート専用。 |
|
ダイアル・チャート専用。チャートに表示されているデータの履歴上の最低水位標を定義します。 |
|
ダイアル・チャート専用。チャートに表示されているデータの履歴上の最高水位標を定義します。 |
|
X軸に表示されるタイトルを定義します。 |
|
Y軸に表示されるタイトルを定義します。 |
|
X軸に表示される値を定義します。 |
|
Y軸に表示される値を定義します。 |
|
軸値に類似しています。 |
|
情報を参照できない場合に表示されるテキスト要素を定義します。 |
|
負の値を含むチャートの0(ゼロ)を示します。 |
. |
チャートの横線および縦線を作成します。 |
|
チャートに表示されるすべてのデータに一律のスタイルを適用します。 |
|
凡例内のすべての矩形アイテムに一律のスタイルを適用します。 |
「チャート属性」ページの「CSS」セクションを使用して、チャート用のカスタム・カスケード・スタイルシートを参照できます。外部CSSを参照する場合は、全体を参照するか、または特定のスタイルを上書きできます。
カスタム・チャートCSSを参照するには、次のステップを実行します。
CSSをアプリケーション・ビルダーにアップロードします。詳細は、「カスケード・スタイルシートのアップロード」を参照してください。
チャートを含むページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」タブをクリックします。
「チャート属性」ページで、CSSセクションまでスクロールします。
「カスタムCSSを使用」で、「はい」を選択します。
外部CSSを排他的に参照するには、次のステップを実行します。
「カスタムCSS (リンク)」で、カスタムCSSへのリンクを入力します。次に例を示します。
#IMAGE_PREFIX#themes/theme_4/svg.css
CSSが排他的に使用されるように指定します。「カスタムCSS、インライン」で、次のように入力します。
/**/
カスタムCSSを参照し、特定のスタイルを上書きするには、次のステップを実行します。
「カスタムCSS (リンク)」で、カスタム・スタイルシートへのリンクを入力します。次に例を示します。
#IMAGE_PREFIX#themes/theme_4/svg.css
「カスタムCSS、インライン」で、上書きするカスタムCSSスタイルを入力します。
「チャート属性」ページの「カスタムCSS、インライン」属性を使用して、デフォルトCSS内の特定のスタイルを上書きできます。
デフォルトのCSS内の特定のスタイルを上書きするには、次のステップを実行します。
チャートを作成します。「SVGチャートについて」を参照してください。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」タブをクリックします。
「CSS」までスクロールします。
「カスタムCSSを使用」で、「はい」を選択します。
「カスタムCSS、インライン」で、上書きするカスタムCSSスタイルを入力します。
SVGチャートを他の言語で表示するには、text
およびtspan
クラスに正しい言語が反映されるように編集します。
SVGチャートを他の言語で表示するには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」タブをクリックします。
「CSS」までスクロールします。
「カスタムCSSを使用」で、「はい」を選択します。
「カスタムCSS、インライン」で、text
およびtspan
クラスに正しい言語が反映されるように編集します。次の例では、チャートを韓国語に変更する方法を示します。
text{font-family:Batang;fill:#000000;} tspan{font-family:Batang;fill:#000000;}
以前のリリースのOracle Application Expressでは、HTMLチャートの作成がサポートされていました。既存のHTMLチャートは引き続きサポートされますが、Oracle Application Expressでは作成ウィザードによるHTMLチャートの新規作成はサポートされなくなりました。新しいHTMLチャートのリージョン・タイプのプラグインは、OTNからダウンロードできます。このプラグインは、ユーザーが自分のアプリケーションでHTMLチャート・リージョンを作成できるようにします
詳細は、次を参照してください。
内容は次のとおりです。
HTMLチャートをHTML5にアップグレードするには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーション・ビルダーのホームページが表示されます。
アプリケーションを選択します。
アプリケーションのホームページが表示されます。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」をクリックします。
「タスク」リストで、「HTML5チャートへのアップグレード」をクリックします。
「アップグレード」をクリックします。
すべてのHTMLチャートをHTML5にアップグレードするには、次のステップを実行します。
「ワークスペース」ホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
アプリケーション・ビルダーのホームページが表示されます。
アプリケーションを選択します。
アプリケーションのホームページが表示されます。
「ユーティリティ」をクリックし、「アプリケーションのアップグレード」をクリックします。
「アプリケーション・サマリーのアップグレード」レポートが表示されます。
「HTMLチャートのHTML5チャートへのアップグレード」で、候補オブジェクトの数をクリックします。
アップグレードするオブジェクトを選択し、「アップグレード」をクリックします。
チャートの作成後は、「チャート属性」ページでチャート属性を編集してチャートの表示を変更できます。
「チャート属性」ページにアクセスするには、次のステップを実行します。
ページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
チャート属性ページにアクセスします。
ツリー・ビュー: 「ページ・レンダリング」で、リージョン名をダブルクリックします。
コンポーネント・ビュー: 「リージョン」で、リージョン名を選択します。
リージョン定義が表示されます。
「チャート属性」をクリックします。
対象となる属性を編集します。
ページ上の特定のアイテムの詳細を表示するには、アイテム・ラベルをクリックします。
ヘルプが使用可能な場合は、アイテムにカーソルをあわせると、カーソルが疑問符付きの矢印に変わります。「フィールドレベル・ヘルプについて」を参照してください。
「変更の適用」をクリックします。
ヒント: SVGチャート(「チャート・タイトル」属性)のチャート・タイトルを削除すると、チャート凡例の位置と表示に悪影響を及ぼす場合があります。 |
イメージの保存をサポートするには、AnyChartはhttp://www.anychart.com
に存在するサーバー側スクリプトを使用する必要があります。イメージの保存を試みると、データはBase64エンコーディングでこのサーバーに送信されます。次に、サーバーでデコードされ、デコードされたレスポンスが戻されます。
チャートの保存をローカルでサポートする場合は、デコーディング・スクリプトをローカル・サーバーでホストする必要があります。Flashチャートでは、AnyChart JavaScriptのファンクションgetPNG
を使用する必要もあります。デフォルトでは、チャート・リージョンは埋込みHTMLタグを使用し、AnyChart JavaScriptコールを使用しません。AnyChart JavaScriptコールを使用するには、Flashチャートのリージョン・ソースを変更する必要があります。
関連項目: ローカルでのFlashチャート保存のサポートを追加する方法については、AnyChartユーザーズ・ガイドでイメージまたはベクター・ファイルとしてのチャート保存に関する説明を参照してください。 |
チャート属性ページには、標準の属性で制御できない追加のチャート設定があります。チャートのルック・アンド・フィールをさらに制御するには、カスタムXMLを使用できます。
カスタムXMLを使用するには、次のステップを実行します。
「チャート属性」ページにナビゲートします。詳細は、「チャート属性の編集」を参照してください。
「チャートXML」までスクロールします。
「カスタムXMLの使用」から「はい」を選択します。
カスタムXMLの使用を選択した場合、もう適用されない属性を持つリージョンは非表示となります。これらのリージョンを再度表示するには、「カスタムXMLの使用」で「いいえ」を選択します。
XMLを編集します。
「変更の適用」をクリックします。
チャート属性ページで「非同期更新」属性を有効するか、リフレッシュ・アクションとともに動的アクションを使用すると、SVGチャート、FlashチャートおよびHTML5チャートで情報を監視できます。
内容は次のとおりです。
「非同期更新」属性を有効にすると、チャートが更新され、指定した時間間隔内に基礎となるデータで行われた変更が反映されます。
非同期更新を有効にするには、次のステップを実行します。
「チャート属性」ページにナビゲートします。詳細は、「チャート属性の編集」を参照してください。
チャート属性ページが表示されます。
「リフレッシュ」までスクロールします。
「非同期更新」で、「はい」を選択します。
「更新間隔」で、チャートの更新間隔(秒)を入力します。最適なパフォーマンスを得るには、2秒を超える間隔を選択します。
SVGチャートに「非同期更新」を有効にすると、最終更新を示すタイムスタンプがチャートに表示されます。
「非同期更新」タイムスタンプを無効にするには、次のステップを実行します。
「チャート属性」ページにナビゲートします。
「CSS」セクションに移動します。
「カスタムCSSを使用」で、「はい」を選択します。
「カスタムCSS、インライン」で、#timestamp
を次のように編集します。
#timestamp{display:none;}
リフレッシュ動的アクションを作成するには、次の手順を実行します。
チャートを含むページ定義にナビゲートします。「ページ定義へのアクセス」を参照してください。
「動的アクション」セクションで、「作成」をクリックします。
「指定」で、次のステップを実行します。
名前: 動的アクションの名前を入力します。
順序: このコンポーネントの順序を指定します。これによって評価の順序が決まります。
「次へ」をクリックします。
「時期」で、次のステップを実行します。
イベント: 動的アクションの起動をトリガするイベントを指定します。
「次へ」をクリックします。
「Trueアクション」で、次のステップを実行します。
アクション: 「リフレッシュ」を選択します。
「次へ」をクリックします。
「影響を受ける要素」で、次のステップを実行します。
選択タイプ: 「リージョン」を選択します。
リージョン: チャートを含むリージョンを選択します。
「次へ」をクリックします。
「動的アクションの作成」をクリックします。