« 2012年10月 | トップページ | 2013年4月 »

2012年12月

2012年12月 1日 (土)

SVG ファイルへのアクセスを受け付けるようになった

ビリヤード配置図ソフト FlatTable は @nifty のレンタル・サーバーに置いているのですが、SVG ファイルを提供するためには .htaccess に MIME タイプを記述しておく必要が有ります。記述内容をインターネットで調べてその通りやったのですが、サーバーが SVG ファイルを処理してくれません。 .htaccess で SVG 関連の箇所は次の1行です。

AddType image/svg+xml .svg
この記述に間違いは有りません。しかし、ブラウザで SVG ファイルにアクセスしようとしても表示しないのです。しかたなく FlatTable の公開は HTML ファイルとして行っていました。

数か月その状態が続いていたのですが、やっと解決することが出来ました。今まで .htaccess の文字のエンコードは UTF-8 にしていたのですが、これだと BOM が悪さをするかも知れないということが某サイトに載っていました。そこでエンコードを EUC に変更したところ、めでたくサーバーが SVG ファイルへのアクセスを受け付けるようになりました。

そこで、早速 FlatTable を書き換えて SVG ファイルに変更しました(サフィックスは .svg )。書き換えた箇所は次の通りです。

変更前(ファイルの先頭箇所)
<!DOCTYPE html>
<html>

<head>
    <lmeta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="keywords" content="ビリヤード, 配置図, pool, billiard, diagram, layout, FlatTable" />
    <title>FlatTable_P</title>
    <link rel="shortcut icon" href="../favicon.ico" />
</head>>

<body style="margin:0">

<svg
変更後(ファイルの先頭箇所)
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg
    xmlns:svg="http://www.w3.org/2000/svg"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink"
    ・・・ />

   <title>FlatTable_P</title>
<title>head 領域から svg 領域に移動しています。 SVG ファイルでのアイコンの設定方法が分らない(出来ないのかも?)ので、その部分は削除しています。
変更前(ファイルの末尾)
</svg>

<script>

(function (){                // (1)
    var win = navigator.userAgent.indexOf("MSIE");
    if (0<= win){
        var ft = document.getElementById("flattable");
        ft.setAttribute("height", document.body.clientHeight*3.5);
    }
})();

・・・

</script>
<script src="js/FToperate.js"></script>
<script src="js/FTpeep.js"></script>
<script src="js/FTencode.js"></script>
<script src="js/FTinit.js"></script>
<script src="js/FTanimation.js"></script>

</body>
</html>
変更後(ファイルの末尾)
<script>
<![CDATA[

・・・

]]>
</script>
<script xlink:href="js/FToperate.js" />
<script xlink:href="js/FTpeep.js" />
<script xlink:href="js/FTencode.js" />
<script xlink:href="js/FTinit.js" />
<script xlink:href="js/FTanimation.js" />

</svg>

変更前のコードで (1) の関数はIE対応のためのコードでした。 FlatTable が HTML5(or XHTML) の時IEでは小さく表示されるので、画像を拡大するためにこのコードが必要でした。 SVG になったら、このコードが無くても正常な大きさで表示されるので削除しました。

これで、当初の計画通り、 FlatTable を SVG ファイルとして公開することが出来るようになりました。 FlatTable は、本ブログのサイドバー「Link」の FlatTable からアクセス出来ます。

« 2012年10月 | トップページ | 2013年4月 »