民芸的プログラミング 〜ソフトウェア開発日記〜

アクセスカウンタ

zoom RSS Internet Explorer に搭載されている VML について

<<   作成日時 : 2008/09/22 13:07   >>

ブログ気持玉 0 / トラックバック 0 / コメント 2

お客様のところに納品するデータに間違いがあると恥ずかしいので、HTML および xhtml については一通り勉強したつもりでいた。そして、HTML4 にも、xhtml にも、ベクターグラフィックスを扱う要素はないので、Internet Explorer では、ベクターグラフィックスは扱えないと勝手に思い込んでいた。

お客様のブラウザに SVG 用のプラグインをインストールしてくださいとか、いっそのこと Firefox を使ってくださいとか言うわけにはいかないので、状況は絶望的、というか、最初からベクターグラフィックスの不要なソリューションばかりを考えていた。

それが、このたび、たまたま JavaScript ライブラリの jQuery を調べたことで、Internet Exolorer には VML という機能が搭載されており、それを使えばベクターグラフィックスを扱えるということがわかってしまった。

ただし、これを直接使ってしまうと、今度はその HTML(+ VML)を Firefox でレンダリングすることができなくなる。この問題についても、既に答えが用意されていた。
Firefox には、というより HTML5 を先取りしているブラウザ全般には、canvas という要素があって、これでベクターグラフィックスを扱うことができる。canvas 要素の説明は、Mozilla デベロッパーセンターの記事などが充実している。

そして、Internet Explorer の VML 機能をうまくラップして、あたかもこの canvas 要素であるかのように振舞わせることのできる JavaScript ライブラリが用意されているのだ。
ExplorerCanvas という名前で、sourceforge 上のページで開発が進んでいる。これはすごいと思ったら、なるほど、Google 発のプロジェクトだった。

この JavaScript ライブラリがあれば、とりあえず canvas 要素の扱い方だけ知っておけば、棒グラフを描く程度の最低限のベクターグラフィックスは Internet Explorer でも実現可能ということになる。
将来、Internet Explorer の新バージョンに canvas が実装されてもそのまま使い続けられるし、お客様が Firefox を使いたいと言ってきた場合にも対応できる。

というわけで、がんばって canvas 要素の使い方をこれから勉強しなければ。

なお、VML自体はその後、規格が SVG に発展・吸収されてしまったため、VML そのものについてのネット上の資料は決して充実してはいない。まとまっているのは MSDN か、とほほのVML入門くらいだ。多分、もう直接利用されることはないだろう。
しかし、今後、万が一の場合に、これを知っておくことが何らかの助けになるかも知れないので、ここにメモを残しておく。

テーマ

関連テーマ 一覧


月別リンク

ブログ気持玉

クリックして気持ちを伝えよう!
ログインしてクリックすれば、自分のブログへのリンクが付きます。
→ログインへ

トラックバック(0件)

タイトル (本文) ブログ名/日時

トラックバック用URL help


自分のブログにトラックバック記事作成(会員用) help

タイトル
本 文

コメント(2件)

内 容 ニックネーム/日時
SVG2VMLのSIEも紹介しておきます。
http://sie.sourceforge.jp/
dhrname
2008/09/25 19:40
これはこれは面白いライブラリの紹介、ありがとうございます。作者さんご本人ですね。
早速デモ画面を見せていただきました。
このライブラリ、Google Chrome でも動作するみたいですね。Safari で動作するのですから当然といえば当然ですが。

まだちら見しかしていないのですが、IE6 に対応していないというのがやや気になっております。
このブログのアクセス解析でも、IE7 と 6 の割合は 4:6 で、まだ過半数が IE6 ですし、業務でも、IE6 対応は常に求められますしで。
kazuyoshikakihara
2008/09/26 09:19

コメントする help

ニックネーム
本 文
Internet Explorer に搭載されている VML について 民芸的プログラミング 〜ソフトウェア開発日記〜/BIGLOBEウェブリブログ
文字サイズ:       閉じる