トップページ   関連リンク: okFigEdit 

okFigEdit -- CAD in JavaScript

 このページの筆者 OK おじさんは、 アルゴリズム関連のホームページも幾つか作っています。 そうしたページで、 木構造のアルゴリズムとか解説する際には図による説明が欠かせません。 そこで、お絵描きツールで図を作ることになるのですが、 代表的なフリーのツールは、どれも高機能過ぎてかえって不便に感じます。 アートを描いたりするには高機能でないとまずいのでしょうが、 アルゴリズム系の図を描くには、これらのツールはオーバースペックです。 かと言って、落書きしか描けないおもちゃでは不十分です。

 そこで、自分が使うことを念頭に、 アルゴリズム系の図を描くためのお絵描きツールを作って見ました。 こんな図が簡単に描けます。

 
 
【作図例】

 ちなみに、この図のフォーマットは SVG です。 対応ブラウザで見ると、線がめちゃくちゃシャープできれいです。 okFigEdit は SVG の出力に対応しています。 その他、PNG, JSON でも出力できます。 また、okFigEdit は JavaScript で実装されていますので、 Web ブラウザがあれば動作します。Windows を使っているか、 Mac OS X を使っているか、Linux を使っているかなど、 OS を選びません。さらに、 ノートパソコンのタッチパッドでも操作しやすいように、 キーボード操作をデザインしてあります。 MacBook などでもマウスレスで簡単に図が描けます。

 okFigEdit を作る上で、参考にしたのは Jw_cad です。 線とその交点を基点に図を編集するあの操作性が、 アルゴリズム系の図を描くにはピッタリだと思ったからです。 でも不思議なことに、簡単なお絵描きツールでは、 Jw_cad 的なコンセプトのツールって、あまり見かけないんですよね。

 okFigEdit は、 このリンク からアクセスできます。 是非一度お試しください。対応ブラウザは、 Google Chrome, Firefox, Safari です。残念ながら IE では動きません。 HTML5 で書きましたので、 上記対応ブラウザでも古いバージョンだと動かないかもしれません。

 実装を簡単にすませたかったので、操作性に多少癖があります。 使い方が分からないときは、ヘルプボタンを押して ヘルプ を参照してください。


トップページ   関連リンク: okFigEdit