2010年9月20日月曜日

VMLを使った簡単な図形エディターを作ってみました。

久しぶりです。今、JavaScriptを使って簡単な図形エディターを作っています。図形の描画については、マイクロソフトが作ったVMLを使っていますが、今後は、SVGにしないといけないかもしれません。ステップ数は、430ステップです。図形描画として直線、矩形、楕円だけですが、グラデーションや立体化、図形の移動などもマウスでできるようになっているので、結構コンパクトにできたと思っています。
文字列や多角形描画機能を入れても1000ステップぐらいになるかと思います。
使い方は、マウスドラッグにより、画面左のメニューに従って、直線・矩形・楕円を描画します。
また、図形をマウスで選択して図形の移動が可能ですが、さらに、マウス右ボタンで描画属性を変えたり、図形を消すこともできます。
図形が作成できたら、画面の中ほどにある「ソース」ボタンをクリックしてVMLタグリストを取り出し、Webページに貼り付けることで図形描画が可能となります。
このエディターを拡張したいとも思いますが、次には、SVG対応のエディターを開発することを先にしたいとも思います。
私のサイトに、このJavaScriptプログラムをアップしました。YawdbaサイトのJavaScriptのVMLエディターから添付ファイルをダウンロードしてIEで動作することができます。一息ついたら、プログラム解説を載せます。お待ちください。

0 件のコメント:

コメントを投稿