概要

Cognos Analytics 11.0.10で使用できるJavaScriptサンプルのセットアップ方法と、JavaScript内容の紹介です。

以前、こちらの記事で、Cognos BIでとても役に立つサンプルJavaScriptを紹介していました。
Cognos プロンプト操作用サンプルJavaScript
https://qiita.com/shinyama/items/892e5696a85746fcf60a

Cognos Analyticsでは、HTLMアイテムの使用がデフォルトではできなくなり、カスタム・コントロールというオブジェクトを介しての実装が必要になりました。
Cognos AnalyticsでのJavaScriptの扱いについて
https://qiita.com/shinyama/items/0bc310fc909465c277a6

今回のサンプルJavaScriptは、カスタム・コントロールベースでの実装なので、Cognos AnalyticsでJavaScript利用をされる方は是非知っておくと役に立つと思います。

セットアップ手順

Cognos Analyticsのインストール時に、簡易インストールか、カスタムインストールの場合は「サンプル」を選択してインストールを行います。

<CA_Install>\samples\JavaScriptフォルダに、以下の3ファイルが配置されます。
javascript.zip : サンプルのJavaScriptソースファイルが含まれています
JavaScript_setup_instructions.pdf : サンプルJSのセットアップ手順です
JS_samples_deployment.zip : Cognos Administrationのコンテンツの管理からインポートします

javascript.zipは解凍すると、javascriptというフォルダが生成され、その配下にサンプルのJavascriptソースが配置されますので、javascriptフォルダを、以下の場所に配置します。

<CA_Install>\webcontent\samples\javascript

JS_samples_deployment.zip を<CA_Install>\deployment にコピーし、Cognos Administrationのコンテンツ管理からインポートします。

こんな感じに、チームコンテンツのSamples > JavaScript から、サンプルのレポートを実行できます。

App bar

画面イメージのように、黒バーを表示して、アイコンを選択するとリストが表示されたり、

二番目のアイコンを選択すると、グラフ類が表示されたりするJavaScriptサンプルです。

App bar data

横にバーを表示し、選択するアイテムによりフィルターがかかるようです。

Webを選択した場合。

App bar static labels

App barの横版という感じですね。

Card 2を選択した場合

Basic control

カスタムコントロールの基本的な使い方を紹介しています。
単純にレポート上に「Hello」の出力をしたいだけで、Source内の記述は実際のjsファイルに記載されている内容と同じです。
このソースのjsファイルを読み込んで、Hello を表示するために、カスタムコントロールをこうやって設定してね、という例です。

Bootstrap button bar

バーを表示し、選択するアイテムによってフィルターがかかります。
Mail選択の場合。

Web選択の場合。

Bootstrap tabs

TABにしたような感じです。

Collapse regions

このアイコンを選択すると・・・

プロンプトエリアの展開&省略ですね。これは使いそう。

D3 bar chart

横棒だけのチャートが描画されます。

Data store viewer

一見リストかと思いましたが、JavaScriptだけでこの表示をやっているようです。

レポートの機能で開いてみると、カスタム・コントロールをクリックすると、こんな感じのデータアイテムの配置ができます。どうやって実装しているのか、ソース見るとわかると思いますが。

Displayable regions

赤枠の矢印アイコンで、プロンプト自体の表示・非表示ができます。

Events

レポート実行時の表示はこんだけ。

こんなjsが呼ばれるようなので、initialize、show、hide、draw、getParametersなどの、各種イベント時のハンドルの仕方のサンプルみたいな感じかな。

define( function() {
"use strict";

var bAlert = false;

function Control()
{
};

Control.prototype.initialize = function( oControlHost, fnDoneInitializing )
{
        this.log( "CustomControl.initialize" );
        fnDoneInitializing();
};

Control.prototype.show = function( oControlHost )
{
        this.log( "CustomControl.show" );
};

Control.prototype.hide = function( oControlHost )
{
        this.log( "CustomControl.hide" );
};

Control.prototype.draw = function( oControlHost )
{
        this.log( "CustomControl.draw" );
        oControlHost.container.innerHTML = "Hello";
};

Control.prototype.getParameters = function( oControlHost )
{
        this.log( "CustomControl.getParameters" );
        return null;
};

Control.prototype.destroy = function( oControlHost )
{
        this.log( "CustomControl.destroy" );
};

Control.prototype.log = function( s )
{
        console.log( s );
        if ( bAlert )
        {
                alert( s );
        }
};

return Control;
});

Full screen

このアイコンを選択すると。

あ、ホントだ、リストが全画面表示された。Escキーで戻れる。

Google bar chart

何がGoogleなのか(色ですかね)わかりませんが、棒グラフが表示されます。

Google organization chart

こんな感じの組織図が描画されます。

HTML select

値のプロンプトかと思いきや、JavaScriptで同様のものを実装しているようです。

HTML slider

同様にJavaScriptで、スライダーバーを実装しています。

List column display

初期画面です。

ウィンドウに数字をカンマ区切りで入れて、Hide。なるほど。

Loading text

5秒待ってメッセージを表示するサンプルですかね。
レポート実行時、

5秒後。

ソース

define( function() {
"use strict";

function C_LoadingText()
{
};

C_LoadingText.prototype.initialize = function( oControlHost, fnDoneInitializing )
{
        oControlHost.loadingText = "This is loading text set by calling setLoadingText()";
        setTimeout( fnDoneInitializing, 5000 );
};

C_LoadingText.prototype.draw = function( oControlHost )
{
        oControlHost.container.innerHTML = "Done.";
};

return C_LoadingText;
});

Page module

カスタム・コントロールではなく、ページからjsを呼び出す例のようです。

Prompt API buttons

プロンプトの値を選択したり、取得したり、クリアしたりするサンプルのようです。

Prompt validation

テキストボックスへの入力が、形式通りに入れられてるかチェックするようです。
下記は、形式通りじゃないので、数値を入れても実行可能になりません。

Save csv

ボタンを押すとCSVでデータダウンロードができるようです。

以上です。
ちら見して頂き、記憶の片隅にこういうサンプルがあると覚えておいて頂ければ、いつか助かる日が来るかも知れません。