Tetsu Tanimoto's Weblog

木曜日 2 14, 2008

ブラウザに表示できるグラフを作ってみました

さてさて、今日はブラウザに折れ線グラフや棒グラフを描くための jMaki Charting につ
いて紹介します。と言っても、やっぱり超簡単。5 分もあればできます。

ついでですので、6.0.1 や簡単にできるようになった jMaki プラグインのインストール
から手順を書きますね。

手順としては、こんな感じです。

1. NetBeans 6.0.1 のインストール
 2. jMaki プラグインのインストール
 3. jMaki Charting のインストール
 4. jMaki Charting のコンポーネントを追加
 5. ブラウザで実行結果の確認

では、詳細。

1. NetBeans 6.0.1 のインストール

   こちらから「日本語」版（「すべて」もしくは「Web および Java EE」）をダウンロ
   ードし、インストールします。インストール後、NetBeans を立ち上げると・・・
   もちろん、日本語でメニューが表示されます！

NetBeans 6.0.1 日本語版

2. jMaki プラグインのインストール

   jMaki プラグインをインストールします。（と言っても、以前より簡単！）
   NetBeans のメニューバーから「ツール」
   →「プラグイン」
   →「jMaki Ajax support」にチェック

jMaki プラグインの追加

→「インストール」をクリックし、手順に従ってインストール
→ NetBeans の再起動

3. jMaki Charting のインストール

   3-1. こちらから jMaki Charting のライブラリをダウンロードします。
   3-2. 以下の手順で、NetBeans にインストールします。
        NetBeans のメニューバーから「ツール」
        →「パレット」
        →「Add jMaki Library」
        → ダウンロードしたファイルを選択し「開く」

4. jMaki Charting のコンポーネントを追加

   4-1. 新規プロジェクトを作成
        1. NetBeans のメニューバーから「ファイル」→「新規プロジェクト」
        2.「カテゴリ: Web」「プロジェクト: Web アプリケーション」とし「次へ」
        3.「次へ」
        4.「フレームワーク: jMaki Ajax Framework」にチェックし「完了」
   4-2. Dojo Area を追加
        「Main Content Area」の場所に「jmaki-charting-widget-0.8.3」の
        「Dojo Area」をドラッグ＆ドロップ

jMaki Charting を使った開発画面

5. ブラウザで実行結果の確認

NetBeans の「主プロジェクトを実行」アイコンをクリックし、実行

ブラウザ上にグラフがでてきた！

他にも、円グラフや棒グラフ、線グラフが描けます。もちろん、値はプログラムで生成でき
るので、この程度でできるのであれば本当に便利ですね！

Posted at 09:51午後 2 14, 2008 by tanimoto in Java |

木曜日 1 10, 2008

Leopard で Java 6

年末に Leopard（Mac OS X 10.5）用の Java 6 プレビュー版がでましたので、jconsole を動かしてみました。と言っても、端末から "jconsole" コマンドを端末で実行しただけです。

ちなみに、Leopard 用の Java 6 はアップルのサイトから無償でダウンロードすることができます。

JConsole

当たり前ですが、Aqua 版で日本語もきれいに表示されました。でも、当たり前のことが、当たり前にできると嬉しいですね :-)

Posted at 02:40午後 1 10, 2008 by tanimoto in Java | 投稿されたコメント[2]

火曜日 1 08, 2008

jMaki をやってみました

あけましておめでとうございます。
本年もよろしくお願いいたします。

あれよあれよと言う間に年が明けてしまいましたが、ブログの更新はマイペースでやっていきたいと思います。（回りくどい文章ではいりましたが、特に「どなたかに」言い訳をしているわけではありません。）

前回、インストールまでの手順をご紹介しましたが、今回はその続き。とりあえず「５分でできるAjax の Web アプリ」という感じで jMaki をご紹介いたします。手順は、次のようになります。

1. NetBeans 6.0 を起動
インストールがまだの場合やjMaki のプラグインが設定されていない場合は、こちらをご覧ください。

2. 新規プロジェクトの作成
メニューバーにて「ファイル」→「新規プロジェクト...」を選択します。

3. プロジェクトカテゴリの選択
「カテゴリ: Web」「プロジェクト: Web アプリケーション」を選択し「次へ」をクリックします。

4. プロジェクト名の入力
デフォルトのまま「次へ」をクリックします。

5. フレームワークの設定
「フレームワーク: jMaki Ajax Framework」「CSS Layout: Standard」を選択し「完了」をクリックします。

7. 「Accordion Menu」の追加
NetBeans 右側のパレットから「jMaki Widgets」の「Accordion Menu」を「Sidebar Content Here」と書いてある場所にドラッグ＆ドロップします。

8. 「Map」の追加
「jMaki Google」の「Map」を「Main Content Area」と書いてある場所にドラッグ＆ドロップします。

9. JSP の整形
index.jsp 内で右クリックし「整形」を選択します。

9. プロジェクトの実行
メニューアイコンの「主プロジェクトを実行」ボタン（右から３番目）をクリックします。

10. 実行結果の確認
ブラウザにて実行結果を確認します。（地図が表示できない場合は、ホスト名を「localhost」に設定してください。）

いかがでしょうか？個人的にはかなり簡単に新しいことができるので、気に入っています。（この程度の内容であれば、Ajax なのに JavaScript を書かなくても作ることができますし・・・）

次回以降では、最近セミナーでやっているもう少し複雑な Web アプリの作り方を記載します。（データの書き方、Java での動的なデータ作成方法、jMaki の構造なども記載します。）

では、本年もよろしくお願いいたします。

Posted at 01:45午後 1 08, 2008 by tanimoto in Java | 投稿されたコメント[6]