OpenLaszloアドバンスド・テクニック(6) Page 4/4
リアルタイム株価チャート、ついに完成!
ネットエイト十河 学
2006/9/6
■当日株価チャートの自動更新
次に当日株価チャートに取り組みます。当日株価チャートではJSPを使ってデータを取得し、タイマーを使って一定時間ごとに自動更新させることにします。ここでは単純にローカルでのテストのみを考えて、アクセスごとにランダムデータを作成してデータ値をテキストに保存しています。
リスト4のように、stockdaily.jspという名前でJSPを作成し、jspフォルダに保存します。
<%@ page language="java" contentType="text/xml; charset=utf-8" |
リスト4 当日株価を発生させるJSP(stockdaily.jsp) |
■当日株価データをjspから取得
stockdailyデータセットのデータソースを設定します。stockchart.lzxの12行目の<dataset name="stockdaily">から</dataset>を次のように変更します。
<dataset name="stockdaily" type="http" src="jsp/stockdaily.jsp" |
次にタイマークラスLzTimerとデリゲートを利用して一定間隔でデータセットをリロードし、最新の情報を取得します。
当日株価チャートクラスdailychart.lzxにリクエスト用メソッドrequestDataとタイマーの処理を追加します(リスト5)。タイマーはoninitイベントを利用し、コンポーネントの初期化時に追加されるようにしています。
<method name="requestData"> |
リスト5 当日株価チャートクラスに処理を追加(dailychart.lzx) |
まずoninit内の処理を見てください。this.requestdelという名前でデリゲートを作成しています。デリゲートはメソッドを参照するためのもので、特にイベントの実現に使われています。LzDelegateのコンストラクタで上記のように対象オブジェクト(this)とメソッド名(requestData)を指定して作成します。
特定のイベントが発生した場合にデリゲート先のメソッドが呼び出されるようにするには、register()メソッドを使用し次のように表記します。
this.requestdel.register( button1 , "onclick" ); |
上の例ではボタンbutton1が作成されているとして、このボタンのクリックイベントによってrequestData()メソッドが呼ばれることになります。もちろん次のようにイベントは複数登録することができます。
this.requestdel.register( button1 , "onclick" ); |
この例ではbutton1、button2、button3のどれがクリックされた場合でもrequestData()が呼び出されます。
次にタイマーの設定を見ていきましょう。LzTimerクラスのaddTimer()メソッドを使用して、デリゲートとこのメソッドが何ミリ秒後に呼ばれるかを設定しています。ここではテストのため5000を設定し、5秒ごとに当日株価データが自動表示されるよう設定しました。
requestDataメソッドでは、まずstockdailyのデータソースをリクエストするためdoRequest()をコールし、また5秒後に同じメソッドが呼ばれるようタイマーをリセットしています。
■リアルタイム株価チャートの完成
これでリアルタイム株価チャートの完成です(図3)。完成したソースコード一式は以下からダウンロードできます。
- atit_chart_src.zip(23.4Kbytes)
ZIPファイルを解凍すると、atit_chart_srcフォルダが表れますので、OpenLaszloサーバの適当なディレクトリにコピーしてください。
例えば、C:\OpenLaszlo Server 3.2\Server\lps-3.2\atit_chart_srcにコピーしたら、ブラウザでhttp://localhost:8080/lps-3.2/atit_chart_src/stockchart.lzxにアクセスすると図3のアプリケーションが立ち上がります。
図3 完成したリアルタイム株価チャート・アプリケーション(画面をクリックすると拡大します) |
ルック&フィールの部分でまだまだ改善は必要ですが、OpenLaszloを使った株価チャートの作成は達成できたと思います。チャートコンポーネントはドキュメントの不備などからまだベータ版扱いとなっているようですが、十分に実用に堪えるコンポーネントとなっています。棒グラフ、コラムグラフ、線グラフ、円グラフが用意されており、サンプルソースが付属していますので、ぜひ利用してください。サンプルグラフの一覧はLaszloJapanのWIKIページから見ることができます。
それではOpenLaszloを活用してアイデアを実現してください。リッチクライアントの世界はまだ始まったばかりです。(連載完)
4/4 |
INDEX |
||
OpenLaszloアドバンスド・テクニック(6) リアルタイム株価チャート、ついに完成! |
||
Page1 はじめに JSPで株価データをランダム生成 |
||
Page2 株価データをJSPから取得 ローソク足クラスの作成 |
||
Page3 チャートスタイルの設定 ローソク足をチャート上に描画 |
||
Page4 当日株価チャートの自動更新 当日株価データをjspから取得 リアルタイム株価チャートの完成 |
- GASで棒、円、折れ線など各種グラフを作成、変更、削除するための基本 (2017/7/12)
資料を作る際に、「グラフ」は必要不可欠な存在だ。今回は、「グラフの新規作成」「グラフの変更」「グラフの削除」について解説する - GET/POSTでフォームから送信された値をPHPで受け取る「定義済みの変数」【更新】 (2017/7/10)
HTMLのフォーム機能についておさらいし、get/postメソッドなどの内容を連想配列で格納するPHPの「定義済みの変数」の中身や、フォーム送信値の取り扱いにおける注意点について解説します【PHP 7.1含め2017年の情報に合うように更新】 - PHPのfor文&ループ脱出のbreak/スキップのcontinue【更新】 (2017/6/26)
素数判定のロジックからbreak文やcontinue文の利点と使い方を解説。for文を使ったループ処理の基本とwhile文との違い、無限ループなども併せて紹介します【PHP 7.1含め2017年の情報に合うように更新】 - Spreadsheetデータの選択、削除、挿入、コピー、移動、ソート (2017/6/12)
Spreadsheetデータの選択、挿入、削除、コピー、移動、ソートに使うメソッドの使い方などを解説する
|
|