久しぶりの投稿です。
現在、VMLエディターをSVGでも利用できるように改造中です。この改造にあわせて、JavaScriptでのツールキット開発も行っています。
今まで、JavaScriptは、ブラウザ組み込みのスクリプト言語としてしか思っていませんでしたが、JavaScriptでのクラス定義が可能なので、使いやすいツールキットの開発をはじめてみました。
クラスを利用すると、ツールキットとして使いやすいインタフェースが提供できる点が大きなメリットですが、JavaScriptの欠点としては、ブラウザ毎で仕様が異なることにあります。
そこで、各ブラウザ毎の動作を自動的に判断するクラスとメソッドを用意する予定あり、大体次のようになります。
/* UnifiedBrowderクラス内で、ブラウザのタイプを調べ、各メソッド処理を決定します。作成しれたクラスインスタンスは、myUBに代入されます */
myUB = new UnifiedBrowser();
/* myUBインスタンスのメソッドであるgetMouseButtonを呼び出します。getMouseButtonでは、各ブラウザ毎に異なる処理により左ボタン・右ボタン(例えば、左ボタンなら'L', 右ボタンなら'R')を返却します。このようにすることで、ブラウザ間で異なる処理を一つのメソッドで処理します。*/
var button = myUB.getMouseButton(e);
これだけだと、クラスまで利用せずに、関数で処理すれば良いように思えますが、関数だと、その都度簡単に関数を沢山定義することになり、収集がつかなくなってしまいます。クラスを使うと、このようなブラウザ依存を解消する処理群をメソッドとして、一つのクラスの配下にまとめることができるのが一番のメリットです。
そこで、クラスを有効に活用したJavaScriptツールキットを開発することにしました。Yawdbaデータベースシステムも、このJavaScriptツールキットを利用して構築したいと思っています。
2010年12月30日木曜日
2010年9月20日月曜日
VMLを使った簡単な図形エディターを作ってみました。
久しぶりです。今、JavaScriptを使って簡単な図形エディターを作っています。図形の描画については、マイクロソフトが作ったVMLを使っていますが、今後は、SVGにしないといけないかもしれません。ステップ数は、430ステップです。図形描画として直線、矩形、楕円だけですが、グラデーションや立体化、図形の移動などもマウスでできるようになっているので、結構コンパクトにできたと思っています。
文字列や多角形描画機能を入れても1000ステップぐらいになるかと思います。
使い方は、マウスドラッグにより、画面左のメニューに従って、直線・矩形・楕円を描画します。
また、図形をマウスで選択して図形の移動が可能ですが、さらに、マウス右ボタンで描画属性を変えたり、図形を消すこともできます。
図形が作成できたら、画面の中ほどにある「ソース」ボタンをクリックしてVMLタグリストを取り出し、Webページに貼り付けることで図形描画が可能となります。
このエディターを拡張したいとも思いますが、次には、SVG対応のエディターを開発することを先にしたいとも思います。
私のサイトに、このJavaScriptプログラムをアップしました。YawdbaサイトのJavaScriptのVMLエディターから添付ファイルをダウンロードしてIEで動作することができます。一息ついたら、プログラム解説を載せます。お待ちください。
文字列や多角形描画機能を入れても1000ステップぐらいになるかと思います。
使い方は、マウスドラッグにより、画面左のメニューに従って、直線・矩形・楕円を描画します。
また、図形をマウスで選択して図形の移動が可能ですが、さらに、マウス右ボタンで描画属性を変えたり、図形を消すこともできます。
図形が作成できたら、画面の中ほどにある「ソース」ボタンをクリックしてVMLタグリストを取り出し、Webページに貼り付けることで図形描画が可能となります。
このエディターを拡張したいとも思いますが、次には、SVG対応のエディターを開発することを先にしたいとも思います。
私のサイトに、このJavaScriptプログラムをアップしました。YawdbaサイトのJavaScriptのVMLエディターから添付ファイルをダウンロードしてIEで動作することができます。一息ついたら、プログラム解説を載せます。お待ちください。
2010年9月11日土曜日
JavaScriptと図形エディターを作成することができます。
ひさしぶりです。今、JavaScriptを勉強しています。
HTMLのタグでは、テーブルや文章、水平線しか表現できないと思っていましたが、VMLやSVGを使うと図形を描画することができます。これらのタグを使ってグラフを書くこともできます。まずは、VMLで開発しています。
VMLは、IEでしか使えませんが、今後はSVGでの開発も考えています。VMLについては、とほほのVML入門をご覧ください。
そこで、これらの機能を使ってJavaScriptで簡単な図形エディターを作れないか検討しています。マウスドラッグにより図形を描画できるようにしました。
マウス位置は、onmousedownイベント発生時のマウスのXY位置を取得と、マウス移動後のonmouseupイベント発生時のマウスのXY位置から図形の開始位置と終了位置を決定し、document.createElementでVMLタグを作成し、appendChildでdivタグ追加しました。
マウスドラッグの際には、マウスを移動するたびに図形枠を表示していますが、スムーズに動作しており問題はなさそうです。
現在、図形の塗りパターンや線パターンなどを追加していますが、作成できたらソース公開しますので待っていてください。
HTMLのタグでは、テーブルや文章、水平線しか表現できないと思っていましたが、VMLやSVGを使うと図形を描画することができます。これらのタグを使ってグラフを書くこともできます。まずは、VMLで開発しています。
VMLは、IEでしか使えませんが、今後はSVGでの開発も考えています。VMLについては、とほほのVML入門をご覧ください。
そこで、これらの機能を使ってJavaScriptで簡単な図形エディターを作れないか検討しています。マウスドラッグにより図形を描画できるようにしました。
マウス位置は、onmousedownイベント発生時のマウスのXY位置を取得と、マウス移動後のonmouseupイベント発生時のマウスのXY位置から図形の開始位置と終了位置を決定し、document.createElementでVMLタグを作成し、appendChildでdivタグ追加しました。
マウスドラッグの際には、マウスを移動するたびに図形枠を表示していますが、スムーズに動作しており問題はなさそうです。
現在、図形の塗りパターンや線パターンなどを追加していますが、作成できたらソース公開しますので待っていてください。
2010年8月16日月曜日
javaのsqlアクセスメソッドgetStringで文字化け(2)?
以前にjavaプログラミングで、MSAccessデータベースにアクセスする際の文字化けについてお話しました。どのようにコーディングするのかコメントがありましたので、私がYawdbaで使用しているコードの抜粋を説明します。
◆以下のコーディングでODBCデータソースにアクセスします。
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
cnn = DriverManager.getConnection("jdbc:odbc:" + "データソース");
◆取得したODBCデータソースコネクション(cnn)クラスのcreateStatementメソッドを呼び出し、SQL文を実行するStatementインタフェースを以下のように取得します。
stmt = cnn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,
ResultSet.CONCUR_READ_ONLY);
◆StatementインタフェースのexecuteQueryメソッドにより、SQL Query文を実行します。
rset =stmt.executeQuery("SELECT * From myTable");
◆SQL文が実行したら、取得したResultSetインタフェースオブジェクト(rset)を使って取得するレコード行を設定した後、レコード内のカラム位置(1~)を指定してデータを取得します。
このとき、このデータの型によって動作が異なります。
> データ型がVARCHAR以外なら、通常のgetStringメソッドを使ってデータを取得します。
val = rset.getString(カラム位置);
>データ型がVARCHARなら、ストリームを使ってデータを取得します。
/* データ取得するためのリーダー(myReader)をgetCharacterStreamメソッドで取得します */
Reader myReader = rset.getCharacterStream(カラム位置);
/* 取得するデータの表示サイズをgetColumnDisplaySizeメソッドで取得し、そのサイズ分のStringBufferを確保しておきます */
StringBuffer sb = new StringBuffer(該当フィールド表示サイズ);
try {
int c;
/* 取得したmyReaderを使ってreadメソッドで1文字づつ取得します。*/
while((c = myReader.read()) != -1) {
if(c != 0) /* c == 0の場合には、文字列データとして不正なのでスキップ */
sb.append((char)c); /* 取得した文字列をStringBufferに追加します */
}
}
catch (Exception e) {
エラー処理
}
val = (sb.length() == 0)?null:sb.toString(); /* StringBufferを文字列に変換します。 */
}
現在開発しているYawdbaもある程度形になれば、Yawdbaのサイトで公開したいと思いますが、暫く時間をください。
◆以下のコーディングでODBCデータソースにアクセスします。
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
cnn = DriverManager.getConnection("jdbc:odbc:" + "データソース");
◆取得したODBCデータソースコネクション(cnn)クラスのcreateStatementメソッドを呼び出し、SQL文を実行するStatementインタフェースを以下のように取得します。
stmt = cnn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,
ResultSet.CONCUR_READ_ONLY);
◆StatementインタフェースのexecuteQueryメソッドにより、SQL Query文を実行します。
rset =stmt.executeQuery("SELECT * From myTable");
◆SQL文が実行したら、取得したResultSetインタフェースオブジェクト(rset)を使って取得するレコード行を設定した後、レコード内のカラム位置(1~)を指定してデータを取得します。
このとき、このデータの型によって動作が異なります。
> データ型がVARCHAR以外なら、通常のgetStringメソッドを使ってデータを取得します。
val = rset.getString(カラム位置);
>データ型がVARCHARなら、ストリームを使ってデータを取得します。
/* データ取得するためのリーダー(myReader)をgetCharacterStreamメソッドで取得します */
Reader myReader = rset.getCharacterStream(カラム位置);
/* 取得するデータの表示サイズをgetColumnDisplaySizeメソッドで取得し、そのサイズ分のStringBufferを確保しておきます */
StringBuffer sb = new StringBuffer(該当フィールド表示サイズ);
try {
int c;
/* 取得したmyReaderを使ってreadメソッドで1文字づつ取得します。*/
while((c = myReader.read()) != -1) {
if(c != 0) /* c == 0の場合には、文字列データとして不正なのでスキップ */
sb.append((char)c); /* 取得した文字列をStringBufferに追加します */
}
}
catch (Exception e) {
エラー処理
}
val = (sb.length() == 0)?null:sb.toString(); /* StringBufferを文字列に変換します。 */
}
現在開発しているYawdbaもある程度形になれば、Yawdbaのサイトで公開したいと思いますが、暫く時間をください。
2010年8月4日水曜日
構造化プログラミングと抽象化について
私は、プログラミングを始めてから長い間、構造化プログラミングによる設計を行ってきました。この経験のなかで、処理の抽象化による設計が大切であることが分かってきました。今回は、これについて話したいと思います。おそれく、処理の抽象化とオブジェクト指向プログラミングは、近い関係にあるかと思います。
入社後、2年程たってサンディエゴに出張してUCSD-pSystemlの内部構造を勉強することになりました。UCSD-pSystemには、Pascalコンパイラーだけでなく、ファイルシステムやプログラム実行環境、スクリーンエディターが用意されていました。プログラミングに関して勉強になったのは、そのファイルシステムのモジュールの作り方でした。詳しくはこのリソースをご覧ください。
下位のモジュール(では、フロッピーのディスク内のシリンダー番号やセクター番号から物理セクターを読み込んで、メモリ内に読み込むだけにし、この下位モジュールを呼び出す上位モジュールでは、実際に物理セクターを読み出す下位モジュールを使ってファイルシステムが使用する論理ブロック(ブロック長は固定の512バイト?)を実現していました。さらに、その上のモジュールでファイル名の管理などを行う実際のファイルシステムを構築しています。このような構造は、通常のオペレーティングシステムの開発方法としては一般的ですが、下位モジュールに行くに従って実施のディスクアクセスを物理動作を行っています。
この方法のメリットとしては、仮にセクターの管理するバイト数が変更されたとしても、下位モジュールを修正するだけで上位モジュールに手を加えることなく動作できることにあります。同様のシステム構成としては、プロトコルレイアの階層として一般的なOSI参照モデルがあります。このOSI参照モデルの下位層である物理層やデータリンク層から上位に行くに従って、データにやり取りが抽象化されています。
このように、処理やデータを抽象化することにより、仕様変更に強いシステムの構築が可能となります。
なお、私が尊敬する「ニクラウス・ヴィルト」も、プログラミングに関する抽象化の大切さを著しています。
2010年7月23日金曜日
クラスの作り方
Javaプログラミングでは、まず、クラスが必要となります。それでは、クラスを設計する上での基準などあるのでしょうか?。これが、正しいかはわかりませんが、私が考えるクラス設計方法について述べたいと思います。
私は非常に長い間、構造化プログラミングに従ってプログラム設計を行っていましたが、システムプログラム分野では、データの関連をポインターを使ったツリーやノードで表現するデータ構造が決まるとほとんど、プログラム構造が決まってくることがわかってきました。その結果、プログラミングの多くの時間はデータ構造の設計に費やすようになりました。データ構造の設計では、今後、想定される仕様変更や機能追加に対応できるかが大きなポイントとなります。
オブジェクト指向の設計方法でも、クラスを単位を決定するには、今後、どのような仕様変更があるか、作成したクラスが他のモジュールで再利用できるかを観点に決める必要があると思います。
高速性が必要とされるサブルーチンや仕様変更が発生することが想定されないサブルーチンに迄、クラス化する必要はないと思います。
Yawdbaでは、クライアントからWebリクエストから、クライアントのブラウザやパラメータなどを内部データに持つクラスインスタンスを作成し、その後の処理では、このクラスインスタンスのみを使用して処理します。もし、クライアントからの呼び出し方法が変更された場合には、このクラスインスタンスを拡張するだけで、後続の処理に影響を与えないことが可能にしています。
構造化プログラミング
わたしが、プログラマーになったころ(1978年頃)、大量のソースコードを開発する方法として構造化プログラミング手法が確立したころでした。それまでのアセンブラやFortranなどのプログラムロジックには、プログラムを開発する手法がなく、ロジックを記述する手法としてフローチャートがあったのみでした。
構造化プログラミング手法では、 順次・繰り返し・分岐を組み合わせて論理構造を作り上げるものです。このように論理構造を限定化することにより、大量のソースコードの品質を向上することが可能となりました。最近のプログラム言語では、このような構造化プログラミング技法での順次・繰り返し・分岐をif文やwhile文などの構文として組み込まれています。
したがって、CやJava,VisualBasicなどを使ってgoto文を使わずにコーディングすれば、まずは、構造化プログラミング手法に準じたプログラムとなります。
私の知っている人で、ロジックを従来の方法で設計してフローチャートで記述した後、このフローチャートから順次・繰り返し・分岐の構造を作り出した人がいました。しかし、このモジュールの非常に分かり難く、デバッグが非常に困難になってしまいました。このような方法は、構造化プログラミングとは言えません。
登録:
投稿 (Atom)