SIE - 標準的な2Dベクタ画像のSVGを表示するJavaScriptライブラリ

SIEとは

SIEとは、標準的な2Dベクタ画像のSVGを表示するためのライブラリです。JavaScript言語で設計されています。プラグインは不要です。例えば、インターネットエクスプローラー（Internet Explorer、以下、IE)やその他のブラウザで、SVGを表示できます。

特徴

  1. クロスブラウザ（IEとFirefoxとOperaとSafari）
  2. プラグインが必要ない
  3. SVG画像を表示できる

ライセンス

無償のオープンソースとして公開しているので、どうぞご自由にお使いください。

ライセンスはオープンソースのMozilla Public Licence（MPL1.1）で提供しています。

目次

  1. 使い方
  2. デモ
  3. 動作環境
  4. 注意
  5. 連絡先

使い方

解凍が終わったら

中身を確認してください。以下のとおりです。SIEの本体は、sie.js です。

準備するもの

HTML文書のページと、SVG画像を作って、用意してください。（今回は、Inkscapeで作られたSVG画像の「zeimusu_sakura_.svg」を用います）

ネットの公開のしかた

  1. HTML文書を、「メモ帳」など、テキスト編集ソフトで開いて、「<script defer="defer" type="text/javascript" src="sie.js"></script>」をhead要素の中に追加してください。たとえば、
    <head> <title>IESVG</title> <script defer="defer" type="text/javascript" src="sie.js"></script></head>
    というように。
  2. さらに、body要素の中に、「<object data="org/svg/zeimusu_sakura_.svg" type="image/svg+xml" width="1000" height="1000"></object>」とコピーして入れます。以下のサンプルのようになります。
  3. 編集したHTML文書とSVG画像、それに、sie.jsをネット上にアップロードすればOKです。必ず、アップロードしてください。

デモ（zeimusu_sakura_.svg）

<html  xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>SIE</title>
<script defer="defer" type="text/javascript" src="sie.js"></script>
<link rel="stylesheet" type="text/css" href="instyle.css"></link>
</head>
<body onLoad="svgtovml()">
<h1>SIE - プラグインなしでIEにSVGを表示する方法</h1>

<h2>デモ（ant.svg）</h2>
<object data="org/svg/zeimusu_sakura_.svg" type="image/svg+xml" width="180" height="200"></object>
    </body>
</html>

動作環境

IE8とIE11で確認

その他、Firefox39、Opera30(以上、環境はWindows 7)

注意

必ず、サーバにアップロードしてください。IEのセキュリティ上、ローカルでは動きません。また、IE6-8をお使いの方はActiveXは有効にしておいてください。

コミュニティ

メーリングリスト

sie-developers@lists.osdn.jp。ログインページはSIEの公式メーリングリスト。

バグの報告先

チケット。バグを追跡できるシステム。

dhrnameの開発日誌。開発ブログです。

http://twitter.com/dhrname。英語で開発のつぶやきを提供しています。

SIEのパッケージ一覧

最後に、revulo氏, bellbind氏と、SourceForge.jpさんに謝意を述べたいと思います。

© Copyright 2003 dhrname（Eメールでsie-developers@lists.sourceforge.jp））。このページの許諾に関しても、SIEと同様のライセンスが適用されるものとします。