fc2ブログ

Notesクライアントでグラフを作る

Dominoでグラフをライフワークにするつもりはないですが、アイデアというか他に用途が見つからないものが出たので書いておきます。
今回はNotesクライアント。フォームにパススルーHTMLを記述して、Notesクライアントで見るとちゃんと表示されます。ということで矩形画像の幅を変えて棒グラフに見せるHTMLをパススルーHTMLにしてみました。

(1) イメージリソースに20×13pxの画像 棒 (ファイル名はbar.gif)を登録する。

(2) フォームを用意して、データを入力する。
フォーム

(3) ビューを用意。ビュー名は"Sale"、列式は下記の通り。
グラフ

"<tr>" +
"<td width=60>" + YYYYMM + "</td>" +
"<td width=70 style=\"text-align:right\">" + @Text(URIAGE; ",") + "</td>" +
"<td><img src=\"" + @WebDbName + "/bar.gif\" height=10 width=" +
@Text(URIAGE/10000) + "></td>" +
"</tr>"

(4) フォームを用意して。フォームの中に計算結果テキストを貼り、列式は下記の通り。
計算結果テキストにパススルーHTMLの指定を忘れずに!
グラフ

L := @DbColumn("" : "NoCache"; "" : ""; "sale"; 1);
@If(L = ""; ""; "<table>" + @Implode(L) + "</table>")

フォームを開いてみると下記の通り
グラフ

やっていて気が付いたのですが、Styleで使えるものと使えないものがあります。各要素にStyle指定ではなくまとめたいとき、HTML Head Contentに記述しても効きません。共有リソースのスタイルシートを使えば可能です。
他ではUIをRefreshしてもパススルーHTMLは反映されず、開き直しが必要です。

NotesクライアントでパススルーHTMLが有効なのはスゴイですが、一般的なStyleで使えないものが多そうだし、JQueryと融合は無理そうだし、結局使い道がなさそうですが何かありますか?
スポンサーサイト



テーマ : プログラミング
ジャンル : コンピュータ

Webでグラフを作る

例えば、ロケーションのインターネットブラウザを"IE"にしてページの検索と閲覧を"Notes Client"からとしてしまうと、ユーザーにとっては何がNotesでIEかわからない、とういうかそんなこと関係ないようです。そこで「Webでグラフ」の案が出たが、採用には至りませんでしたが、折角なので載せておきます。

(1) イメージリソースに20×13pxの画像 棒 (ファイル名はbar.gif)を登録する。

(2) フォームを用意して、データを入力する。

フォーム

(3) ビューを用意。ビュー名は"Sale"、列式は下記の通り。

ビュー

"<tr>" +
"<td>" + YYYYMM + "</td>" +
"<td>" + @Text(URIAGE; ",") + "</td>" +
"<td><img src=\"bar.gif\" style=\"width:" + @Text(URIAGE/10000) + "px; height:13px;\"></td>" +
"</tr>"


(4) Web表示用フォームを用意。フォーム名は"$$ViewTemplate for Sale"。

フォーム

表示用の計算結果テキストフィールドを用意、値は下記の通り。
"[<table border=1>" +
"<thead><th>年月</th><th>売上</th><th>グラフ</th></thead>" +
"<tbody>" + @Implode(@DbColumn(""; ""; "Sale"; 1); "") + "</tbody>" +
"</table>]"


ブラウザから見た結果は下記の通り。

ブラウザ

ここまでは昔の話で、今はhtml要素にcanvasがあり、更にJQueryを使えば簡単に美しいグラフを作ることができます。そこで引き続きJQuery Flotを試してみました。

(1) まずはJQuery Flotを こちら からダウンロードする。今回必要なファイルは jquery.js、 jquery.flot.js、 excanvas.jsの3つ。

(2) その3ファイルをファイルリソースに登録する。

ファイルリソース

(3) フォームを用意して、データを入力する。

フォーム

(4) ビューを用意。ビュー名は"Sale"、列式は下記の通り。

ビュー

"[" + @ReplaceSubstring(YYYYMM; "/"; "") + "," + @Text(URIAGE) + "]"


