• R/O
  • HTTP
  • SSH
  • HTTPS

sie: Repository summary

ブラウザでSVGを表示するSIEの開発 (SIE - to display SVG on legacy browsers)


Recent Commits RSS

Rev. Time Author Message
5091c05 2017-06-06 22:20:12 dhrname develop master Edit a ChangeLog.txt
174a28f 2017-06-03 22:17:11 dhrname Modify a bug about the Edge's nodeName attribute problem
e638177 2017-06-03 20:47:44 dhrname Edit the Changelog.txt
8318cd6 2017-05-23 23:12:27 dhrname Edit the ChangeLog.txt
49100ab 2017-05-23 23:09:33 dhrname Build SIE 32 beta
f6049c9 2017-05-17 23:05:24 dhrname Lighten the object
9385d7b 2017-05-16 22:46:56 dhrname Modify the getRotate method on the object
47d042c 2017-05-13 23:29:37 dhrname Add the comment
4dc3c20 2017-05-13 23:21:05 dhrname Modify the Spec and Modify the object
f65ab47 2017-05-13 22:11:10 dhrname Modify the Spec about a setValues method

Recently edited Tags

Name Rev. Time Author
version22 dce7fb8 2015-11-11 20:45:44 dhrname
ver16.0 9b77f77 2014-07-22 20:53:23 dhrname
v16beta 523f9c1 2014-07-06 21:10:07 dhrname

Branches

Name Rev. Time Author Message
develop 5091c05 2017-06-06 22:20:12 dhrname Edit a ChangeLog.txt
master 5091c05 2017-06-06 22:20:12 dhrname Edit a ChangeLog.txt
text cfed4e7 2014-06-17 22:49:27 dhrname base.jsのbase関数とupメソッ...
hotfix 51c7cff 2012-06-11 22:27:42 dhrname minified 1.0beta fixed
Branch_0.92 3ea1a60 2012-01-17 20:29:38 dhrname web site's index page is ed...

Readme.html

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

SIEとは

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

特徴

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

ライセンス

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

ライセンスはオープンソースのMIT Licenceで提供しています。

目次

  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>
    というように。<script defer="defer" type="text/javascript" src="sie.js"></script>
  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>
<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> <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>

動作環境

IE11とEdgeで確認

その他、Firefox49.0.2、Opera41(以上、環境はWindows 10)

注意

必ず、サーバにアップロードしてください。IEのセキュリティ上、ローカルでは動きません。

コミュニティ

メーリングリスト

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

バグの報告先

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

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

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

SIEのパッケージ一覧

  • sie.js (本体)
  • Readme.html (解説のページ)
  • README_EN.txt (解説の英語版)
  • ChangeLog.txt (SIEの変更履歴)
  • tool (補助ツール)
    • sie_php (SVGファイルを直接ブラウザに表示できるPHP。revulo氏が作成)
    • svg-in-html (インラインSVGを実現するスクリプト)
    • SieReader (URLで?の後に指定されたファイル名のSVGを読みとることができるHTML文書)
    • funcproto (非同期処理の操作ができるライブラリ)
  • sie.js.gz (sie.jsをgzipで圧縮したもの)
  • zeimusu_sakra_.svg (SVG形式のサンプル画像)
  • org (ソースコード)
    • sie-uncompressed.js (sie.jsのオリジナルソース)
    • build.js (SIEのモジュールを一つのファイルにして、オリジナルソースを作成するプログラム)
    • w3c (SIEのモジュールを収納したディレクトリ)

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

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