(5) Web表示用フォームを用意。フォーム名は"$$ViewTemplate for Sale"、フォームにdivタグ(id=saleにグラフを吐き出す)を書く。

フォーム

HTML Head Content に下記の式を入れる。
"<script type=\"text/javascript\" src=\"jquery.js\"></script>" +
"<script type=\"text/javascript\" src=\"jquery.flot.js\"></script>" +
"<!--[if IE]><script type=\"text/javascript\" language=\"javascript\" src=\"excanvas.js\"></script><![endif]-->" +
"<script type=\"text/javascript\" language=\"javascript\">" +
"$(function () {" +
"$.plot($(\"#sale\"), [{" +
"label: \"売上\"," +
"data: [" + @Implode(@DbColumn(""; ""; "Sale"; 1); ",") + "]" +
"}]);" +
"});"+
"</script>"

ブラウザから見た結果は下記の通り。

ブラウザ

余談ですが、オープンソースにはJavaScriptライブラリが使えません。100歩譲ってソース展開して貼り付けても良いですが、圧縮されたコードの長いJavaScriptを貼り付けるとデザイナが落ちてしまいます。同様にpngファイルもイメージリソースに登録できません(登録できるのはgif、jpeg、bmp)。
何でも共有リソースファイルへ登録してしまえば良いのですが...何か納得いきません。

テーマ : プログラミング
ジャンル : コンピュータ

Office(OLE)でグラフを作る

Domino に機能が無いからと諦めず、あるものは何でも使ってしまえばいい。
そこでグラフですが、次はOfiice。Excelではない。Office にはたくさんのOLEが提供されていますが、その中のWordやPowerpointに挿入するグラフ = MSGraph.Chartを使ってプログラミングしてみました。

(1) まずはフォームを用意して、データを入力する。

フォーム

(2) ビューは下記の通り、ビュー名は"売上"。

ビュー

(3) グラフ表示用のフォームを用意して、MSGraph.Chartを埋め込みグラフの内容を設定し下記のスクリプトをOnLoadイベントに記述する。ここでは埋め込んだグラフの名前を"Chart"とした(オブジェクトのプロパティ画面より)。

フォームのメニューで「作成」-「オブジェクト」を選択、ダイアログよりMSGraph.Chartを選択する。
オブジェクトの挿入

埋め込んだMSGraph.Chartにあらかじめ設定(グラフの種類など)する。
Chart

Sub Onload(Source As Notesuidocument)

' ノーツ宣言
Dim Session As New NotesSession
Dim View As NotesView
Dim Document As NotesDocument

' MSGraph宣言
Dim Chart As Variant
Dim Sheet As Variant

' ワークエリア
Dim i As Long

' シートにデータを出力する
Set View = Session.CurrentDatabase.GetView("売上")
Set Chart = Source.GetObject("Chart").Application
Set Sheet = Chart.DataSheet
i = 1
Set Document = View.GetFirstDocument
While Not Document Is Nothing
i = i + 1
Sheet.Cells(1, i).Value = Document.ColumnValues(0)
Sheet.Cells(2, i).Value = Document.ColumnValues(1)
Set Document = View.GetNextDocument(Document)
Wend

' グラフを終了する
Call Chart.Quit()
End Sub


実行した結果は下記の通り。

結果フォーム

プログラムとコンポーネントが棲み分けされておりスッキリしています。いっそ市販のコンポーネントを購入したいところですが、会社が理解してくれない以上仕方ありません。最終的に当該方法を採用してシステム提供しています。
注意すべきはソフトのバージョン差異ですが、会社は一応バージョンが統一されています。
またバージョンアップ時のテストは必須ですが、もし動かなかったらどうしよう?

テーマ : プログラミング
ジャンル : コンピュータ

Excelでグラフを作る

引き続きNotesクライアントでグラフ。
どこの会社のパソコンにも、Microsoft Excel は必ず入っていると思います。それならば、Domino から Excel を起動してセルにデータを出力してグラフ生成までさせてしまうサンプル(よくあるやつ)です。

(1) まずはフォーム。

フォーム

(2) 次にビューとExcel(グラフ)を生成するアクションを用意して下記のスクリプトを記述する。

ビュー

' エクセル組込定数
Const xlColumnClustered = 51 ' 集合縦棒
Const xlLocationAsObject = 2 ' 埋め込み先シート

Sub Click(Source As Button)

' ノーツ宣言
Dim UIWorkspace As New NotesUIWorkspace
Dim View As NotesView
Dim Document As NotesDocument

' エクセル宣言
Dim Excel As Variant
Dim Book As Variant
Dim Sheet As Variant
Dim Chart As Variant

' ワークエリア宣言
Dim i As Long

' エクセルを起動する
Set Excel = CreateObject("Excel.Application")
Set Book = Excel.Workbooks.Add
Set Sheet = Book.Worksheets(1)
Excel.Visible = True

' ヘッダを出力する
i = 1
Set View = UIWorkspace.CurrentView.View
Sheet.Cells(i, 1).Value = View.Columns(0).Title
Sheet.Cells(i, 2).Value = View.Columns(1).Title

' データを出力する
Set Document = View.GetFirstDocument
While Not Document Is Nothing
i = i + 1
Sheet.Cells(i, 1).Value = Document.ColumnValues(0)
Sheet.Cells(i, 2).Value = Document.ColumnValues(1)
Set Document = View.GetNextDocument(Document)
Wend

' グラフを作成する
Set Chart = Excel.Charts.Add
Chart.ChartType = xlColumnClustered
Chart.SeriesCollection(1).Name = "= Sheet1!R1C2"
Chart.SeriesCollection(1).Values = "= Sheet1!R2C2:R" & i & "C2"
Chart.SeriesCollection(1).XValues = "= Sheet1!R2C1:R" & i & "C1"
Chart.Location xlLocationAsObject, "Sheet1"
End Sub


実行した結果は下記の通り。

Excel

サンプルは汎用的な作りにはなっていません。
Excel の表やグラフはVBAを調べればカスタマイズできますので。その際、エクセル組込定数は必要なものを宣言することを忘れずに(または値をそのまま書く)。

だが私はこの方法はあまり好きではありません。理由は少し複雑にするだけでロジックが極端に複雑になってしまうからです。グラフだけを考えた場合、グラフが挿入されたExcel テンプレートファイルを用意しておきデータを流し込むだけとした方がシンプルですが、それはそれで難しい...

テーマ : プログラミング
ジャンル : コンピュータ

ビューでグラフを作る

Dominoで開発したシステムで、基幹システム(Oracle)からLEI よりDominoへ転送、ユーザーはNotesクライアントより照会、分析するDBがあります。それらのDBにグラフ機能を追加したくなり、まずイメージリソースを使って営業所の月別売上のグラフ化を試してみました。

(1) イメージリソースに20×13pxの画像 棒 (ファイル名はbar.gif)を登録する。

(2) フォームに下記の3項目を用意して、データを入力する。

フォーム

(3) ビューは下記の通り。

ビュー

一応グラフになっていますが、2008/12の藤枝と静岡を見るとグラフの長さが同じになってしまいます。どうやら画像配列は10個まで、11個目以降が表示されない模様。使い方が特殊なだけに仕様(若しくはバグ)と諦めるしかありません。それならばと横幅10pxと横幅100pxを組み合わせる、様々な横幅の棒画像を用意などと考えるが、当然イレギュラー値に完全対応できません。
全社売上に対して各営業所の売上比など上限値が100%と決まっている場合ならば使えるのですが...

テーマ : プログラミング
ジャンル : コンピュータ

プロフィール

ピヨパパ

Author:ピヨパパ
静岡市のエンドユーザーSE。
最近はDominoの開発ばかりでうんざり。
是非気軽にコメントして下さい。

FC2カウンター
最新記事
最新コメント
最新トラックバック
月別アーカイブ
カテゴリ
検索フォーム
RSSリンクの表示
リンク
ブロとも申請フォーム

この人とブロともになる